- some more files w.r.t. help

- fixed issue #3 https://github.com/Doodle3D/doodle3d-client/issues/3

less/base.less

@@ -6,8 +6,6 @@
 body {
   background-color: #fcfcfc;
   user-select: none; /* disable cut copy paste */
-//  -moz-user-select: none; /* disable cut copy paste */
-//  -webkit-user-select: none; /* disable cut copy paste */
   overflow:hidden; /* This chops off any overhanging divs */
 }
 img {

less/jquery-tourbus.less

@@ -0,0 +1,144 @@
+/* Tourbus leg definitions element */
+.tourbus-legs {
+  display: none;
+}
+/* Container for tourbus leg */
+.tourbus-leg {
+  position: absolute;
+  visibility: hidden;
+  top: 0;
+  border: 1px solid #E5E5E5;
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.45);
+  border-radius: 4px;
+  background: white;
+}
+/* Interior of leg, clearfixed */
+.tourbus-leg-inner {
+  padding: 20px;
+  position: relative;
+  zoom: 1;
+}
+.tourbus-leg-inner:before,
+.tourbus-leg-inner:after {
+  content: "\0020";
+  display: block;
+  height: 0;
+  overflow: hidden;
+}
+.tourbus-leg-inner:after {
+  clear: both;
+}
+
+.prevnextBtn  {
+	border: 1px solid #8e8e8e;
+	color: #252525;
+	border-radius: 4px;
+	padding: 4px 8px;
+	background-color: #eaeaea;
+	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
+	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
+	box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
+	margin-right: 8px;
+}
+/*
+  remove top padding/margin on headings
+  because the interior of the leg has padding
+*/
+.tourbus-leg h1,
+.tourbus-leg h2,
+.tourbus-leg h3,
+.tourbus-leg h4,
+.tourbus-leg h5,
+.tourbus-leg h6 {
+  margin-top: 0;
+  padding-top: 0;
+}
+/* Tourbus leg arrow */
+.tourbus-arrow:before,
+.tourbus-arrow:after {
+  border: solid rgba(0, 0, 0, 0);
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+  border-color: transparent;
+}
+/* set the :after to be the _interior_ size of the arrow */
+/* set the :before to be the _interior + desired border width_ */
+.tourbus-arrow:after {
+  border-width: 14px;
+}
+.tourbus-arrow:before {
+  border-width: 16px;
+}
+/* Arrow background and border colors */
+/*
+  change margin-top/left values here to
+  match the border width for :after above
+
+  border colors here are for the _interior_ of the arrow
+*/
+.tourbus-arrow-right:after {
+  border-right-color: #ffffff;
+  margin-top: -14px;
+  top: 50%;
+}
+.tourbus-arrow-left:after {
+  border-left-color: #ffffff;
+  margin-top: -14px;
+  top: 50%;
+}
+.tourbus-arrow-bottom:after {
+  border-bottom-color: #ffffff;
+  margin-left: -14px;
+  left: 50%;
+}
+.tourbus-arrow-top:after {
+  border-top-color: #ffffff;
+  margin-left: -14px;
+  left: 50%;
+}
+/*
+  change margin-top/left values here to
+  match the border width for :before above
+
+  border colors here are for the _border_ of the arrow
+*/
+.tourbus-arrow-right:before {
+  border-right-color: #e5e5e5;
+  margin-top: -16px;
+  top: 50%;
+}
+.tourbus-arrow-left:before {
+  border-left-color: #e5e5e5;
+  margin-top: -16px;
+  top: 50%;
+}
+.tourbus-arrow-bottom:before {
+  border-bottom-color: #e5e5e5;
+  margin-left: -16px;
+  left: 50%;
+}
+.tourbus-arrow-top:before {
+  border-top-color: #e5e5e5;
+  margin-left: -16px;
+  left: 50%;
+}
+/* you shouldn't need to change these */
+.tourbus-arrow-right:after,
+.tourbus-arrow-right:before {
+  right: 100%;
+}
+.tourbus-arrow-left:after,
+.tourbus-arrow-left:before {
+  left: 100%;
+}
+.tourbus-arrow-bottom:after,
+.tourbus-arrow-bottom:before {
+  bottom: 100%;
+}
+.tourbus-arrow-top:after,
+.tourbus-arrow-top:before {
+  top: 100%;
+}

