|
|
@@ -0,0 +1,567 @@
|
|
|
+/**
|
|
|
+ * Stylesheet
|
|
|
+ *
|
|
|
+ * @namespace Lungo.Theme
|
|
|
+ * @class Default
|
|
|
+ *
|
|
|
+ * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
|
|
|
+ */
|
|
|
+@import url("http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700");
|
|
|
+/* -------------------------- THEME -------------------------- */
|
|
|
+body {
|
|
|
+ background-color: #222;
|
|
|
+ font-family: "Helvetica Neue", "Open Sans", Helvetica, Arial, sans-serif;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 13px;
|
|
|
+ line-height: 1.3em;
|
|
|
+ letter-spacing: -0.05em;
|
|
|
+}
|
|
|
+.theme,
|
|
|
+li.theme,
|
|
|
+a.theme {
|
|
|
+ background-color: THEME-light;
|
|
|
+}
|
|
|
+.theme:active,
|
|
|
+li.theme:active,
|
|
|
+a.theme:active {
|
|
|
+ background-color: #0093d5;
|
|
|
+}
|
|
|
+[data-control="pull"] {
|
|
|
+ color: #666;
|
|
|
+ -webkit-text-shadow: 0 1px 0 #fff;
|
|
|
+ -moz-text-shadow: 0 1px 0 #fff;
|
|
|
+ text-shadow: 0 1px 0 #fff;
|
|
|
+}
|
|
|
+/* -------------------------- LAYOUT COLORS -------------------------- */
|
|
|
+section > header {
|
|
|
+ background-color: #0093d5;
|
|
|
+ -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #03b1ff, inset 0 -1px 0 #007db5;
|
|
|
+ -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #03b1ff, inset 0 -1px 0 #007db5;
|
|
|
+ box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #03b1ff, inset 0 -1px 0 #007db5;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+section > footer,
|
|
|
+section nav.groupbar {
|
|
|
+ background-color: #222;
|
|
|
+ -webkit-box-shadow: inset 0 3px 0 #1d1d1d;
|
|
|
+ -moz-box-shadow: inset 0 3px 0 #1d1d1d;
|
|
|
+ box-shadow: inset 0 3px 0 #1d1d1d;
|
|
|
+}
|
|
|
+section > article,
|
|
|
+section > [data-control="pull"] {
|
|
|
+ background-color: #f4f5f5;
|
|
|
+}
|
|
|
+section > article.splash,
|
|
|
+section > [data-control="pull"].splash {
|
|
|
+ background: #0093d5;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+section.aside {
|
|
|
+ -webkit-box-shadow: -1px 0 2px rgba(0,0,0,0.2);
|
|
|
+ -moz-box-shadow: -1px 0 2px rgba(0,0,0,0.2);
|
|
|
+ box-shadow: -1px 0 2px rgba(0,0,0,0.2);
|
|
|
+}
|
|
|
+section.aside.right {
|
|
|
+ -webkit-box-shadow: 1px 0 2px rgba(0,0,0,0.2);
|
|
|
+ -moz-box-shadow: 1px 0 2px rgba(0,0,0,0.2);
|
|
|
+ box-shadow: 1px 0 2px rgba(0,0,0,0.2);
|
|
|
+}
|
|
|
+aside {
|
|
|
+ background-color: #1d1d1d;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+aside > header,
|
|
|
+aside > footer {
|
|
|
+ background-color: #181818;
|
|
|
+}
|
|
|
+aside > header {
|
|
|
+ -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #222, inset 0 -1px 0 #141414;
|
|
|
+ -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #222, inset 0 -1px 0 #141414;
|
|
|
+ box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 #222, inset 0 -1px 0 #141414;
|
|
|
+}
|
|
|
+/* -------------------------- NAVIGATION -------------------------- */
|
|
|
+section > header > nav a {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+section > header > nav.box:not(.right) a {
|
|
|
+ -webkit-box-shadow: 1px 0 0 #03b1ff, inset -1px 0 0 #007db5;
|
|
|
+ -moz-box-shadow: 1px 0 0 #03b1ff, inset -1px 0 0 #007db5;
|
|
|
+ box-shadow: 1px 0 0 #03b1ff, inset -1px 0 0 #007db5;
|
|
|
+}
|
|
|
+section > header > nav.box.right a {
|
|
|
+ -webkit-box-shadow: -1px 0 0 #03b1ff, inset 1px 0 0 #007db5;
|
|
|
+ -moz-box-shadow: -1px 0 0 #03b1ff, inset 1px 0 0 #007db5;
|
|
|
+ box-shadow: -1px 0 0 #03b1ff, inset 1px 0 0 #007db5;
|
|
|
+}
|
|
|
+section > header > nav.box a:active {
|
|
|
+ background: #007db5;
|
|
|
+}
|
|
|
+section > nav.groupbar > a.active {
|
|
|
+ -webkit-box-shadow: inset 0 -3px 0 #0093d5;
|
|
|
+ -moz-box-shadow: inset 0 -3px 0 #0093d5;
|
|
|
+ box-shadow: inset 0 -3px 0 #0093d5;
|
|
|
+}
|
|
|
+section > footer > nav > a,
|
|
|
+nav.groupbar > a {
|
|
|
+ color: #888;
|
|
|
+}
|
|
|
+section > footer > nav > a.active,
|
|
|
+nav.groupbar > a.active {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+section > footer > nav > a {
|
|
|
+ -webkit-box-shadow: 1px 0 0 #1d1d1d;
|
|
|
+ -moz-box-shadow: 1px 0 0 #1d1d1d;
|
|
|
+ box-shadow: 1px 0 0 #1d1d1d;
|
|
|
+}
|
|
|
+section > footer > nav > a.active {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #1d1d1d;
|
|
|
+ -webkit-box-shadow: inset 0 3px 0 #0093d5;
|
|
|
+ -moz-box-shadow: inset 0 3px 0 #0093d5;
|
|
|
+ box-shadow: inset 0 3px 0 #0093d5;
|
|
|
+}
|
|
|
+aside nav a.active .icon {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+aside nav a:not(.active) .icon {
|
|
|
+ color: #888;
|
|
|
+}
|
|
|
+aside nav.box:not(.right) a {
|
|
|
+ -webkit-box-shadow: 1px 0 0 #222, inset -1px 0 0 #141414;
|
|
|
+ -moz-box-shadow: 1px 0 0 #222, inset -1px 0 0 #141414;
|
|
|
+ box-shadow: 1px 0 0 #222, inset -1px 0 0 #141414;
|
|
|
+}
|
|
|
+aside nav.box.right a {
|
|
|
+ -webkit-box-shadow: -1px 0 0 #222, inset 1px 0 0 #141414;
|
|
|
+ -moz-box-shadow: -1px 0 0 #222, inset 1px 0 0 #141414;
|
|
|
+ box-shadow: -1px 0 0 #222, inset 1px 0 0 #141414;
|
|
|
+}
|
|
|
+aside nav.box a:active {
|
|
|
+ background: #141414;
|
|
|
+}
|
|
|
+/* -------------------------- LISTS -------------------------- */
|
|
|
+section .list li {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+section .list li:not(.anchor) {
|
|
|
+ border-bottom: inset 1px #ebebeb;
|
|
|
+}
|
|
|
+section .list li.secondary {
|
|
|
+ -webkit-box-shadow: inset 4px 0px 0px #bfbfbf;
|
|
|
+ -moz-box-shadow: inset 4px 0px 0px #bfbfbf;
|
|
|
+ box-shadow: inset 4px 0px 0px #bfbfbf;
|
|
|
+}
|
|
|
+section .list li.accept {
|
|
|
+ -webkit-box-shadow: inset 4px 0px 0px #3fb58e;
|
|
|
+ -moz-box-shadow: inset 4px 0px 0px #3fb58e;
|
|
|
+ box-shadow: inset 4px 0px 0px #3fb58e;
|
|
|
+}
|
|
|
+section .list li.cancel {
|
|
|
+ -webkit-box-shadow: inset 4px 0px 0px #ee6557;
|
|
|
+ -moz-box-shadow: inset 4px 0px 0px #ee6557;
|
|
|
+ box-shadow: inset 4px 0px 0px #ee6557;
|
|
|
+}
|
|
|
+section .list li,
|
|
|
+section .list li a {
|
|
|
+ color: #333;
|
|
|
+}
|
|
|
+section .list li.anchor,
|
|
|
+section .list li a.anchor {
|
|
|
+ background: #222;
|
|
|
+}
|
|
|
+section .list li.dark,
|
|
|
+section .list li a.dark {
|
|
|
+ background: #595959;
|
|
|
+}
|
|
|
+section .list li.selectable:active,
|
|
|
+section .list li a.selectable:active,
|
|
|
+section .list li.theme,
|
|
|
+section .list li a.theme,
|
|
|
+section .list li.active,
|
|
|
+section .list li a.active {
|
|
|
+ background: #03b1ff;
|
|
|
+}
|
|
|
+section .list li.light,
|
|
|
+section .list li a.light {
|
|
|
+ background: #ebebeb;
|
|
|
+ color: #7a7a7a;
|
|
|
+}
|
|
|
+section .list li.dark,
|
|
|
+section .list li a.dark,
|
|
|
+section .list li.selectable:active,
|
|
|
+section .list li a.selectable:active,
|
|
|
+section .list li.theme,
|
|
|
+section .list li a.theme,
|
|
|
+section .list li.anchor,
|
|
|
+section .list li a.anchor,
|
|
|
+section .list li.dark small,
|
|
|
+section .list li a.dark small,
|
|
|
+section .list li.selectable:active small,
|
|
|
+section .list li a.selectable:active small,
|
|
|
+section .list li.theme small,
|
|
|
+section .list li a.theme small,
|
|
|
+section .list li.anchor small,
|
|
|
+section .list li a.anchor small,
|
|
|
+section .list li.dark .right:not(.tag),
|
|
|
+section .list li a.dark .right:not(.tag),
|
|
|
+section .list li.selectable:active .right:not(.tag),
|
|
|
+section .list li a.selectable:active .right:not(.tag),
|
|
|
+section .list li.theme .right:not(.tag),
|
|
|
+section .list li a.theme .right:not(.tag),
|
|
|
+section .list li.anchor .right:not(.tag),
|
|
|
+section .list li a.anchor .right:not(.tag) {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+section .list li small,
|
|
|
+section .list li a small,
|
|
|
+section .list li .right:not(.tag),
|
|
|
+section .list li a .right:not(.tag) {
|
|
|
+ color: #7a7a7a;
|
|
|
+}
|
|
|
+.list:not(.indented) li.dark,
|
|
|
+.list:not(.indented) li.theme,
|
|
|
+.list:not(.indented) li.light {
|
|
|
+ border-bottom-color: rgba(0,0,0,0.1);
|
|
|
+}
|
|
|
+aside .list li {
|
|
|
+ background: none;
|
|
|
+}
|
|
|
+aside .list li:not(:first-child) {
|
|
|
+ border-top: solid 1px #222;
|
|
|
+}
|
|
|
+aside .list li:not(:last-child) {
|
|
|
+ border-bottom: solid 1px #141414;
|
|
|
+}
|
|
|
+aside .list li.active {
|
|
|
+ background: #0093d5;
|
|
|
+ border-color: transparent;
|
|
|
+}
|
|
|
+aside .list li.active strong,
|
|
|
+aside .list li.active small,
|
|
|
+aside .list li.active .icon {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+aside .list li strong {
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+aside .list li small,
|
|
|
+aside .list li .icon {
|
|
|
+ color: #666;
|
|
|
+}
|
|
|
+/* -------------------------- TAG -------------------------- */
|
|
|
+.tag {
|
|
|
+ color: #fff;
|
|
|
+ -webkit-border-radius: 2px;
|
|
|
+ -moz-border-radius: 2px;
|
|
|
+ border-radius: 2px;
|
|
|
+ font-weight: 700 !important;
|
|
|
+}
|
|
|
+.tag.count {
|
|
|
+ background-color: #0093d5;
|
|
|
+}
|
|
|
+.tag header .count {
|
|
|
+ background-color: THEME-dark !important;
|
|
|
+}
|
|
|
+footer .tag {
|
|
|
+ -webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,0.3), 0 1px 2px rgba(0,0,0,0.5);
|
|
|
+ -moz-box-shadow: inset 0 1px 1px rgba(255,255,255,0.3), 0 1px 2px rgba(0,0,0,0.5);
|
|
|
+ box-shadow: inset 0 1px 1px rgba(255,255,255,0.3), 0 1px 2px rgba(0,0,0,0.5);
|
|
|
+}
|
|
|
+/* -------------------------- NOTIFICATION -------------------------- */
|
|
|
+.notification {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.notification .window.growl {
|
|
|
+ background: rgba(0,0,0,0.8);
|
|
|
+}
|
|
|
+.notification .window:not(.growl) {
|
|
|
+ background: #e6e6e6;
|
|
|
+ color: #222;
|
|
|
+ -webkit-box-shadow: 0 0 8px #000;
|
|
|
+ -moz-box-shadow: 0 0 8px #000;
|
|
|
+ box-shadow: 0 0 8px #000;
|
|
|
+}
|
|
|
+.notification .window:not(.growl) button,
|
|
|
+.notification .window:not(.growl) .button {
|
|
|
+ background: #fff !important;
|
|
|
+ -webkit-box-shadow: none !important;
|
|
|
+ -moz-box-shadow: none !important;
|
|
|
+ box-shadow: none !important;
|
|
|
+ color: #007db5 !important;
|
|
|
+ -webkit-border-radius: 0px !important;
|
|
|
+ -moz-border-radius: 0px !important;
|
|
|
+ border-radius: 0px !important;
|
|
|
+ border: none !important;
|
|
|
+ margin-bottom: 1px;
|
|
|
+}
|
|
|
+.notification .window:not(.growl).error {
|
|
|
+ background: #dd2916;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.notification .window:not(.growl).success {
|
|
|
+ background: #2f886b;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+/* -------------------------- BUTTONS -------------------------- */
|
|
|
+a.button,
|
|
|
+button {
|
|
|
+ -webkit-border-radius: FORM-border-radius;
|
|
|
+ -moz-border-radius: FORM-border-radius;
|
|
|
+ border-radius: FORM-border-radius;
|
|
|
+ color: #fff;
|
|
|
+ -webkit-border-radius: 2px;
|
|
|
+ -moz-border-radius: 2px;
|
|
|
+ border-radius: 2px;
|
|
|
+ -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
|
|
|
+ -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
|
|
|
+ box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
|
|
|
+ border: solid 1px rgba(0,0,0,0.1);
|
|
|
+}
|
|
|
+a.button:active,
|
|
|
+button:active {
|
|
|
+ -webkit-box-shadow: inset 0 0 128px rgba(0,0,0,0.25);
|
|
|
+ -moz-box-shadow: inset 0 0 128px rgba(0,0,0,0.25);
|
|
|
+ box-shadow: inset 0 0 128px rgba(0,0,0,0.25);
|
|
|
+ border-color: none;
|
|
|
+}
|
|
|
+a.button.secondary,
|
|
|
+button.secondary {
|
|
|
+ color: #666 !important;
|
|
|
+}
|
|
|
+a.button[disabled],
|
|
|
+button[disabled] {
|
|
|
+ background-color: #000;
|
|
|
+}
|
|
|
+button,
|
|
|
+.button,
|
|
|
+.tag {
|
|
|
+ background-color: #007db5;
|
|
|
+}
|
|
|
+button.secondary,
|
|
|
+.button.secondary,
|
|
|
+.tag.secondary {
|
|
|
+ background-color: #bfbfbf;
|
|
|
+}
|
|
|
+button.accept,
|
|
|
+.button.accept,
|
|
|
+.tag.accept {
|
|
|
+ background-color: #3fb58e;
|
|
|
+}
|
|
|
+button.cancel,
|
|
|
+.button.cancel,
|
|
|
+.tag.cancel {
|
|
|
+ background-color: #ee6557;
|
|
|
+}
|
|
|
+/* -------------------------- BUTTONS -------------------------- */
|
|
|
+form label,
|
|
|
+.form label {
|
|
|
+ color: #aaa;
|
|
|
+ font-weight: 300;
|
|
|
+}
|
|
|
+form fieldset,
|
|
|
+.form fieldset {
|
|
|
+ background: #fff;
|
|
|
+ border-bottom: solid 1px #eee;
|
|
|
+}
|
|
|
+form fieldset .icon,
|
|
|
+.form fieldset .icon {
|
|
|
+ color: #ccc;
|
|
|
+}
|
|
|
+form input[type="text"],
|
|
|
+.form input[type="text"],
|
|
|
+form input[type="password"],
|
|
|
+.form input[type="password"],
|
|
|
+form input[type="date"],
|
|
|
+.form input[type="date"],
|
|
|
+form input[type="datetime"],
|
|
|
+.form input[type="datetime"],
|
|
|
+form input[type="email"],
|
|
|
+.form input[type="email"],
|
|
|
+form input[type="number"],
|
|
|
+.form input[type="number"],
|
|
|
+form input[type="search"],
|
|
|
+.form input[type="search"],
|
|
|
+form input[type="tel"],
|
|
|
+.form input[type="tel"],
|
|
|
+form input[type="time"],
|
|
|
+.form input[type="time"],
|
|
|
+form input[type="url"],
|
|
|
+.form input[type="url"],
|
|
|
+form select,
|
|
|
+.form select,
|
|
|
+form textarea,
|
|
|
+.form textarea {
|
|
|
+ background-color: #fff;
|
|
|
+ color: rgba(0,0,0,0.75);
|
|
|
+ border: 1px solid #ddd;
|
|
|
+ -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
|
|
|
+ -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
|
|
|
+ box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
|
|
|
+ -webkit-border-radius: 0px;
|
|
|
+ -moz-border-radius: 0px;
|
|
|
+ border-radius: 0px;
|
|
|
+}
|
|
|
+form input[type="text"].error,
|
|
|
+.form input[type="text"].error,
|
|
|
+form input[type="password"].error,
|
|
|
+.form input[type="password"].error,
|
|
|
+form input[type="date"].error,
|
|
|
+.form input[type="date"].error,
|
|
|
+form input[type="datetime"].error,
|
|
|
+.form input[type="datetime"].error,
|
|
|
+form input[type="email"].error,
|
|
|
+.form input[type="email"].error,
|
|
|
+form input[type="number"].error,
|
|
|
+.form input[type="number"].error,
|
|
|
+form input[type="search"].error,
|
|
|
+.form input[type="search"].error,
|
|
|
+form input[type="tel"].error,
|
|
|
+.form input[type="tel"].error,
|
|
|
+form input[type="time"].error,
|
|
|
+.form input[type="time"].error,
|
|
|
+form input[type="url"].error,
|
|
|
+.form input[type="url"].error,
|
|
|
+form select.error,
|
|
|
+.form select.error,
|
|
|
+form textarea.error,
|
|
|
+.form textarea.error,
|
|
|
+form input[type="text"]:required,
|
|
|
+.form input[type="text"]:required,
|
|
|
+form input[type="password"]:required,
|
|
|
+.form input[type="password"]:required,
|
|
|
+form input[type="date"]:required,
|
|
|
+.form input[type="date"]:required,
|
|
|
+form input[type="datetime"]:required,
|
|
|
+.form input[type="datetime"]:required,
|
|
|
+form input[type="email"]:required,
|
|
|
+.form input[type="email"]:required,
|
|
|
+form input[type="number"]:required,
|
|
|
+.form input[type="number"]:required,
|
|
|
+form input[type="search"]:required,
|
|
|
+.form input[type="search"]:required,
|
|
|
+form input[type="tel"]:required,
|
|
|
+.form input[type="tel"]:required,
|
|
|
+form input[type="time"]:required,
|
|
|
+.form input[type="time"]:required,
|
|
|
+form input[type="url"]:required,
|
|
|
+.form input[type="url"]:required,
|
|
|
+form select:required,
|
|
|
+.form select:required,
|
|
|
+form textarea:required,
|
|
|
+.form textarea:required {
|
|
|
+ border-color: color_alert;
|
|
|
+ color: color_alert;
|
|
|
+ background-color: rgba(198,15,19,0.1);
|
|
|
+}
|
|
|
+form input[type="text"]:focus,
|
|
|
+.form input[type="text"]:focus,
|
|
|
+form input[type="password"]:focus,
|
|
|
+.form input[type="password"]:focus,
|
|
|
+form input[type="date"]:focus,
|
|
|
+.form input[type="date"]:focus,
|
|
|
+form input[type="datetime"]:focus,
|
|
|
+.form input[type="datetime"]:focus,
|
|
|
+form input[type="email"]:focus,
|
|
|
+.form input[type="email"]:focus,
|
|
|
+form input[type="number"]:focus,
|
|
|
+.form input[type="number"]:focus,
|
|
|
+form input[type="search"]:focus,
|
|
|
+.form input[type="search"]:focus,
|
|
|
+form input[type="tel"]:focus,
|
|
|
+.form input[type="tel"]:focus,
|
|
|
+form input[type="time"]:focus,
|
|
|
+.form input[type="time"]:focus,
|
|
|
+form input[type="url"]:focus,
|
|
|
+.form input[type="url"]:focus,
|
|
|
+form select:focus,
|
|
|
+.form select:focus,
|
|
|
+form textarea:focus,
|
|
|
+.form textarea:focus {
|
|
|
+ background: #fafafa;
|
|
|
+ border-color: #0093d5;
|
|
|
+ color: rgba(0,0,0,0.75);
|
|
|
+}
|
|
|
+form input[type="text"][disabled],
|
|
|
+.form input[type="text"][disabled],
|
|
|
+form input[type="password"][disabled],
|
|
|
+.form input[type="password"][disabled],
|
|
|
+form input[type="date"][disabled],
|
|
|
+.form input[type="date"][disabled],
|
|
|
+form input[type="datetime"][disabled],
|
|
|
+.form input[type="datetime"][disabled],
|
|
|
+form input[type="email"][disabled],
|
|
|
+.form input[type="email"][disabled],
|
|
|
+form input[type="number"][disabled],
|
|
|
+.form input[type="number"][disabled],
|
|
|
+form input[type="search"][disabled],
|
|
|
+.form input[type="search"][disabled],
|
|
|
+form input[type="tel"][disabled],
|
|
|
+.form input[type="tel"][disabled],
|
|
|
+form input[type="time"][disabled],
|
|
|
+.form input[type="time"][disabled],
|
|
|
+form input[type="url"][disabled],
|
|
|
+.form input[type="url"][disabled],
|
|
|
+form select[disabled],
|
|
|
+.form select[disabled],
|
|
|
+form textarea[disabled],
|
|
|
+.form textarea[disabled] {
|
|
|
+ background: #eee;
|
|
|
+ border-color: #aaa;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+form .select:after,
|
|
|
+.form .select:after {
|
|
|
+ background: #d0d4c6;
|
|
|
+ color: #fff;
|
|
|
+ border-top-right-radius: 1px;
|
|
|
+ border-bottom-right-radius: 1px;
|
|
|
+}
|
|
|
+form input[type=range],
|
|
|
+.form input[type=range] {
|
|
|
+ -webkit-box-shadow: 'inset 0 1px 2px rgba(0,0,0,0.1)';
|
|
|
+ -moz-box-shadow: 'inset 0 1px 2px rgba(0,0,0,0.1)';
|
|
|
+ box-shadow: 'inset 0 1px 2px rgba(0,0,0,0.1)';
|
|
|
+ -webkit-border-radius: 1px;
|
|
|
+ -moz-border-radius: 1px;
|
|
|
+ border-radius: 1px;
|
|
|
+}
|
|
|
+form input[type=range]:not(.checkbox),
|
|
|
+.form input[type=range]:not(.checkbox) {
|
|
|
+ background-color: #ddd;
|
|
|
+}
|
|
|
+form input[type=range]:not(.checkbox):active,
|
|
|
+.form input[type=range]:not(.checkbox):active {
|
|
|
+ background-color: #03b1ff;
|
|
|
+}
|
|
|
+form input[type=range].checkbox,
|
|
|
+.form input[type=range].checkbox {
|
|
|
+ background-color: #aaa;
|
|
|
+ color: rgba(255,255,255,0.6);
|
|
|
+}
|
|
|
+form input[type=range].checkbox.active,
|
|
|
+.form input[type=range].checkbox.active {
|
|
|
+ background-color: #03b1ff;
|
|
|
+}
|
|
|
+form input[type=range]::-webkit-slider-thumb,
|
|
|
+.form input[type=range]::-webkit-slider-thumb {
|
|
|
+ -webkit-border-radius: FORM-border-radius;
|
|
|
+ -moz-border-radius: FORM-border-radius;
|
|
|
+ border-radius: FORM-border-radius;
|
|
|
+ background: #eee;
|
|
|
+ -webkit-box-shadow: inset 0 0 1px #bbb;
|
|
|
+ -moz-box-shadow: inset 0 0 1px #bbb;
|
|
|
+ box-shadow: inset 0 0 1px #bbb;
|
|
|
+}
|
|
|
+form input[type=range]::-webkit-slider-thumb::after,
|
|
|
+.form input[type=range]::-webkit-slider-thumb::after {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+form .progress .bar,
|
|
|
+.form .progress .bar {
|
|
|
+ background-color: #ddd;
|
|
|
+}
|
|
|
+form .progress .bar .value,
|
|
|
+.form .progress .bar .value {
|
|
|
+ background-color: #03b1ff;
|
|
|
+}
|
ina