Author: sevein
Date: Mon Oct 10 13:48:04 2011
New Revision: 10003
Log:
Better style in settings page, use Trillium common submit buttons
Modified:
trunk/plugins/qtTrilliumPlugin/css/less/_misc.less
trunk/plugins/qtTrilliumPlugin/css/less/main.css
Modified: trunk/plugins/qtTrilliumPlugin/css/less/_misc.less
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/_misc.less Mon Oct 10 12:28:02
2011 (r10002)
+++ trunk/plugins/qtTrilliumPlugin/css/less/_misc.less Mon Oct 10 13:48:04
2011 (r10003)
@@ -1439,3 +1439,74 @@
}
}
+
+/*
+ * Settings page
+ */
+
+body.settings {
+
+ #content {
+
+ table {
+
+ tr td:first-child {
+
+ width: 180px;
+
+ }
+
+ input[type=submit],
+ button[type=submit] {
+
+ .btn();
+
+ // This is not working: .btn > .primary;
+ #gradient > .vertical(@blue, @blueDark);
+ color: White;
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+ border-color: @blueDark @blueDark darken(@blueDark, 15%);
+ border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1),
15%);
+
+ &:hover {
+
+ color: #fff;
+
+ }
+
+ }
+
+ tr:last-child {
+
+ td {
+
+ background-color: #f5f5f5;
+
+ }
+
+ }
+
+ label {
+
+ float: none;
+ width: auto;
+
+ }
+
+ ul {
+
+ margin: 0;
+
+ li {
+
+ margin-bottom: 3px;
+
+ }
+
+ }
+
+ }
+
+ }
+
+}
Modified: trunk/plugins/qtTrilliumPlugin/css/less/main.css
==============================================================================
--- trunk/plugins/qtTrilliumPlugin/css/less/main.css Mon Oct 10 12:28:02
2011 (r10002)
+++ trunk/plugins/qtTrilliumPlugin/css/less/main.css Mon Oct 10 13:48:04
2011 (r10003)
@@ -3857,6 +3857,274 @@
background-image: url(../../../../vendor/imageflow/slider_dark.png);
}
/*
+ * Settings page
+ */
+body.settings #content table tr td:first-child {
+ width: 180px;
+}
+body.settings #content table input[type=submit], body.settings #content table
button[type=submit] {
+ display: inline-block;
+ background-color: #e6e6e6;
+ background-repeat: no-repeat;
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff),
color-stop(0.25, #ffffff), to(#e6e6e6));
+ background-image: -webkit-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -moz-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -ms-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -o-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ padding: 4px 14px;
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
+ color: #333;
+ font-size: 13px;
+ line-height: 18px;
+ border: 1px solid #ccc;
+ border-bottom-color: #bbb;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px
rgba(0, 0, 0, 0.05);
+ -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0,
0, 0, 0.05);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0,
0.05);
+ -webkit-transition: 0.1s linear all;
+ -moz-transition: 0.1s linear all;
+ transition: 0.1s linear all;
+ cursor: pointer;
+ display: inline-block;
+ background-color: #e6e6e6;
+ background-repeat: no-repeat;
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff),
color-stop(0.25, #ffffff), to(#e6e6e6));
+ background-image: -webkit-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -moz-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -ms-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: -o-linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ background-image: linear-gradient(#ffffff, #ffffff 0.25, #e6e6e6);
+ padding: 5px 14px 6px;
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
+ color: #333;
+ font-size: 13px;
+ line-height: normal;
+ border: 1px solid #ccc;
+ border-bottom-color: #bbb;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px
rgba(0, 0, 0, 0.05);
+ -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0,
0, 0, 0.05);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0,
0.05);
+ -webkit-transition: 0.1s linear all;
+ -moz-transition: 0.1s linear all;
+ transition: 0.1s linear all;
+ background-color: #0064cd;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom,
from(#049cdb), to(#0064cd));
+ background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, #049cdb), color-stop(100%, #0064cd));
+ background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -o-linear-gradient(top, #049cdb, #0064cd);
+ background-image: linear-gradient(top, #049cdb, #0064cd);
+ color: White;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #0064cd #0064cd #003f81;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit].danger,
+body.settings #content table button[type=submit].danger,
+body.settings #content table input[type=submit].danger:hover,
+body.settings #content table button[type=submit].danger:hover,
+body.settings #content table input[type=submit].error,
+body.settings #content table button[type=submit].error,
+body.settings #content table input[type=submit].error:hover,
+body.settings #content table button[type=submit].error:hover,
+body.settings #content table input[type=submit].success,
+body.settings #content table button[type=submit].success,
+body.settings #content table input[type=submit].success:hover,
+body.settings #content table button[type=submit].success:hover,
+body.settings #content table input[type=submit].info,
+body.settings #content table button[type=submit].info,
+body.settings #content table input[type=submit].info:hover,
+body.settings #content table button[type=submit].info:hover {
+ color: #ffffff;
+}
+body.settings #content table input[type=submit].danger,
+body.settings #content table button[type=submit].danger,
+body.settings #content table input[type=submit].error,
+body.settings #content table button[type=submit].error {
+ background-color: #c43c35;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom,
from(#ee5f5b), to(#c43c35));
+ background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
+ background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);
+ background-image: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));
+ background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
+ background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
+ background-image: linear-gradient(top, #ee5f5b, #c43c35);
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #c43c35 #c43c35 #882a25;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit].success, body.settings
#content table button[type=submit].success {
+ background-color: #57a957;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom,
from(#62c462), to(#57a957));
+ background-image: -moz-linear-gradient(top, #62c462, #57a957);
+ background-image: -ms-linear-gradient(top, #62c462, #57a957);
+ background-image: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, #62c462), color-stop(100%, #57a957));
+ background-image: -webkit-linear-gradient(top, #62c462, #57a957);
+ background-image: -o-linear-gradient(top, #62c462, #57a957);
+ background-image: linear-gradient(top, #62c462, #57a957);
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #57a957 #57a957 #3d773d;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit].info, body.settings #content
table button[type=submit].info {
+ background-color: #339bb9;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom,
from(#5bc0de), to(#339bb9));
+ background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);
+ background-image: -ms-linear-gradient(top, #5bc0de, #339bb9);
+ background-image: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, #5bc0de), color-stop(100%, #339bb9));
+ background-image: -webkit-linear-gradient(top, #5bc0de, #339bb9);
+ background-image: -o-linear-gradient(top, #5bc0de, #339bb9);
+ background-image: linear-gradient(top, #5bc0de, #339bb9);
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #339bb9 #339bb9 #22697d;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit]:hover, body.settings #content
table button[type=submit]:hover {
+ background-position: 0 -15px;
+ color: #333;
+ text-decoration: none;
+}
+body.settings #content table input[type=submit].primary, body.settings
#content table button[type=submit].primary {
+ color: #fff;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #0064cd #0064cd #003f81;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit].primary:hover, body.settings
#content table button[type=submit].primary:hover {
+ color: #fff;
+}
+body.settings #content table input[type=submit].large, body.settings #content
table button[type=submit].large {
+ font-size: 16px;
+ line-height: 28px;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+}
+body.settings #content table input[type=submit].small, body.settings #content
table button[type=submit].small {
+ padding-right: 9px;
+ padding-left: 9px;
+ font-size: 11px;
+}
+body.settings #content table input[type=submit].disabled, body.settings
#content table button[type=submit].disabled {
+ background-image: none;
+ filter: alpha(opacity=65);
+ -khtml-opacity: 0.65;
+ -moz-opacity: 0.65;
+ opacity: 0.65;
+ cursor: default;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+}
+body.settings #content table input[type=submit]:disabled, body.settings
#content table button[type=submit]:disabled {
+ background-image: none;
+ filter: alpha(opacity=65);
+ -khtml-opacity: 0.65;
+ -moz-opacity: 0.65;
+ opacity: 0.65;
+ cursor: default;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+}
+body.settings #content table input[type=submit]:disabled.primary,
body.settings #content table button[type=submit]:disabled.primary {
+ color: #fff;
+}
+body.settings #content table input[type=submit]:active, body.settings #content
table button[type=submit]:active {
+ -webkit-box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0,
0, 0, 0.05);
+ -moz-box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0,
0, 0.05);
+ box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0,
0.05);
+}
+body.settings #content table input[type=submit]::-moz-focus-inner,
body.settings #content table button[type=submit]::-moz-focus-inner {
+ padding: 0;
+ border: 0;
+}
+body.settings #content table input[type=submit]:hover, body.settings #content
table button[type=submit]:hover {
+ background-position: 0 -15px;
+ color: #333;
+ text-decoration: none;
+}
+body.settings #content table input[type=submit].primary, body.settings
#content table button[type=submit].primary {
+ color: #fff;
+ background-color: #0064cd;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom,
from(#049cdb), to(#0064cd));
+ background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -webkit-gradient(linear, left top, left bottom,
color-stop(0%, #049cdb), color-stop(100%, #0064cd));
+ background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
+ background-image: -o-linear-gradient(top, #049cdb, #0064cd);
+ background-image: linear-gradient(top, #049cdb, #0064cd);
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+ border-color: #0064cd #0064cd #003f81;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+}
+body.settings #content table input[type=submit].disabled, body.settings
#content table button[type=submit].disabled {
+ cursor: default;
+ background-image: none;
+ filter: alpha(opacity=65);
+ -khtml-opacity: 0.65;
+ -moz-opacity: 0.65;
+ opacity: 0.65;
+}
+body.settings #content table input[type=submit]:disabled, body.settings
#content table button[type=submit]:disabled {
+ cursor: default;
+ background-image: none;
+ filter: alpha(opacity=65);
+ -khtml-opacity: 0.65;
+ -moz-opacity: 0.65;
+ opacity: 0.65;
+}
+body.settings #content table input[type=submit]:active, body.settings #content
table button[type=submit]:active {
+ -webkit-box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0,
0, 0.05);
+ -moz-box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0,
0.05);
+ box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0,
0.05);
+}
+body.settings #content table input[type=submit].large, body.settings #content
table button[type=submit].large {
+ font-size: 16px;
+ line-height: normal;
+ padding: 9px 14px 9px;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ border-radius: 6px;
+}
+body.settings #content table input[type=submit].small, body.settings #content
table button[type=submit].small {
+ padding: 7px 9px 7px;
+ font-size: 11px;
+}
+body.settings #content table input[type=submit]::-moz-focus-inner,
body.settings #content table button[type=submit]::-moz-focus-inner {
+ padding: 0;
+ border: 0;
+}
+body.settings #content table input[type=submit]:hover, body.settings #content
table button[type=submit]:hover {
+ color: #fff;
+}
+body.settings #content table tr:last-child td {
+ background-color: #f5f5f5;
+}
+body.settings #content table label {
+ float: none;
+ width: auto;
+}
+body.settings #content table ul {
+ margin: 0;
+}
+body.settings #content table ul li {
+ margin-bottom: 3px;
+}
+/*
* z-index tree
* --------------------------------------------------
* imageflow 10000, 10001, 10002... 2, 3, 4, 5...
--
You received this message because you are subscribed to the Google Groups
"Qubit Toolkit Commits" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/qubit-commits?hl=en.
