diff --git a/core/themes/seven/reset.css b/core/themes/seven/reset.css
index de53f287f31d1068d2c8bbfcc9d2dfb67a570af2..4aee951f1cce5d2a3c0c8dc0f2922162a3c2650e 100644
--- a/core/themes/seven/reset.css
+++ b/core/themes/seven/reset.css
@@ -1,202 +1,391 @@
+/**
+ * @file
+ * Reset stylesheet for Seven admin theme
+ * Based on Normalize CSS by @necolas and others.
+ * 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css
+ */
+
+/**
+ * HTML5 display definitions
+ */
+
+/* Corrects `block` display not defined in IE6/7/8/9 & FF3. */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+nav,
+section,
+summary {
+ display: block;
+}
+
+/* Corrects `inline-block` display not defined in IE6/7/8/9 & FF3. */
+audio,
+canvas,
+video {
+ display: inline-block;
+ *display: inline;
+ *zoom: 1;
+}
+
+/* Prevents modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS5 devices.
+ */
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/* Addresses styling for `hidden` attribute not present in IE7/8/9, FF3, S4.
+ * Known issue: no IE6 support.
+ */
+[hidden] {
+ display: none;
+}
/**
- * Reset CSS styles.
- *
- * Based on Eric Meyer's "Reset CSS 1.0" tool from
- * http://meyerweb.com/eric/tools/css/reset
+ * Base
+ */
+
+/* 1. Corrects text resizing oddly in IE6/7 when body `font-size` uses em units.
+ * 2. Prevents iOS text size adjust after orientation change, without disabling
+ * user zoom.
*/
+html {
+ font-size: 100%; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+/* Addresses `font-family` inconsistency between `textarea` and other
+ * form elements.
+ */
html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-font,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
+button,
input,
select,
-textarea,
-label,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-/* Drupal: system-menus.css */
-td.menu-disabled,
-ul.links,
-ul.links.inline,
-ul.links li,
-.block ul,
-/* Drupal: admin.css */
-div.admin,
-/* Drupal: system.css */
-tr.even,
-tr.odd,
-tr.drag,
-tbody,
-tbody th,
-thead th,
-.breadcrumb,
-.item-list .icon,
-.item-list .title,
-.item-list ul,
-.item-list ul li,
-ol.task-list li.active,
-.form-item,
-tr.odd .form-item,
-tr.even .form-item,
-.form-item .description,
-.form-item label,
-.form-item label.option,
-.form-checkboxes,
-.form-radios,
-.form-checkboxes .form-item,
-.form-radios .form-item,
-.marker,
-.form-required,
-.more-link,
-.more-help-link,
-.item-list .pager,
-.item-list .pager li,
-.pager-current,
-.tips,
-ul.primary,
-ul.primary li,
-ul.primary li a,
-ul.primary li.active a,
-ul.primary li a:hover,
-ul.secondary,
-ul.secondary li,
-ul.secondary a,
-ul.secondary a.active,
-.resizable-textarea {
+textarea {
+ font-family: sans-serif;
+}
+
+/* Addresses margins handled incorrectly in IE6/7. */
+body {
margin: 0;
- padding: 0;
- border: 0;
- vertical-align: baseline;
}
-/* Drupal: system-menus.css */
-ul.links,
-ul.links.inline,
-ul.links li,
-.block ul,
-ol,
-ul,
-.item-list ul,
-.item-list ul li {
- list-style: none;
+
+/**
+ * Links
+ */
+
+/* Addresses `outline` inconsistency between Chrome and other browsers. */
+a:focus {
+ outline: thin dotted;
+}
+
+/* Improves readability when focused and also mouse hovered in all browsers.
+ * people.opera.com/patrickl/experiments/keyboard/test
+ */
+a:active,
+a:hover {
+ outline: 0;
+}
+
+/**
+ * Typography
+ */
+
+/* Addresses font sizes and margins set differently in IE6/7.
+ * Addresses font sizes within `section` and `article` in FF4+, Chrome, S5.
+ */
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+h2 {
+ font-size: 1.5em;
+ margin: 0.83em 0;
+}
+h3 {
+ font-size: 1.17em;
+ margin: 1em 0;
+}
+h4 {
+ font-size: 1em;
+ margin: 1.33em 0;
+}
+h5 {
+ font-size: 0.83em;
+ margin: 1.67em 0;
+}
+h6 {
+ font-size: 0.75em;
+ margin: 2.33em 0;
+}
+
+/* Addresses style set to `bolder` in FF3+, S4/5, Chrome. */
+b,
+strong {
+ font-weight: bold;
}
-blockquote,
+
+blockquote {
+ margin: 1em 40px;
+}
+
+/* Addresses styling not present in S5, Chrome. */
+dfn {
+ font-style: italic;
+}
+
+/* Addresses styling not present in IE6/7/8/9. */
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+/* Addresses margins set differently in IE6/7. */
+p,
+pre {
+ margin: 1em 0;
+}
+
+/* Corrects font family set oddly in IE6, S4/5, Chrome.
+ * en.wikipedia.org/wiki/User:Davidgothberg/Test59
+ */
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, serif;
+ _font-family: 'courier new', monospace;
+ font-size: 1em;
+}
+
+/* Improves readability of pre-formatted text in all browsers. */
+pre {
+ white-space: pre;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+}
+
+/* Addresses CSS quotes not supported in IE6/7. */
q {
quotes: none;
}
-blockquote:before,
-blockquote:after,
+
+/* Addresses `quotes` property not supported in S4. */
q:before,
q:after {
content: '';
content: none;
}
-/* Remember to highlight inserts somehow! */
-ins {
- text-decoration: none;
+small {
+ font-size: 75%;
}
-del {
- text-decoration: line-through;
+
+/* Prevents `sub` and `sup` affecting `line-height` in all browsers.
+ * gist.github.com/413930
+ */
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+sup {
+ top: -0.5em;
+}
+sub {
+ bottom: -0.25em;
}
-/* Tables still need 'cellspacing="0"' in the markup. */
-table {
- border-collapse: collapse;
- border-spacing: 0;
+/**
+ * Lists
+ */
+
+/* Addresses margins set differently in IE6/7. */
+dl,
+menu,
+ol,
+ul {
+ margin: 1em 0;
+}
+
+dd {
+ margin: 0 0 0 40px;
+}
+
+/* Addresses paddings set differently in IE6/7. */
+menu,
+ol,
+ul {
+ padding: 0;
+}
+
+/* Corrects list images handled incorrectly in IE7. */
+nav ul,
+nav ol {
+ list-style: none;
+ list-style-image: none;
+}
+
+/**
+ * Embedded content
+ */
+
+/* 1. Removes border when inside `a` element in IE6/7/8/9, FF3.
+ * 2. Improves image quality when scaled in IE7.
+ * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
+ */
+img {
+ border: 0; /* 1 */
+ -ms-interpolation-mode: bicubic; /* 2 */
+}
+
+/* Corrects overflow displayed oddly in IE9. */
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/**
+ * Figures
+ */
+
+/* Addresses margin not present in IE6/7/8/9, S5, O11. */
+figure {
+ margin: 0;
}
/**
- * Font reset.
- *
- * Specifically targets form elements which browsers often times give
- * special treatment.
+ * Forms
*/
+
+/* Corrects margin displayed oddly in IE6/7. */
+form {
+ margin: 0;
+}
+
+/* Define consistent border, margin, and padding. */
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+/* 1. Corrects color not being inherited in IE6/7/8/9.
+ * 2. Corrects text not wrapping in FF3.
+ * 3. Corrects alignment displayed oddly in IE6/7.
+ */
+legend {
+ border: 0; /* 1 */
+ padding: 0;
+ white-space: normal; /* 2 */
+ *margin-left: -7px; /* 3 */
+}
+
+/* 1. Corrects font size not being inherited in all browsers.
+ * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome.
+ * 3. Improves appearance and consistency in all browsers.
+ */
+button,
input,
select,
textarea {
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 100%; /* 1 */
+ margin: 0; /* 2 */
+ vertical-align: baseline; /* 3 */
+ *vertical-align: middle; /* 3 */
+}
+
+/* Addresses FF3/4 setting `line-height` on `input` using `!important` in the
+ * UA stylesheet.
+ */
+button,
+input {
+ line-height: normal;
+}
+
+/* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ * and `video` controls.
+ * 2. Corrects inability to style clickable `input` types in iOS.
+ * 3. Improves usability and consistency of cursor style between image-type
+ * `input` and others.
+ * 4. Removes inner spacing in IE7 without affecting normal text inputs.
+ * Known issue: inner spacing remains in IE6.
+ */
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+ cursor: pointer; /* 3 */
+ *overflow: visible; /* 4 */
+}
+
+/* Re-set default cursor for disabled elements. */
+button[disabled],
+input[disabled] {
+ cursor: default;
}
+
+/* 1. Addresses box sizing set to content-box in IE8/9.
+ * 2. Removes excess padding in IE8/9.
+ * 3. Removes excess padding in IE7.
+ * Known issue: excess padding remains in IE6.
+ */
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+ *height: 13px; /* 3 */
+ *width: 13px; /* 3 */
+}
+
+/* 1. Addresses `appearance` set to `searchfield` in S5, Chrome.
+ * 2. Addresses `box-sizing` set to `border-box` in S5, Chrome (include `-moz`
+ * to future-proof).
+ */
+input[type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ -moz-box-sizing: content-box;
+ -webkit-box-sizing: content-box; /* 2 */
+ box-sizing: content-box;
+}
+
+/* Removes inner padding and search cancel button in S5, Chrome on OS X. */
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/* Removes inner padding and border in FF3+. */
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+/* 1. Removes default vertical scrollbar in IE6/7/8/9.
+ * 2. Improves readability and alignment in all browsers.
+ */
textarea {
- font-size: 1em;
- line-height: 1.538em;
+ overflow: auto; /* 1 */
+ vertical-align: top; /* 2 */
}
+
/**
- * Markup free clearing.
- *
- * Consider adding your own selectors to this instead of finding ways
- * to sneak the clearfix class into Drupal's markup.
- * From http://perishablepress.com/press/2009/12/06/new-clearfix-hack
- */
-ul.links:after,
-div.admin-panel .body:after,
-.clearfix:after {
- content: ".";
- display: block;
- height: 0;
- clear: both;
- visibility: hidden;
-}
+ * Tables
+ */
-/* Exclude inline links from clearfix behavior */
-ul.inline:after {
- content: "";
- display: none;
- clear: none;
+/* Remove most spacing between table cells. */
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
}
diff --git a/core/themes/seven/style-rtl.css b/core/themes/seven/style-rtl.css
index 11ee2dc71663bb85b0e3baf35d4411580de6f543..20739260c70e735d5b4103e1d9b20634c6d68cbf 100644
--- a/core/themes/seven/style-rtl.css
+++ b/core/themes/seven/style-rtl.css
@@ -1,6 +1,10 @@
+/**
+ * @file
+ * Right-to-left stylesheet for the Seven admin theme.
+ */
/**
- * Generic elements.
+ * Generic elements
*/
dl dd,
dl dl {
@@ -19,8 +23,8 @@ ol {
* Skip link.
*/
#skip-link {
- right: 50%;
margin-right: -5.25em;
+ right: 50%;
}
#skip-link a,
#skip-link a:link,
@@ -31,10 +35,6 @@ ol {
/**
* Branding.
*/
-#branding {
- padding: 20px 20px 0 20px;
-}
-
#branding div.block {
float: left;
padding-left: 0;
@@ -58,7 +58,7 @@ ol {
/**
* Page title.
*/
-#branding h1.page-title {
+#branding .page-title {
float: right;
}
@@ -84,11 +84,6 @@ ul.primary {
/**
* Page layout.
*/
-#page {
- padding: 20px 0 40px 0;
- margin-left: 40px;
- margin-right: 40px;
-}
#secondary-links ul.links li {
padding: 0 0 10px 10px;
}
@@ -98,13 +93,13 @@ ul.inline li {
padding-right: 0;
}
ul.admin-list li {
- padding: 9px 30px 0 0;
- margin-right: 0;
background: url(images/list-item-rtl.png) no-repeat right 11px;
+ margin-right: 0;
+ padding: 9px 30px 0 0;
}
ul.admin-list li a {
- margin-right: -30px;
margin-left: 0;
+ margin-right: -30px;
padding: 0 30px 4px 0;
}
ul.admin-list.compact li a {
@@ -143,19 +138,15 @@ fieldset .fieldset-legend {
padding-right: 15px;
right: 0;
}
-fieldset .fieldset-wrapper {
- padding: 0 15px 13px 13px;
-}
-/* Filter */
+/**
+ * Filters
+ */
.filter-wrapper .form-item,
.filter-wrapper .filter-guidelines,
.filter-wrapper .filter-help {
padding: 2px 0 0 0;
}
-ul.tips li {
- margin: 0.25em 1.5em 0.25em 0;
-}
body div.form-type-radio div.description,
body div.form-type-checkbox div.description {
margin-left: 0;
@@ -166,25 +157,30 @@ a.button {
margin-left: 1em;
margin-right: 0;
}
-ul.action-links li {
+.action-links {
+ padding-right: 0;
+}
+.action-links > li {
float: right;
margin: 0 0 0 1em;
}
-ul.action-links a {
+.action-links a {
+ background-position: right center;
padding-left: 0;
padding-right: 15px;
- background-position: right center;
}
/* Update options. */
div.admin-options label,
div.admin-options div.form-item {
+ float: right;
margin-left: 10px;
margin-right: 0;
- float: right;
}
-/* Maintenance theming */
+/**
+ * Maintenance page
+ */
body.in-maintenance #sidebar-first {
float: right;
}
@@ -204,27 +200,48 @@ ol.task-list li.active {
padding: 0.5em 20px 0.5em 1em;
}
-/* Overlay theming */
-.overlay #branding div.breadcrumb {
- float: right;
+/**
+ * Overlay
+ */
+@media screen and (min-width: 900px) {
+ #overlay {
+ padding-left: 48px;
+ padding-right: 36px;
+ }
}
.overlay ul.secondary {
margin: -1.4em 0 0.3em 0;
}
-/* Shortcut theming */
+/**
+ * Shortcuts
+ */
div.add-or-remove-shortcuts {
float: none;
padding-left: 0;
padding-right: 6px;
}
-/* Recent content block */
+/**
+ * Dashboard
+ */
+#dashboard div.block div.content {
+ padding: 10px 5px 5px 5px;
+}
+#dashboard div.block div.content ul.menu {
+ margin-right: 20px;
+}
+
+/**
+ * Recent Content block
+ */
#block-node-recent .more-link {
padding: 0 0 5px 5px;
}
-/* User login block */
+/**
+ * User Login block
+ */
#user-login-form .openid-links {
margin-right: 0;
}
diff --git a/core/themes/seven/style.css b/core/themes/seven/style.css
index 09e6b3521ff0fb6e10d4f22ad5d8dd4814b914f5..d998a3f11c2ea98c5ff43af3688fbb0ca7b07871 100644
--- a/core/themes/seven/style.css
+++ b/core/themes/seven/style.css
@@ -1,11 +1,15 @@
+/**
+ * @file
+ * Main stylesheet for the Seven admin theme.
+ */
/**
- * Generic elements.
+ * Generic elements
*/
body {
- color: #000;
background: #fff;
- font: normal 81.3%/1.538em "Lucida Grande", "Lucida Sans Unicode", sans-serif;
+ color: #000;
+ font: normal 81.3%/1.538em "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
}
a {
color: #0074bd;
@@ -15,14 +19,11 @@ a:hover {
text-decoration: underline;
}
hr {
- margin: 0;
- padding: 0;
+ background: #cccccc;
border: none;
height: 1px;
- background: #cccccc;
-}
-legend {
- font-weight: bold;
+ margin: 0;
+ padding: 0;
}
h1,
h2,
@@ -30,11 +31,14 @@ h3,
h4,
h5,
h6 {
- font-weight: bold;
+ letter-spacing: .03em;
margin: 10px 0;
+ text-rendering: optimizeLegibility;
}
h1 {
+ font-family: Helvetica, "Helvetica Neue", Arial, sans-serif;
font-size: 1.538em;
+ font-weight: 300;
}
h2 {
font-size: 1.385em;
@@ -57,8 +61,8 @@ dl {
}
dl dd,
dl dl {
- margin-left: 20px; /* LTR */
margin-bottom: 10px;
+ margin-left: 20px; /* LTR */
}
blockquote {
margin: 1em 40px;
@@ -82,17 +86,14 @@ small {
font-size: smaller;
}
sub {
- vertical-align: sub;
font-size: smaller;
line-height: normal;
+ vertical-align: sub;
}
sup {
- vertical-align: super;
font-size: smaller;
line-height: normal;
-}
-nobr {
- white-space: nowrap;
+ vertical-align: super;
}
abbr,
acronym {
@@ -101,8 +102,8 @@ acronym {
ul,
.block ul,
.item-list ul {
- list-style-type: disc;
list-style-image: none;
+ list-style-type: disc;
margin: 0.25em 0 0.25em 1.5em; /* LTR */
}
.item-list .pager li {
@@ -111,8 +112,8 @@ ul,
.item-list ul li,
li.leaf,
ul.menu li {
- list-style-type: disc;
list-style-image: none;
+ list-style-type: disc;
}
ul.menu li {
margin: 0;
@@ -131,42 +132,36 @@ ul.menu li.expanded {
list-style-image:url(../../misc/menu-expanded.png);
list-style-type:circle;
}
-quote,
code {
margin: .5em 0;
}
-code,
-pre,
-kbd {
- font-size: 1.231em;
-}
pre {
margin: 0.5em 0;
white-space: pre-wrap;
}
/**
- * Skip link.
+ * Link to skip to main content
*/
#skip-link {
- margin-top: 0;
- position: absolute;
left: 50%; /* LTR */
margin-left: -5.25em; /* LTR */
+ margin-top: 0;
+ position: absolute;
width: auto;
z-index: 50;
}
#skip-link a,
#skip-link a:link,
#skip-link a:visited {
- display: block;
background: #444;
+ -moz-border-radius: 0 0 10px 10px;
+ border-radius: 0 0 10px 10px;
color: #fff;
+ display: block;
font-size: 0.94em;
padding: 1px 10px 2px 10px; /* LTR */
text-decoration: none;
- -moz-border-radius: 0 0 10px 10px;
- border-radius: 0 0 10px 10px;
}
#skip-link a:hover,
#skip-link a:focus,
@@ -175,45 +170,44 @@ pre {
}
/**
- * Branding.
+ * Branding
*/
#branding {
+ background-color: #e0e0d8;
overflow: hidden;
- padding: 20px 20px 0 20px; /* LTR */
+ padding: 20px 4% 0;
position: relative;
- background-color: #e0e0d8;
-}
-#branding div.breadcrumb {
- font-size: 0.846em;
- padding-bottom: 5px;
}
#branding div.block {
- position: relative;
+ background: #333;
float: right; /* LTR */
- width: 240px;
padding-left: 10px; /* LTR */
- background: #333;
+ width: 240px;
+ position: relative;
}
#branding div.block form label {
display: none;
}
#branding div.block form div.form-item {
- float: left; /* LTR */
border: 0;
+ float: left; /* LTR */
margin: 0;
padding: 0;
}
#branding div.block form input.form-text {
- width: 140px;
margin-right: 10px; /* LTR */
+ width: 140px;
}
#branding div.block form input.form-submit {
text-align: center;
width: 80px;
}
+.breadcrumb {
+ font-size: 12px;
+}
/**
- * Help.
+ * Help
*/
#help {
font-size: 0.923em;
@@ -227,39 +221,39 @@ pre {
}
/**
- * Page title.
+ * Page title
*/
#page-title {
background: #333;
padding-top: 20px;
}
-#branding h1.page-title {
+#branding .page-title {
color: #000;
+ float: left; /* LTR */
+ font-size: 1.538em;
+ font-weight: normal;
margin: 0;
padding-bottom: 10px;
- font-size: 1.385em;
- font-weight: normal;
- float: left; /* LTR */
}
/**
- * Console.
+ * Console
*/
#console {
- margin: 9px 0 10px;
+ margin: .5em 0;
}
/**
- * Tabs.
+ * Tabs
*/
ul.primary {
- float: right; /* LTR */
border-bottom: none;
- text-transform: uppercase;
+ float: right; /* LTR */
font-size: 0.923em;
height: 2.60em;
margin: 0;
padding-top: 0;
+ text-transform: uppercase;
}
ul.primary li {
float: left; /* LTR */
@@ -267,24 +261,25 @@ ul.primary li {
margin: 0 2px;
}
ul.primary li a:link,
-ul.primary li a.active,
ul.primary li a:active,
ul.primary li a:visited,
ul.primary li a:hover,
+ul.primary li a.active,
ul.primary li.active a {
+ background-color: #a6a7a2;
+ border-color: #a6a7a2;
+ -moz-border-radius: 8px 8px 0 0;
+ border-radius: 8px 8px 0 0;
+ border-style: solid;
+ border-width: 1px 1px 0 1px;
+ color: #000;
display: block;
float: left; /* LTR */
+ font-weight: bold;
height: 2.60em;
line-height: 2.60em;
+ margin: 0;
padding: 0 18px 8px;
- background-color: #a6a7a2;
- color: #000;
- font-weight: bold;
- border-width: 1px 1px 0 1px;
- border-style: solid;
- border-color: #a6a7a2;
- -moz-border-radius: 8px 8px 0 0;
- border-radius: 8px 8px 0 0;
}
ul.primary li.active a,
ul.primary li.active a.active,
@@ -303,16 +298,19 @@ ul.primary li.active a:hover {
clear: both;
}
ul.secondary {
+ background-color: #fff;
+ border: 0;
float: right; /* LTR */
font-size: 0.923em;
- padding: 0 3px 5px;
line-height: 1.385em;
overflow: hidden;
- background-color: #fff;
+ padding: 0 3px 5px;
}
ul.secondary li {
- margin: 0 5px;
+ border: 0;
float: none; /* LTR */
+ margin: 0 5px;
+ padding: 0 10px 0 0; /* LTR */
}
ul.secondary li a {
background-color: #ddd;
@@ -323,9 +321,10 @@ ul.secondary li a,
ul.secondary li a:hover,
ul.secondary li.active a,
ul.secondary li.active a.active {
- padding: 2px 10px;
-moz-border-radius: 7px;
border-radius: 7px;
+ border: 0;
+ padding: 2px 10px;
}
ul.secondary li a:hover,
ul.secondary li.active a,
@@ -333,121 +332,29 @@ ul.secondary li.active a.active {
color: #fff;
background: #666;
}
-#content {
- clear: left;
-}
-
-/**
- * Page layout.
- */
-#page {
- padding: 20px 0 40px 0; /* LTR */
- margin-right: 40px; /* LTR */
- margin-left: 40px; /* LTR */
- background: #fff;
- position: relative;
- color: #333;
-}
-#secondary-links ul.links li {
- padding: 0 10px 10px 0; /* LTR */
-}
-#secondary-links ul.links li a {
- font-size: 0.923em;
- background: #777;
- color: #fff;
- text-align: center;
- padding: 5px;
- height: 55px;
- width: 80px;
- overflow: hidden;
- -moz-border-radius: 5px;
- border-radius: 5px;
-}
-#secondary-links ul.links li a:hover {
- background: #999;
-}
-ul.links li,
-ul.inline li {
- padding-right: 1em; /* LTR */
-}
-ul.inline li {
- display: inline;
-}
-#secondary-links ul.links li.active-trail a,
-#secondary-links ul.links li a.active {
- background: #333;
-}
-ul.admin-list li {
- position: relative;
- padding-left: 30px; /* LTR */
- padding-top: 9px;
- border-top: 1px solid #ccc;
- margin-left: 0; /* LTR */
- margin-bottom: 10px;
- background: url(images/list-item.png) no-repeat 0 11px; /* LTR */
- list-style-type: none;
- list-style-image: none;
-}
-.admin-panel .item-list ul,
-ul.admin-list {
- margin: 0;
- padding: 0;
-}
-.admin-panel .item-list ul,
-ul.admin-list.compact {
- margin: 8px 0;
-}
-.admin-panel .item-list li,
-ul.admin-list.compact li {
- border: none;
- background: none;
- margin: 0 0 0.75em;
- line-height: 1;
- padding: 0;
-}
-ul.admin-list li:last-child {
- border-bottom: none;
-}
-ul.admin-list li a {
- margin-left: -30px; /* LTR */
- padding: 0 0 4px 30px; /* LTR */
- min-height: 0;
-}
-ul.admin-list.compact li a {
- margin-left: 0; /* LTR */
- padding: 0;
-}
-ul.admin-list li div.description a {
- margin-left: 0; /* LTR */
- padding: 0;
- min-height: inherit;
-}
-div.submitted {
- color: #898989;
-}
/**
- * Tables.
+ * Tables
*/
table {
- width: 100%;
+ border: 1px solid #bebfb9;
font-size: 0.923em;
margin: 0 0 10px;
- border: 1px solid #bebfb9;
+ width: 100%;
}
table td,
table th {
- vertical-align: middle;
- padding: 8px 10px;
border: 0;
color: #000;
+ padding: 8px 10px;
+ vertical-align: middle;
}
tr.even,
tr.odd {
- border-width: 0 1px 0 1px;
- border-style: solid;
- border-color: #bebfb9;
background: #f3f4ee;
+ border-color: #bebfb9;
+ border-style: solid;
+ border-width: 0 1px 0 1px;
}
tr.odd {
background: #fff;
@@ -459,13 +366,13 @@ tr.drag-previous {
background: #ffb;
}
table th {
- text-transform: uppercase;
background: #e1e2dc;
- font-weight: normal;
- border-width: 1px;
- border-style: solid;
border-color: #bebfb9;
+ border-style: solid;
+ border-width: 1px;
+ font-weight: normal;
padding: 3px 10px;
+ text-transform: uppercase;
}
table th.active {
background: #bdbeb9;
@@ -479,14 +386,11 @@ table th.active a {
}
table th.active img {
position: absolute;
- top: 3px;
right: 3px; /* LTR */
+ top: 3px;
}
-/**
- * Force browsers to calculate the width of a 'select all' TH element.
- */
table th.select-all {
- width: 1px;
+ width: 1px; /* force browsers to calculate width */
}
table td.active {
background: #e9e9dd;
@@ -499,7 +403,6 @@ table tr.selected td {
background: #ffc;
border-color: #eeb;
}
-
table.system-status-report tr {
border-bottom: 1px solid #ccc;
}
@@ -515,7 +418,6 @@ table.system-status-report tr.error {
color: #8c2e0b;
background-color: #fef5f1;
}
-
/**
* Exception for webkit bug with the right border of the last cell
* in some tables, since it's webkit only, we can use :last-child
@@ -524,107 +426,187 @@ tr td:last-child {
border-right: 1px solid #bebfb9; /* LTR */
}
-
/**
- * Fieldsets.
- *
- * Fieldset legends are displayed like containers in Seven. However, several
- * browsers do not support styling of LEGEND elements. To achieve the desired
- * styling:
- * - All fieldsets use 'position: relative'.
- * - All legend labels are wrapped in a single span.fieldset-legend that uses
- * 'position: absolute', which means that the LEGEND element itself is not
- * rendered by browsers.
- * - Due to using 'position: absolute', collapsed fieldsets do not have a
- * height; the fieldset requires a 'padding-top' to make the absolute
- * positioned .fieldset-legend appear as though it would have a height.
- * - Various browsers are positioning the legend differently if there is a
- * 'padding-left'/'padding-right' applied on a fieldset and inherit the
- * positioning even to absolute positioned elements within; we therefore have
- * to apply all padding to the inner .fieldset-wrapper instead.
+ * Forms
*/
-fieldset {
- border: 1px solid #ccc;
- padding: 2.5em 0 0 0; /* LTR */
- position: relative;
- margin: 1em 0;
+input,
+textarea,
+select {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+select[multiple] {
+ display: block;
}
-fieldset .fieldset-legend {
- margin-top: 0.5em;
- padding-left: 15px; /* LTR */
- position: absolute;
- text-transform: uppercase;
+#diff-inline-form select,
+div.filter-options select {
+ padding: 0;
}
-fieldset .fieldset-wrapper {
- padding: 0 13px 13px 15px; /* LTR */
+.form-autocomplete,
+.form-text,
+.form-tel,
+.form-email,
+.form-url,
+.form-search,
+.form-number,
+.form-color,
+.form-file,
+.form-textarea {
+ background: #f7f7f7;
+ -moz-border-radius: 0;
+ border-radius: 0;
+ border: 1px solid #bbb;
+ -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .2);
+ -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .2);
+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, .2);
+ color: #333;
+ padding: .5em;
+ -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
+ -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
+ transition: border linear 0.2s, box-shadow linear 0.2s;
}
-fieldset.collapsed {
- background-color: transparent;
+td .form-autocomplete,
+td .form-text,
+td .form-tel,
+td .form-email,
+td .form-url,
+td .form-search,
+td .form-number,
+td .form-color {
+ padding-bottom: .25em;
+ padding-top: .25em;
+}
+.form-autocomplete,
+.form-text,
+.form-tel,
+.form-email,
+.form-url,
+.form-search,
+.form-number,
+.form-color,
+textarea {
+ max-width: 100%;
+}
+.layout-form-3 .form-autocomplete,
+.layout-form-3 .form-text,
+.layout-form-3 .form-tel,
+.layout-form-3 .form-email,
+.layout-form-3 .form-url,
+.layout-form-3 .form-search,
+.layout-form-3 .form-number,
+.layout-form-3 .form-color,
+.layout-form-3 textarea {
+ width: 100%;
}
-.js fieldset.collapsed {
- border-width: 1px;
- height: auto;
+.form-text:focus,
+.form-tel:focus,
+.form-email:focus,
+.form-url:focus,
+.form-search:focus,
+.form-number:focus,
+.form-color:focus,
+.form-file:focus,
+textarea:focus {
+ background-color: #f9f9f9;
}
-fieldset fieldset {
- background-color: #fff;
+.form-disabled input.form-autocomplete,
+.form-disabled input.form-text,
+.form-disabled input.form-tel,
+.form-disabled input.form-email,
+.form-disabled input.form-url,
+.form-disabled input.form-search,
+.form-disabled input.form-number,
+.form-disabled input.form-color,
+.form-disabled input.form-file,
+.form-disabled textarea.form-textarea,
+.form-disabled select.form-select {
+ background-color: #eee;
+ color: #777;
}
-fieldset fieldset fieldset {
- background-color: #f8f8f8;
+.image-widget-data {
+ float: none;
+}
+.form-file {
+ max-width: 60%;
+}
+.js input.form-autocomplete {
+ background-position: 100% 8px;
+}
+.js input.throbbing {
+ background-position: 100% -12px;
}
/**
- * Form elements.
+ * Form items
*/
-.form-item {
- padding: 9px 0;
- margin: 0 0 10px;
+.form-item,
+[class*="field-name-field-"] {
+ margin: 0 0 8px 0;
+ padding-bottom: 8px;
+ padding-top: 8px;
+}
+.form-item:last-child {
+ margin-bottom: 0;
+}
+.text-format-wrapper .form-item {
+ padding-bottom: 0;
}
.filter-wrapper .form-item,
div.teaser-checkbox .form-item,
.form-item .form-item {
- padding: 5px 0;
- margin: 0;
border: 0;
+ margin: 0;
+ padding: 3px 0;
}
-.form-type-checkbox {
- padding: 0;
-}
-.text-format-wrapper .form-item {
+tr .form-item {
padding-bottom: 0;
+ padding-top: 0;
}
-.form-item label {
- margin: 0;
- padding: 0;
+.form-type-checkbox + *[style] {
+ margin-top: 1em;
+}
+
+/**
+ * Labels
+ */
+label {
+ font-size: 1.077em;
+ margin-bottom: .4em;
}
-.form-item label.option {
+label[for] {
+ cursor: pointer; /* Labels with explicit associations are clickable. */
+}
+label[for="edit-filters-order"] {
+ float: left;
+}
+label.option {
font-size: 0.923em;
text-transform: none;
}
-.form-item label.option input {
+label.option input {
vertical-align: middle;
}
-.form-disabled input.form-autocomplete,
-.form-disabled input.form-text,
-.form-disabled input.form-tel,
-.form-disabled input.form-email,
-.form-disabled input.form-url,
-.form-disabled input.form-search,
-.form-disabled input.form-number,
-.form-disabled input.form-color,
-.form-disabled input.form-file,
-.form-disabled textarea.form-textarea,
-.form-disabled select.form-select {
- background-color: #eee;
- color: #777;
+
+/**
+ * Checkboxes and Radios
+ */
+.form-type-checkbox {
+ margin: 8px 0;
+ padding: 0;
+}
+input.form-checkbox,
+input.form-radio {
+ vertical-align: baseline;
}
-/* Filter */
+/**
+ * Filters
+ */
.filter-wrapper {
border-top: 0;
- padding: 10px 2px;
-}
-.filter-wrapper .fieldset-wrapper {
- padding: 0 6px;
+ overflow: hidden;
+ padding: 0;
}
.filter-wrapper .form-item,
.filter-wrapper .filter-guidelines,
@@ -632,136 +614,666 @@ div.teaser-checkbox .form-item,
font-size: 0.923em;
padding: 2px 0 0 0; /* LTR */
}
-ul.tips,
-div.description,
-.form-item div.description {
- margin: 5px 0;
- line-height: 1.231em;
- font-size: 0.923em;
- color: #666;
+.exposed-filters .form-item {
+ overflow: hidden;
}
-ul.tips li {
- margin: 0.25em 0 0.25em 1.5em; /* LTR */
+
+/**
+ * Form item descriptions and explanatory text
+ */
+.tips,
+.description,
+.form-item .description {
+ color: #666;
+ font-size: 12px;
+ font-weight: 300;
+ line-height: 1.4em;
+ margin: 5px 0;
+ text-shadow: none;
}
body div.form-type-radio div.description,
body div.form-type-checkbox div.description {
margin-left: 1.5em; /* LTR */
}
-input.form-submit,
-a.button {
- cursor: pointer;
- padding: 4px 17px;
- margin-bottom: 1em;
- margin-right: 1em; /* LTR */
- color: #5a5a5a;
- text-align: center;
- font-weight: normal;
+div.admin-requirements,
+div.admin-required {
+ color: #666;
+ margin-top: .5em;
+}
+
+/**
+ * Fieldsets
+ */
+fieldset {
+ border: 1px solid #ccc;
+ margin: 1em 0;
+ padding: 0; /* LTR */
+}
+fieldset fieldset {
+ background-color: #fff;
+}
+fieldset fieldset fieldset {
+ background-color: #f8f8f8;
+}
+fieldset .fieldset-wrapper {
+ clear: both;
+ margin-bottom: 13px;
+ margin-top: 13px;
+ padding: 0 13px;
+}
+
+/**
+ * Fieldset Legends
+ * 1. Emulate display: block in modern browsers
+ */
+legend {
+ float: left; /* 1. */
font-size: 1.077em;
- font-family: "Lucida Grande", Verdana, sans-serif;
- border: 1px solid #e4e4e4;
- border-bottom: 1px solid #b4b4b4;
- border-left-color: #d2d2d2;
- border-right-color: #d2d2d2;
- background: url(images/buttons.png) 0 0 repeat-x;
- -moz-border-radius: 20px;
- border-radius: 20px;
-}
-a.button:link,
-a.button:visited,
-a.button:hover,
-a.button:active {
+ font-weight: bold;
+ margin: .75em 0 .5em 0;
+ padding: 0;
+ width: 100%; /* 1. */
+}
+fieldset .fieldset-legend {
+ line-height: 1.25em;
+ padding-left: 13px; /* LTR; @todo */
+ text-transform: uppercase;
+}
+
+/**
+ * Collapsible fieldsets
+ */
+fieldset.collapsed {
+ background-color: transparent;
+}
+.js fieldset.collapsed {
+ border-width: 1px;
+ height: auto;
+}
+.js fieldset.collapsible > legend {
+ font-size: 13px;
+ margin-bottom: 0;
+ margin-top: 0;
+ padding: 0;
+}
+/* 1. Override standard menu-expanded/collapsed bg images */
+.js fieldset.collapsible > legend .fieldset-legend {
+ background-image: none; /* 1 */
+ margin: 0;
+ padding: 0;
+ position: relative;
+}
+/* Reduce spacing and smooth animation for contents */
+/* @todo find a better solution */
+.collapsible .form-item {
+ margin: 0;
+}
+.collapsible .form-type-checkbox {
+ padding: 4px 0;
+}
+/* Fieldset toggle
*/
+.collapsible .fieldset-title {
+ display: block;
+ outline: 0;
+ padding: 1em 13px 1em 26px;
text-decoration: none;
- color: #5a5a5a;
-}
-.node-form input#edit-submit,
-.node-form input#edit-submit-1 {
- border: 1px solid #8eB7cd;
- border-left-color: #8eB7cd;
- border-right-color: #8eB7cd;
- border-bottom-color: #7691a2;
- background: url(images/buttons.png) 0 -40px repeat-x;
- color: #133B54;
-}
-input.form-submit:active {
- background: #666;
- color: #fff;
- border-color: #555;
- text-shadow: #222 0 -1px 0;
}
-input.form-button-disabled,
-input.form-button-disabled:active {
- background: #eee none;
- border-color: #eee;
+/* New expanded/collapsed icons are their own elements, so background overflow
+ * with sprites is no longer an issue. */
+.js .collapsible .fieldset-title:before {
+ background: transparent url(images/icon-twistie.png) no-repeat 0 -12px;
+ content: '';
+ display: block;
+ height: 12px;
+ left: 10px;
+ overflow: hidden;
+ position: absolute;
+ top: 1.15em;
+ width: 12px;
+}
+.js .collapsed .fieldset-title:before {
+ background-position: 0 0; /* LTR; @todo RTL */
+}
+.js .fieldset-title:hover .fieldset-title-text {
+ text-decoration: underline;
+}
+.fieldset-legend span.summary {
+ display: none;
+}
+/* body class to re-enable summaries */
+.show-collapsible-summaries .fieldset-legend span.summary {
+ display: inline;
+ font-size: .95em;
+ font-weight: normal;
+ margin: 0;
+ padding: 0;
+ text-decoration: none;
text-shadow: none;
- color: #999;
-}
-input.form-autocomplete,
-input.form-text,
-input.form-tel,
-input.form-email,
-input.form-url,
-input.form-search,
-input.form-number,
-input.form-color,
-input.form-file,
-textarea.form-textarea,
-select.form-select {
- padding: 2px;
- border: 1px solid #ccc;
- border-top-color: #999;
- background: #fff;
- color: #333;
- -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
- -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
- transition: border linear 0.2s, box-shadow linear 0.2s;
+ text-transform: none;
}
-input.form-text:focus,
-input.form-tel:focus,
-input.form-email:focus,
-input.form-url:focus,
-input.form-search:focus,
-input.form-number:focus,
-input.form-color:focus,
-input.form-file:focus,
-textarea.form-textarea:focus,
-select.form-select:focus {
- color: #000;
- border-color: rgba(0, 116, 189, 0.8);
- -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(220, 220, 220, 0.4);
- -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(220, 220, 220, 0.4);
- box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(220, 220, 220, 0.4);
- outline-color: rgba(0, 116, 189, 0.5);
+
+/**
+ * Accordion: custom collapsible fielset block
+ *
+ * @todo the holy grail technique needs to be isolated into a variant or scoped.
+ */
+.accordion {
+ background-color: #eee;
+ border-left: 1px solid #ccc;
+ border-right: 1px solid #ccc;
+ border-top: 1px solid #ccc;
+ margin-bottom: 1em;
}
-.js input.form-autocomplete {
- background-position: 100% 4px;
+.accordion > .form-wrapper {
+ border: 0;
+ -moz-box-shadow: 0 1px 0 white;
+ -webkit-box-shadow: 0 1px 0 white;
+ box-shadow: 0 1px 0 white;
+ margin: 0;
}
-.js input.throbbing {
- background-position: 100% -16px;
+.accordion .collapsibles > .fieldset-wrapper {
+ margin: 0;
+ padding: 0;
}
-ul.action-links {
- margin: 1em 0;
- padding: 0 20px 0 20px; /* LTR */
+/* Expanded fieldset (default state) */
+.accordion .collapsible {
+ background-color: #e2e2e2;
+ background-image:
+ -moz-linear-gradient(left, rgba(0, 0, 0, .05), transparent 3px),
+ -moz-linear-gradient(right, rgba(0, 0, 0, .05), transparent 3px);
+ background-image:
+ -ms-linear-gradient(left, rgba(0, 0, 0, .05), transparent 3px),
+ -ms-linear-gradient(right, rgba(0, 0, 0, .05), transparent 3px);
+ background-image:
+ -o-linear-gradient(left, rgba(0, 0, 0, .05), transparent 3px),
+ -o-linear-gradient(right, rgba(0, 0, 0, .05), transparent 3px);
+ background-image:
+ -webkit-linear-gradient(left, rgba(0, 0, 0, .05), transparent 3px),
+ -webkit-linear-gradient(right, rgba(0, 0, 0, .05), transparent 3px);
+ background-image:
+ linear-gradient(left, rgba(0, 0, 0, .05), transparent 3px),
+ linear-gradient(right, rgba(0, 0, 0, .05), transparent 3px);
+ border-bottom: 1px solid #a5a5a5;
+ border-left: 0;
+ border-right: 0;
+ border-top: 0;
+ -moz-box-shadow: inset 0 1px 0px rgba(255, 255, 255, .5);
+ -webkit-box-shadow: inset 0 1px 0px rgba(255, 255, 255, .5);
+ box-shadow: inset 0 1px 0px rgba(255, 255, 255, .5);
+ margin: 0;
+ text-shadow: 0 1px 0 white;
+ -moz-transition: background-color .1s;
+ -ms-transition: background-color .1s;
+ -o-transition: background-color .1s;
+ -webkit-transition: background-color .1s;
+ transition: background-color .1s;
+}
+/* Expanded, with top inner shadow */
+.accordion .collapsible:first-child,
+.accordion .collapsed + .collapsible {
+ -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .14);
+ -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .14);
+ box-shadow: inset 0 2px 4px rgba(0, 0, 0, .14);
+}
+/* Override all expanded variants */
+.accordion .collapsed {
+ background-color: transparent !important;
+ background-image: none !important;
+ border-bottom: 1px solid #b5b5b5 !important;
+ -moz-box-shadow: inset 0 1px 0px white !important;
+ -webkit-box-shadow: inset 0 1px 0px white !important;
+ box-shadow: inset 0 1px 0px white !important;
+}
+.accordion .collapsible a {
+ color: #005E99;
+}
+.accordion .collapsed a {
+ color: #0074BD;
+}
+@media screen and (min-width: 900px) {
+ .layout-form-3 .form-region-second .accordion {
+ background-color: transparent;
+ margin-bottom: 0;
+ }
+ .overlay .layout-form-3 .form-region-second .accordion {
+ border: 0;
+ }
+ .overlay .layout-form-3 .form-region-second .accordion .collapsible {
+ background-image: -moz-linear-gradient(left, rgba(0, 0, 0, .08), transparent 6px);
+ background-image: -ms-linear-gradient(left, rgba(0, 0, 0, .08), transparent 6px);
+ background-image: -o-linear-gradient(left, rgba(0, 0, 0, .08), transparent 6px);
+ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .08), transparent 6px);
+ background-image: linear-gradient(left, rgba(0, 0, 0, .08), transparent 6px);
+ }
+}
+
+/**
+ * Buttons
+ *
+ * 1. Font metrics matter for vertical centering of button text. Choose a single
+ * consistent typeface.
+ * 2. Image file gradient fallback
+ */
+.button {
+ background: #f9f9f9 url(images/buttons.png) repeat-x left top; /* 2 */
+ background: #f9f9f9 -moz-linear-gradient(top, transparent, rgba(0, 0, 0, .12));
+ background: #f9f9f9 -ms-linear-gradient(top, transparent, rgba(0, 0, 0, .12));
+ background: #f9f9f9 -o-linear-gradient(top, transparent, rgba(0, 0, 0, .12));
+ background: #f9f9f9 -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, .12));
+ background: #f9f9f9 linear-gradient(top, transparent, rgba(0, 0, 0, .12));
+ border: 1px solid #999;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4);
+ -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4);
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4);
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ color: #222;
+ cursor: pointer;
+ display: inline-block;
+ font-family: Arial, sans-serif; /* 1 */
+ line-height: 1em;
+ padding: 8px 2.5em;
+ text-align: center;
+ text-decoration: none;
+ text-shadow: 0 1px rgba(255, 255, 255, .85);
+}
+.button:focus,
+.button:hover {
+ background: white -moz-linear-gradient(top, transparent, rgba(0, 0, 0, .09));
+ background: white -ms-linear-gradient(top, transparent, rgba(0, 0, 0, .09));
+ background: white -o-linear-gradient(top, transparent, rgba(0, 0, 0, .09));
+ background: white -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, .09));
+ background: white linear-gradient(top, transparent, rgba(0, 0, 0, .09));
+}
+.button:active {
+ background: #f9f9f9 url(images/buttons.png) repeat-x left bottom;
+ background: #f9f9f9 -moz-linear-gradient(bottom, rgba(0, 0, 0, .05), rgba(0, 0, 0, .15));
+ background: #f9f9f9 -ms-linear-gradient(bottom, rgba(0, 0, 0, .05), rgba(0, 0, 0, .15));
+ background: #f9f9f9 -o-linear-gradient(bottom, rgba(0, 0, 0, .05), rgba(0, 0, 0, .15));
+ background: #f9f9f9 -webkit-linear-gradient(bottom, rgba(0, 0, 0, .05), rgba(0, 0, 0, .15));
+ background: #f9f9f9 linear-gradient(bottom, rgba(0, 0, 0, .05), rgba(0, 0, 0, .15));
+ border-color: #999;
+ -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .25);
+ -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .25);
+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, .25);
+}
+.form-file + .button,
+.form-item-operation + .button {
+ margin-left: .5em;
+}
+td .button {
+ height: auto;
+ padding-bottom: .4em;
+ padding-top: .4em;
+}
+/**
+ * Reversed-color buttons (white text on dark)
+ *
+ * 1. prevent over-bold letterforms in webkit
+ */
+.button-primary,
+.button-delete {
+ color: white;
+ font-weight: bolder;
+ -webkit-font-smoothing: antialiased; /* 1 */
+ text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
+}
+/* Primary button */
+.button-primary {
+ background-color: #4f9fea;
+ background-image: -moz-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -ms-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -o-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -webkit-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ border-color: #3974ae;
+}
+.button-primary:focus,
+.button-primary:hover {
+ background-color: #55adff;
+ background-image: -moz-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, .4));
+ background-image: -ms-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, .4));
+ background-image: -o-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, .4));
+ background-image: -webkit-linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, .4));
+ background-image: linear-gradient(top, rgba(68, 129, 220, 0), rgba(68, 129, 220, .4));
+
+}
+.button-primary:active {
+ background-color: #4f9fea;
+ background-image: -moz-linear-gradient(bottom, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -ms-linear-gradient(bottom, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -o-linear-gradient(bottom, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: -webkit-linear-gradient(bottom, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ background-image: linear-gradient(bottom, rgba(68, 129, 220, 0), rgba(68, 129, 220, 1));
+ border-color: #3974ae;
+}
+/* Delete button */
+.button-delete {
+ background-color: #ed522f;
+ background-image: -moz-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -ms-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -o-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -webkit-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ border-color: #91311c;
+}
+.button-delete:focus,
+.button-delete:hover {
+ background-color: #ff6541;
+ background-image: -moz-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, .4));
+ background-image: -ms-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, .4));
+ background-image: -o-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, .4));
+ background-image: -webkit-linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, .4));
+ background-image: linear-gradient(top, rgba(200, 61, 29, 0), rgba(200, 61, 29, .4));
+}
+.button-delete:active {
+ background-color: #ed522f;
+ background-image: -moz-linear-gradient(bottom, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -ms-linear-gradient(bottom, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -o-linear-gradient(bottom, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: -webkit-linear-gradient(bottom, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ background-image: linear-gradient(bottom, rgba(200, 61, 29, 0), rgba(200, 61, 29, 1));
+ border-color: #91311c;
+}
+/* Disabled buttons; selectors are overqualified to override other states. */
+.button.button[disabled],
+.button.button-disabled,
+input[type].form-button-disabled {
+ background: #eee;
+ border-color: #aaa;
+ -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4);
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4);
+ color: #777;
+ cursor: not-allowed;
+ opacity: .65;
+ text-shadow: none;
+}
+
+/**
+ * Action links
+ *
+ * Links at the top of admin pages, like the '+ Add content' link at the top
+ * of /admin/content
+ */
+.action-links {
list-style-type: none;
+ margin: 1em 0;
overflow: hidden;
+ padding-left: 0; /* LTR */
}
-ul.action-links li {
+.action-links > li {
float: left; /* LTR */
margin: 0 1em 0 0; /* LTR */
}
-ul.action-links a {
- padding-left: 15px; /* LTR */
+.action-links a {
background: transparent url(images/add.png) no-repeat 0 center;
line-height: 30px;
+ padding-left: 15px; /* LTR */
}
-/* Exceptions */
-#diff-inline-form select,
-div.filter-options select {
+/**
+ * Page layout
+ */
+#page {
+ background: #fff;
+ color: #333;
+ padding: 0 4% 15px;
+ position: relative;
+}
+#content {
+ clear: left;
+}
+#secondary-links ul.links li {
+ padding: 0 10px 10px 0; /* LTR */
+}
+#secondary-links ul.links li a {
+ background: #777;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ color: #fff;
+ font-size: 0.923em;
+ height: 55px;
+ overflow: hidden;
+ padding: 5px;
+ text-align: center;
+ width: 80px;
+}
+#secondary-links ul.links li a:hover {
+ background: #999;
+}
+ul.links li,
+ul.inline li {
+ padding-right: 1em; /* LTR */
+}
+ul.inline li {
+ display: inline;
+}
+#secondary-links ul.links li.active-trail a,
+#secondary-links ul.links li a.active {
+ background: #333;
+}
+ul.admin-list li {
+ background: url(images/list-item.png) no-repeat 0 11px; /* LTR */
+ border-top: 1px solid #ccc;
+ list-style-image: none;
+ list-style-type: none;
+ margin-bottom: 10px;
+ margin-left: 0; /* LTR */
+ padding-left: 30px; /* LTR */
+ padding-top: 9px;
+ position: relative;
+}
+.admin-panel .item-list ul,
+ul.admin-list {
+ margin: 0;
padding: 0;
}
+.admin-panel .item-list ul,
+ul.admin-list.compact {
+ margin: 8px 0;
+}
+.admin-panel .item-list li,
+ul.admin-list.compact li {
+ background: none;
+ border: none;
+ line-height: 1;
+ margin: 0 0 0.75em;
+ padding: 0;
+}
+ul.admin-list li:last-child {
+ border-bottom: none;
+}
+ul.admin-list li a {
+ margin-left: -30px; /* LTR */
+ min-height: 0;
+ padding: 0 0 4px 30px; /* LTR */
+}
+ul.admin-list.compact li a {
+ margin-left: 0; /* LTR */
+ padding: 0;
+}
+ul.admin-list li div.description a {
+ margin-left: 0; /* LTR */
+ min-height: inherit;
+ padding: 0;
+}
+div.submitted {
+ color: #898989;
+}
+
+/**
+ * Node add/edit pages
+ *
+ * Widescreen version has main fields to the left and settings in a sidebar;
+ * mobile layout is stacked, top-to-bottom: main fields, settings, form actions.
+ */
+.region-content .preview {
+ margin-bottom: 1.5em;
+}
+.form-region-footer {
+ overflow: hidden;
+ padding-bottom: 1em;
+}
+#edit-settings-summary {
+ border-bottom: 1px solid #bbb;
+ overflow: hidden;
+ padding-bottom: .5em;
+}
+#edit-settings-summary > legend {
+ display: none;
+}
+#edit-settings-summary .form-item {
+ font-size: 1em;
+ margin: 0;
+ padding: 0;
+}
+#edit-settings-summary #edit-publication-state {
+ font-size: 1.231em;
+ font-weight: normal;
+ margin-bottom: 0;
+ margin-top: 1em;
+ text-shadow: 0 1px 0 white;
+}
+#edit-settings-summary #edit-last-saved {
+ margin-bottom: .5em;
+}
+#edit-settings-summary .form-item-log {
+ margin-top: .5em;
+}
+.node-form-revision-information {
+ background: transparent;
+ border: 0;
+}
+.node-form-revision-information > .fieldset-wrapper {
+ margin: 0;
+ padding: 0;
+}
+.form-actions {
+ margin-top: 1em;
+}
+.form-actions > * {
+ margin-right: 1em; /* LTR; @todo RTL */
+}
+.form-action-group {
+ background-color: #eee;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ border: 1px solid #ccc;
+ -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15);
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15);
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ display: inline-block;
+ margin-top: -4px;
+ padding: 3px 6px 3px 3px; /* LTR; @todo RTL */
+}
+.button-delete {
+ float: right; /* LTR; @todo RTL */
+ margin-right: 0; /* LTR; @todo RTL */
+ width: auto;
+}
+@media screen and (max-width: 600px) {
+ .form-actions > * {
+ margin-right: 0; /* LTR; @todo RTL */
+ width: 100%;
+ }
+ .form-actions > * + * {
+ margin-top: 1.75em;
+ }
+ .form-action-group .button {
+ display: inline-block;
+ margin: 0;
+ width: 50%;
+ }
+ .form-action-group input,
+ .form-action-group select {
+ width: 48%;
+ }
+}
+@media screen and (min-width: 900px) {
+ .overlay[class*="page-node-add-"] #overlay-content,
+ .overlay.page-node-edit #overlay-content {
+ padding: 0;
+ }
+ #page {
+ padding-bottom: 40px;
+ }
+ .overlay[class*="page-node-add-"] #page,
+ .overlay.page-node-edit #page {
+ padding-bottom: 0;
+ }
+ /* form container */
+ .layout-form-3 {
+ overflow: hidden;
+ position: relative;
+ }
+ .layout-form-3:after {
+ background: #ccc;
+ bottom: 0;
+ content: '';
+ display: block;
+ height: 1px;
+ position: absolute;
+ right: 0; /* LTR; @todo RTL */
+ width: 35%;
+ }
+ .overlay .layout-form-3 {
+ border-top: 1px solid #ccc;
+ margin-left: -20px;
+ margin-right: -20px;
+ }
+ .overlay .layout-form-3:after {
+ display: none;
+ }
+ /* layout regions */
+ .form-region {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ }
+ .layout-form-3 .form-region-first,
+ .layout-form-3 .form-region-footer {
+ float: left; /* LTR; @todo RTL */
+ padding-right: 20px; /* LTR; @todo RTL */
+ width: 65%;
+ }
+ .overlay .layout-form-3 .form-region-first {
+ padding-top: 1.5em;
+ }
+ .overlay .layout-form-3 .form-region-first,
+ .overlay .layout-form-3 .form-region-footer {
+ padding-left: 20px; /* LTR; @todo RTL */
+ }
+ .layout-form-3 .form-region-second {
+ background-color: #eee;
+ border-left: 1px solid #c6c6c6;
+ -moz-box-shadow: inset 0.2em 0.1em .5em rgba(0, 0, 0, .1); /* LTR; @todo RTL */
+ -webkit-box-shadow: inset 0.2em 0.1em .5em rgba(0, 0, 0, .1); /* LTR; @todo RTL */
+ box-shadow: inset 0.2em 0.1em .5em rgba(0, 0, 0, .1); /* LTR; @todo RTL */
+ float: right; /* LTR; @todo RTL */
+ margin-bottom: -999em;
+ padding-bottom: 999em;
+ width: 35%;
+ }
+ /* input and textarea tweaks */
+ .layout-form-3 .form-region-second input,
+ .layout-form-3 .form-region-second textarea {
+ background-color: white;
+ }
+ .layout-form-3 .form-region-second .collapsible input,
+ .layout-form-3 .form-region-second .collapsible textarea {
+ background-color: #f4f4f4;
+ }
+}
/**
- * System.
+ * System
*/
@media screen and (min-width: 40em) {
div.admin .right,
@@ -772,23 +1284,25 @@ div.filter-options select {
}
div.admin-panel,
div.admin-panel .body {
- padding: 0;
clear: left;
+ padding: 0;
}
div.admin-panel {
- margin: 0 0 20px;
- padding: 9px;
background: #f8f8f8;
border: 1px solid #ccc;
+ margin: 0 0 20px;
+ padding: 9px;
}
div.admin-panel h3 {
font-size: 0.923em;
- text-transform: uppercase;
margin: 0;
padding-bottom: 9px;
+ text-transform: uppercase;
}
-/* admin/appearance */
+/**
+ * Appearance page (theme configuring)
+ */
#system-themes-page h2 {
font-weight: normal;
text-transform: uppercase;
@@ -803,63 +1317,66 @@ div.admin-panel h3 {
margin-top: 0;
}
-/* Update options. */
+/**
+ * Update options
+ */
div.admin-options {
background: #f8f8f8;
- line-height: 30px;
- height: 30px;
- padding: 9px;
border: 1px solid #ccc;
+ height: 30px;
+ line-height: 30px;
margin: 0 0 10px;
+ padding: 9px;
}
div.admin-options label {
- text-transform: uppercase;
font: 0.846em/1.875em Lucida Grande, Lucida Sans Unicode, sans-serif;
+ text-transform: uppercase;
}
div.admin-options label,
div.admin-options div.form-item {
- margin-right: 10px; /* LTR */
float: left; /* LTR */
+ margin-right: 10px; /* LTR */
}
div.admin-options div.form-item {
- padding: 0;
border: 0;
+ padding: 0;
}
-
/* Update status */
.versions table.version {
border: none;
}
-/* Maintenance theming */
+/**
+ * Maintenance page
+ */
body.in-maintenance #sidebar-first {
float: left; /* LTR */
width: 200px;
}
body.in-maintenance #content {
+ clear: none;
float: right; /* LTR */
- width: 550px;
padding-right: 20px; /* LTR */
- clear: none;
+ width: 550px;
}
body.in-maintenance #page {
- overflow: auto;
- width: 770px;
margin: 0 auto;
+ overflow: auto;
padding-top: 2em;
+ width: 770px;
}
body.in-maintenance #branding h1 {
- width: 770px;
- margin: 0 auto;
float: none;
+ margin: 0 auto;
+ width: 770px;
}
body.in-maintenance .form-radios .form-type-radio {
padding: 2px 0;
}
body.in-maintenance div.form-item:after {
+ clear: none;
content: "";
display: none;
- clear: none;
}
body.in-maintenance .form-submit {
display: block;
@@ -869,30 +1386,65 @@ body.in-maintenance #logo {
max-width: 180px;
}
ol.task-list {
- margin-left: 0; /* LTR */
- list-style-type: none;
list-style-image: none;
+ list-style-type: none;
+ margin-left: 0; /* LTR */
}
ol.task-list li {
- padding: 0.5em 1em 0.5em 20px; /* LTR */
color: #adadad;
+ padding: 0.5em 1em 0.5em 20px; /* LTR */
}
ol.task-list li.active {
background: transparent url(images/task-item.png) no-repeat 3px 50%; /* LTR */
- padding: 0.5em 1em 0.5em 20px; /* LTR */
color: #000;
+ padding: 0.5em 1em 0.5em 20px; /* LTR */
}
ol.task-list li.done {
background: transparent url(images/task-check.png) no-repeat 0 50%;
color: green;
}
-/* Overlay theming */
+/**
+ * Overlay
+ */
+#overlay {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ min-width: 0;
+ overflow-x: hidden; /* prevent unnecessary scrollbars; @todo: more testing */
+ padding-left: 36px;
+ padding-right: 36px;
+ padding-top: 0;
+ width: 100%;
+}
+@media screen and (min-width: 900px) {
+ #overlay {
+ padding-right: 48px; /* LTR */
+ }
+}
+#overlay-tabs {
+ bottom: -1px;
+ font-size: 1.54em;
+ line-height: 1.54em;
+ margin: 0;
+}
+#overlay-tabs li {
+ margin: 0 -2px;
+}
+#overlay-content {
+ padding: 0 0 1em 0;
+}
.overlay #branding {
background-color: #fff;
+ padding-left: 20px;
+ padding-right: 20px;
padding-top: 15px;
}
-.overlay #branding h1.page-title,
+.overlay .breadcrumb {
+ padding-bottom: 0;
+}
+.overlay .page-title,
.overlay #left,
.overlay #footer {
display: none;
@@ -901,20 +1453,6 @@ ol.task-list li.done {
margin: 0;
padding: 0 20px;
}
-.overlay #branding div.breadcrumb {
- float: left; /* LTR */
- position: relative;
- z-index: 10;
-}
-#overlay-tabs {
- bottom: -1px;
- font-size: 1.54em;
- line-height: 1.54em;
- margin: 0;
-}
-#overlay-tabs li {
- margin: 0 -2px;
-}
.overlay ul.secondary {
background: transparent none;
margin: -1.4em 0 0.3em 0; /* LTR */
@@ -923,19 +1461,40 @@ ol.task-list li.done {
.overlay #content {
padding: 0;
}
-h1#overlay-title {
- font-weight: normal;
-}
-/* Shortcut theming */
+/**
+ * Shortcuts
+ */
div.add-or-remove-shortcuts {
float: left; /* LTR */
- padding-top: 6px;
padding-left: 6px; /* LTR */
+ padding-top: 6px;
}
-/* Field UI */
+/**
+ * Dashboard
+ */
+#dashboard .dashboard-region div.block h2 {
+ background: #E0E0D8;
+}
+#dashboard div.block h2 {
+ font-size: 1em;
+ margin: 0;
+ padding: 3px 10px;
+}
+#dashboard div.block div.content {
+ padding: 10px 5px 5px 5px; /* LTR */
+}
+#dashboard div.block div.content ul.menu {
+ margin-left: 20px; /* LTR */
+}
+#dashboard .dashboard-region .block {
+ border: #ccc 1px solid;
+}
+/**
+ * Field UI
+ */
#field-display-overview input.field-formatter-settings-edit {
margin: 0;
padding: 1px 8px;
@@ -956,16 +1515,24 @@ div.add-or-remove-shortcuts {
margin-bottom: 0;
}
-/* Recent content block */
+/**
+ * Recent Content block
+ */
+#dashboard div#block-node-recent div.content {
+ padding: 0;
+}
#block-node-recent table,
-#block-node-recent tr {
+#block-node-recent tr,
+#block-node-recent td:last-child {
border: none;
}
#block-node-recent .more-link {
padding: 0 5px 5px 0; /* LTR */
}
-/* User login block */
+/**
+ * User Login block
+ */
#user-login-form .openid-links {
margin-left: 0; /* LTR */
}
@@ -973,7 +1540,9 @@ div.add-or-remove-shortcuts {
margin-left: 1.5em; /* LTR */
}
-/* Disable overlay message */
+/**
+ * 'Disable Overlay' message
+ */
#overlay-disable-message {
background-color: #addafc;
}
@@ -991,7 +1560,7 @@ div.add-or-remove-shortcuts {
}
.overlay-disable-message-focused #overlay-dismiss-message {
background-color: #59a0d8;
- color: #fff;
-moz-border-radius: 8px;
border-radius: 8px;
+ color: #fff;
}
diff --git a/core/themes/seven/template.php b/core/themes/seven/template.php
index d47f57a9098a315e44aba4b8ea2828b66c7afdf0..1bc5f6a338ca3c6cfc39ba988cdaf237cbd35e91 100644
--- a/core/themes/seven/template.php
+++ b/core/themes/seven/template.php
@@ -115,3 +115,44 @@ function seven_css_alter(&$css) {
$css['core/misc/ui/jquery.ui.theme.css']['data'] = drupal_get_path('theme', 'seven') . '/jquery.ui.theme.css';
}
}
+
+/**
+ * Overrides theme_button().
+ *
+ * Seven generalizes its button styles; apply a .button class in addition to the
+ * standard `form-submit` class. If the #button_type has been set, forego the
+ * `form-submit` class and add button sub-classes of the form `.button-#button_type`.
+ * So for a #button_type of 'primary', classes will be "button button-primary".
+ */
+function seven_button($variables) {
+ $element = $variables['element'];
+ $element['#attributes']['type'] = 'submit';
+ element_set_attributes($element, array('id', 'name', 'value'));
+
+ $element['#attributes']['class'][] = 'button';
+ if (!empty($element['#button_type'])) {
+ $element['#attributes']['class'][] = 'button-' . $element['#button_type'];
+ }
+ else {
+ $element['#attributes']['class'][] = 'form-submit';
+ }
+ if (!empty($element['#attributes']['disabled'])) {
+ $element['#attributes']['class'][] = 'button-disabled';
+ }
+
+ return '';
+}
+
+/**
+ * Process variables for layout-form-3.tpl.php
+ *
+ * Wrap region contents in a faux-block.
+ */
+function seven_preprocess_layout_form_3(&$vars) {
+ $form_settings = array(
+ '#prefix' => '',
+ '#suffix' => '
',
+ 'content' => $vars['regions']['second'],
+ );
+ $vars['regions']['second'] = $form_settings;
+}