]> git.proxmox.com Git - sencha-touch.git/blobdiff - src/resources/themes/vendor/compass-recipes/tests/recipes/ui/keyboard/s.css
import Sencha Touch 2.4.2 source
[sencha-touch.git] / src / resources / themes / vendor / compass-recipes / tests / recipes / ui / keyboard / s.css
diff --git a/src/resources/themes/vendor/compass-recipes/tests/recipes/ui/keyboard/s.css b/src/resources/themes/vendor/compass-recipes/tests/recipes/ui/keyboard/s.css
new file mode 100644 (file)
index 0000000..01497f4
--- /dev/null
@@ -0,0 +1,122 @@
+html {
+  padding: 1em;
+  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dddddd), color-stop(100%, #ffffff)) no-repeat;
+  background: -webkit-linear-gradient(#dddddd, #ffffff) no-repeat;
+  background: -moz-linear-gradient(#dddddd, #ffffff) no-repeat;
+  background: -o-linear-gradient(#dddddd, #ffffff) no-repeat;
+  background: -ms-linear-gradient(#dddddd, #ffffff) no-repeat;
+  background: linear-gradient(#dddddd, #ffffff) no-repeat;
+}
+
+h1 {
+  font-size: 2em;
+  margin-bottom: 1em;
+}
+
+h2 {
+  font-size: 1.4em;
+  margin-bottom: .6em;
+}
+
+.doc {
+  background: #fff;
+  border: #ddd;
+  padding: 1em;
+  color: #aaa;
+  margin: 1em;
+  font-style: italic;
+}
+.doc a {
+  color: #999;
+}
+
+/**
+ * Keyboard key touch
+ * A simple stylesheet for rendering beautiful keyboard-style elements.
+
+ * @author Michael Hüneburg http://michaelhue.com/keyscss
+ * @link https://github.com/michaelhue/keyscss (commit 76bb603e921d0145362e0f60eabb79d4f69cbda0)
+ *
+ * @author Maxime Thirouin @MoOx maxime.thirouin@gmail.com
+*/
+kbd {
+  padding: .2em .3em;
+  min-width: 1em;
+  font: normal 0.85em "Lucida Grande", Lucida, Arial, sans-serif;
+  text-align: center;
+  -moz-border-radius: 0.25em;
+  -webkit-border-radius: 0.25em;
+  -o-border-radius: 0.25em;
+  -ms-border-radius: 0.25em;
+  -khtml-border-radius: 0.25em;
+  border-radius: 0.25em;
+  border: none;
+  display: inline;
+  display: inline-block;
+  text-decoration: none;
+  cursor: default;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  user-select: none;
+  background: #fafafa;
+  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d2d2d2), color-stop(100%, #ffffff));
+  background: -webkit-linear-gradient(top, #d2d2d2, #ffffff);
+  background: -moz-linear-gradient(top, #d2d2d2, #ffffff);
+  background: -o-linear-gradient(top, #d2d2d2, #ffffff);
+  background: -ms-linear-gradient(top, #d2d2d2, #ffffff);
+  background: linear-gradient(top, #d2d2d2, #ffffff);
+  color: #444;
+  text-shadow: 0 0 2px white;
+  /*@include box-shadow(
+      inset 0 0 1px #fff,
+      inset 0 0 .4em rgb(200, 200, 200),
+      0 .1em 0 rgb(130, 130, 130),
+      0 .11em 0 rgba(#000, .4),
+      0 .1em .11em rgba(#000, .9)
+          );
+  */
+  -moz-box-shadow: inset 0 0 25px #e8e8e8, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 2px 3px #333333;
+  -webkit-box-shadow: inset 0 0 25px #e8e8e8, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 2px 3px #333333;
+  -o-box-shadow: inset 0 0 25px #e8e8e8, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 2px 3px #333333;
+  box-shadow: inset 0 0 25px #e8e8e8, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 2px 3px #333333;
+  text-shadow: 0px 1px 0px #f5f5f5;
+}
+kbd[title] {
+  cursor: help;
+}
+.ui-keyboard-dark kbd {
+  padding: .2em .3em;
+  min-width: 1em;
+  font: normal 0.85em "Lucida Grande", Lucida, Arial, sans-serif;
+  text-align: center;
+  -moz-border-radius: 0.25em;
+  -webkit-border-radius: 0.25em;
+  -o-border-radius: 0.25em;
+  -ms-border-radius: 0.25em;
+  -khtml-border-radius: 0.25em;
+  border-radius: 0.25em;
+  border: none;
+  display: inline;
+  display: inline-block;
+  text-decoration: none;
+  cursor: default;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  user-select: none;
+  background: #505050;
+  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3c3c3c), color-stop(100%, #505050));
+  background: -webkit-linear-gradient(#3c3c3c, #505050);
+  background: -moz-linear-gradient(#3c3c3c, #505050);
+  background: -o-linear-gradient(#3c3c3c, #505050);
+  background: -ms-linear-gradient(#3c3c3c, #505050);
+  background: linear-gradient(#3c3c3c, #505050);
+  color: #fafafa;
+  text-shadow: -1px -1px 0 #464646;
+  -moz-box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);
+  -o-box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);
+  box-shadow: inset 0 0 1px #969696, inset 0 -0.05em 0.4em #505050, 0 0.1em 0 #1e1e1e, 0 0.1em 0.1em rgba(0, 0, 0, 0.3);
+}
+.ui-keyboard-dark kbd[title] {
+  cursor: help;
+}