diff --git a/css/interactivetutorial.css b/css/interactivetutorial.css new file mode 100644 index 000000000..4e2de6828 --- /dev/null +++ b/css/interactivetutorial.css @@ -0,0 +1,50 @@ +/* interactivetutorial.css */ +#interactive-tutorial-container { + display: none; + position: fixed; /* Stay in place */ + left: 0; + top: 0; + height: 100%; /* Full height */ + margin: 20% auto; + padding: 10px; + border: 5px solid #FFFFFF; + width: 40%; + overflow: auto; /* Enable scroll if needed */ + background-color: black; /* Fallback color */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ +} + +#interactive-tutorial-text { + +} + +#interactive-tutorial-exit, +#interactive-tutorial-next { + color: #aaa; + font-size: 20px; + font-weight: bold; + -webkit-border-radius: 12px; + -moz-border-radius: 12px; + border-radius: 12px; + -moz-box-shadow: 1px 1px 3px #000; + -webkit-box-shadow: 1px 1px 3px #000; + box-shadow: 1px 1px 3px #000; +} + +#interactive-tutorial-exit { + float: left; +} + +#interactive-tutorial-next { + float: right; +} + +#interactive-tutorial-exit:hover, +#interactive-tutorial-exit:focus, +#interactive-tutorial-next:hover, +#interactive-tutorial-next:focus { + color: white; + text-decoration: none; + cursor: pointer; +} + diff --git a/css/popupboxes.css b/css/popupboxes.css index b3a6d15d4..5b6e6d1fe 100644 --- a/css/popupboxes.css +++ b/css/popupboxes.css @@ -16,7 +16,7 @@ #dialog-box-content { background-color: black; - margin: 20% auto; /* 15% from the top and centered */ + margin: 20% auto; /* 20% from the top and centered */ padding: 10px; border: 5px solid #FFFFFF; width: 40%; /* Could be more or less, depending on screen size */ diff --git a/index.html b/index.html index 0d3a402b8..1a4ccd4d1 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,7 @@ + @@ -655,5 +656,12 @@
+ ++ Exit tutorial + Continue +