Fixed tutorial design
diff --git a/public/scss/tutorial.scss b/public/scss/tutorial.scss
index 74937fc..0b03cd0 100644
--- a/public/scss/tutorial.scss
+++ b/public/scss/tutorial.scss
@@ -1,11 +1,7 @@
@charset "utf-8";
@import "util";
-$border-size: 3px;
-
-body.embedded {
- background-color: $nearly-white;
-}
+$border-size: 2px;
#tutorial {
position: fixed;
@@ -15,22 +11,28 @@
left: 2%;
right: 2%;
padding-right: $right-match-distance;
+/*
+ padding: 0;
+ margin: 0;
+*/
background-color: $nearly-white;
ul.action {
+ background-color: $middle-grey;
display: block;
}
border: {
- width: $border-size;
- color: $dark-orange;
+ width: 2 * $border-size;
+// color: $dark-orange;
+ color: $dark-grey;
style: solid;
radius: $standard-border-radius;
}
box-shadow: $choose-box-shadow;
iframe {
- margin: 0;
- width: 100%;
- min-height: 100%;
border-width: 0;
+ width: 100%;
+ // Hack for a Firefox bug
+ min-height: 100.1%;
background: {
image:url('#{$img-path}/korap-bg-kalamar.svg');
repeat: no-repeat;
@@ -40,6 +42,29 @@
}
}
+body.embedded {
+ background-color: $nearly-white;
+ #sidebar {
+/*
+ border-right: {
+ width: $border-size;
+ style: solid;
+ }
+*/
+ padding-top: 0;
+ // @include choose-item;
+ background-color: $middle-grey;
+ > div {
+ position: relative;
+ top: 50%;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
+ // margin-right: -1 * $border-size;
+ }
+ }
+}
+
main.tutorial {
margin-left: $logo-left-distance + 15px;
}