2018-07-16 10:38:14 -04:00
|
|
|
@import "mixins";
|
2018-07-16 23:59:25 -04:00
|
|
|
@import "theme";
|
2018-07-16 10:38:14 -04:00
|
|
|
|
2017-05-05 16:27:35 -05:00
|
|
|
/* interactivetutorial.css */
|
2017-05-20 22:45:36 -05:00
|
|
|
#interactive-tutorial-wrapper {
|
2018-07-09 16:42:54 -04:00
|
|
|
position: relative;
|
2017-05-20 22:45:36 -05:00
|
|
|
}
|
|
|
|
|
2017-05-05 16:27:35 -05:00
|
|
|
#interactive-tutorial-container {
|
|
|
|
display: none;
|
2017-05-20 22:45:36 -05:00
|
|
|
position: absolute; /* Stay in place */
|
2017-05-06 01:24:01 -05:00
|
|
|
right: 0;
|
2017-05-05 16:27:35 -05:00
|
|
|
top: 0;
|
2018-08-29 14:06:21 -05:00
|
|
|
height: 450px;
|
2017-05-05 16:27:35 -05:00
|
|
|
padding: 10px;
|
2018-07-09 16:11:18 -04:00
|
|
|
border: 5px solid #fff;
|
2018-08-29 14:06:21 -05:00
|
|
|
width: 23%;
|
2018-08-24 11:48:15 -04:00
|
|
|
overflow: hidden;
|
2017-05-06 01:24:01 -05:00
|
|
|
background-color: #444; /* Fallback color */
|
2018-07-09 16:11:18 -04:00
|
|
|
color: #fff;
|
2017-05-05 16:27:35 -05:00
|
|
|
|
2018-07-17 11:40:14 -04:00
|
|
|
> strong {
|
|
|
|
background-color: #444;
|
|
|
|
}
|
2017-05-17 00:31:42 -05:00
|
|
|
}
|
|
|
|
|
2017-05-05 16:27:35 -05:00
|
|
|
#interactive-tutorial-text {
|
2017-05-06 01:24:01 -05:00
|
|
|
padding: 4px;
|
|
|
|
margin: 4px;
|
2018-07-09 16:11:18 -04:00
|
|
|
color: #fff;
|
2017-05-06 01:24:01 -05:00
|
|
|
background-color: #444;
|
2018-08-29 14:06:21 -05:00
|
|
|
font-size: $defaultFontSize * 0.875;
|
|
|
|
max-height: 350px;
|
|
|
|
overflow-y: auto;
|
2017-05-05 16:27:35 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
#interactive-tutorial-exit,
|
2017-05-15 00:09:14 -05:00
|
|
|
#interactive-tutorial-next,
|
|
|
|
#interactive-tutorial-back {
|
2018-07-16 10:38:14 -04:00
|
|
|
@include borderRadius(12px);
|
2018-07-16 11:28:09 -04:00
|
|
|
@include boxShadow(1px 1px 3px #000);
|
2018-07-16 10:38:14 -04:00
|
|
|
|
2017-05-05 16:27:35 -05:00
|
|
|
color: #aaa;
|
2018-08-29 14:06:21 -05:00
|
|
|
font-size: $defaultFontSize * 1.125;
|
2017-05-05 16:27:35 -05:00
|
|
|
font-weight: bold;
|
2018-07-09 16:42:54 -04:00
|
|
|
background-color: #000;
|
2018-07-17 11:40:14 -04:00
|
|
|
|
|
|
|
&:hover,
|
|
|
|
&:focus {
|
|
|
|
color: #fff;
|
|
|
|
text-decoration: none;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
2017-05-05 16:27:35 -05:00
|
|
|
}
|
|
|
|
|
2018-08-29 14:06:21 -05:00
|
|
|
#interactive-tutorial-exit {
|
2018-08-24 11:48:15 -04:00
|
|
|
position: absolute;
|
2018-08-29 14:06:21 -05:00
|
|
|
bottom: 0;
|
2018-08-24 11:48:15 -04:00
|
|
|
left: 0;
|
2018-10-03 13:09:11 -05:00
|
|
|
padding: 4px;
|
2018-08-29 14:06:21 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
#interactive-tutorial-back {
|
|
|
|
float: left;
|
2018-10-03 13:09:11 -05:00
|
|
|
padding: 4px;
|
2018-08-29 14:06:21 -05:00
|
|
|
}
|
2017-05-15 00:09:14 -05:00
|
|
|
|
2017-05-05 16:27:35 -05:00
|
|
|
#interactive-tutorial-next {
|
|
|
|
float: right;
|
2018-10-03 13:09:11 -05:00
|
|
|
padding: 4px;
|
2017-05-05 16:27:35 -05:00
|
|
|
}
|