less/settingsPopup.less

@@ -14,6 +14,7 @@
   width: 100%;
   height: 100%;
   display:none;
+  user-select: text;
 
   #settings {
     background-color: #fff;

less/styles.less

@@ -23,3 +23,5 @@
 @media  only screen and (orientation:portrait) {
   @import "portrait.less";
 }
+
+@import "jquery-tourbus.less";

www/css/settings.min.css

@@ -1 +1 @@
-form{margin:10px;max-width:600px}form input{margin:1px}body,th,td{font-family:Helvetica,Arial,"Nimbus Sans L",sans-serif;font-size:13px}.settingsContainer{position:relative;width:100%;height:100%}form fieldset{max-width:600px;border:1px solid #bbb;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;margin-bottom:20px;padding:8px}form fieldset fieldset{max-width:580px;margin:15px 0 5px;clear:left;float:left}form fieldset legend{margin-left:10px;font-weight:700}form label{min-width:150px;display:block;float:left;margin:1px 0 0;clear:left}form div{float:left}form input[type=text],form input[type=number],form input[type=password]{border:1px solid #90c0ff;margin-right:5px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}form input[type=text].small,form input[type=number].small,form input[type=password].small{width:50px}form input[type=text].large,form input[type=number].large,form input[type=password].large{width:250px}form input[type=radio]{margin:4px 4px 0 0}form textarea{border:1px solid #90c0ff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}form .startgcode_left{float:left;margin-right:20px}form textarea.gcode{width:252px;height:150px}form small{margin:3px 0 0;display:block;clear:left}form .button{display:inline-block}form #passwordLabel,form #password{display:none}form input.error,form textarea.error,form select.error{border:red solid 2px}form .errorMsg{color:red;margin:0 0 0 1em}
+form{margin:10px;max-width:600px}form input{margin:1px}body,th,td{font-family:Helvetica,Arial,"Nimbus Sans L",sans-serif;font-size:13px}.settingsContainer{position:relative;width:100%;height:100%}form fieldset{max-width:600px;border:1px solid #bbb;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;margin-bottom:20px;padding:8px}form fieldset fieldset{max-width:580px;margin:15px 0 5px;clear:left;float:left}form fieldset legend{margin-left:10px;font-weight:700}form label{min-width:150px;display:block;float:left;margin:1px 0 0;clear:left}form div{float:left}form input[type=text],form input[type=number],form input[type=password]{border:1px solid #90c0ff;margin-right:5px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}form input[type=text].small,form input[type=number].small,form input[type=password].small{width:50px}form input[type=text].large,form input[type=number].large,form input[type=password].large{width:250px}form input[type=radio]{margin:4px 4px 0 0}form textarea{border:1px solid #90c0ff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}form .startgcode_left{float:left;margin-right:20px}form textarea.gcode{width:252px;height:150px}form small{margin:3px 0 0;display:block;clear:left}form .button{display:inline-block}form #passwordLabel,form #password{display:none}form input.error,form textarea.error,form select.error{border:red solid 2px}form .errorMsg{color:red;margin:0 0 0 1em}form dl dt{float:left;font-style:italic;width:10em}

www/css/styles.css

@@ -573,6 +573,10 @@ img {
   width: 100%;
   height: 100%;
   display: none;
+  -webkit-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
 }
 
 #contentOverlay #settings {
@@ -875,4 +879,180 @@ img {
     width: auto;
     /* for ie9 */
   }
+}
+
+/* Tourbus leg definitions element */
+
+.tourbus-legs {
+  display: none;
+}
+
+/* Container for tourbus leg */
+
+.tourbus-leg {
+  position: absolute;
+  visibility: hidden;
+  top: 0;
+  border: 1px solid #E5E5E5;
+  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.45);
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.45);
+  border-radius: 4px;
+  background: white;
+}
+
+/* Interior of leg, clearfixed */
+
+.tourbus-leg-inner {
+  padding: 20px;
+  position: relative;
+  zoom: 1;
+}
+
+.tourbus-leg-inner:before,
+.tourbus-leg-inner:after {
+  content: "\0020";
+  display: block;
+  height: 0;
+  overflow: hidden;
+}
+
+.tourbus-leg-inner:after {
+  clear: both;
+}
+
+.prevnextBtn {
+  border: 1px solid #8e8e8e;
+  color: #252525;
+  border-radius: 4px;
+  padding: 4px 8px;
+  background-color: #eaeaea;
+  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
+  box-shadow: 0 0 3px rgba(0, 0, 0, 0.7);
+  margin-right: 8px;
+}
+
+/*
+  remove top padding/margin on headings
+  because the interior of the leg has padding
+*/
+
+.tourbus-leg h1,
+.tourbus-leg h2,
+.tourbus-leg h3,
+.tourbus-leg h4,
+.tourbus-leg h5,
+.tourbus-leg h6 {
+  margin-top: 0;
+  padding-top: 0;
+}
+
+/* Tourbus leg arrow */
+
+.tourbus-arrow:before,
+.tourbus-arrow:after {
+  border: solid rgba(0, 0, 0, 0);
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+  border-color: transparent;
+}
+
+/* set the :after to be the _interior_ size of the arrow */
+
+/* set the :before to be the _interior + desired border width_ */
+
+.tourbus-arrow:after {
+  border-width: 14px;
+}
+
+.tourbus-arrow:before {
+  border-width: 16px;
+}
+
+/* Arrow background and border colors */
+
+/*
+  change margin-top/left values here to
+  match the border width for :after above
+
+  border colors here are for the _interior_ of the arrow
+*/
+
+.tourbus-arrow-right:after {
+  border-right-color: #ffffff;
+  margin-top: -14px;
+  top: 50%;
+}
+
+.tourbus-arrow-left:after {
+  border-left-color: #ffffff;
+  margin-top: -14px;
+  top: 50%;
+}
+
+.tourbus-arrow-bottom:after {
+  border-bottom-color: #ffffff;
+  margin-left: -14px;
+  left: 50%;
+}
+
+.tourbus-arrow-top:after {
+  border-top-color: #ffffff;
+  margin-left: -14px;
+  left: 50%;
+}
+
+/*
+  change margin-top/left values here to
+  match the border width for :before above
+
+  border colors here are for the _border_ of the arrow
+*/
+
+.tourbus-arrow-right:before {
+  border-right-color: #e5e5e5;
+  margin-top: -16px;
+  top: 50%;
+}
+
+.tourbus-arrow-left:before {
+  border-left-color: #e5e5e5;
+  margin-top: -16px;
+  top: 50%;
+}
+
+.tourbus-arrow-bottom:before {
+  border-bottom-color: #e5e5e5;
+  margin-left: -16px;
+  left: 50%;
+}
+
+.tourbus-arrow-top:before {
+  border-top-color: #e5e5e5;
+  margin-left: -16px;
+  left: 50%;
+}
+
+/* you shouldn't need to change these */
+
+.tourbus-arrow-right:after,
+.tourbus-arrow-right:before {
+  right: 100%;
+}
+
+.tourbus-arrow-left:after,
+.tourbus-arrow-left:before {
+  left: 100%;
+}
+
+.tourbus-arrow-bottom:after,
+.tourbus-arrow-bottom:before {
+  bottom: 100%;
+}
+
+.tourbus-arrow-top:after,
+.tourbus-arrow-top:before {
+  top: 100%;
 }