diff --git a/core/themes/seven/css/components/buttons.css b/core/themes/seven/css/components/buttons.css
index ffc7d43..7369479 100644
--- a/core/themes/seven/css/components/buttons.css
+++ b/core/themes/seven/css/components/buttons.css
@@ -12,6 +12,10 @@
* 1. Enable z-index on buttons.
* 2. Normalize 'line-height'; can’t be changed from 'normal' in Firefox 4+.
* 3. Allows full range of styling in Webkit and Gecko.
+ * 4. Use px units to ensure button text is centered vertically.
+ * 5. Use rems to avoid the font size cascade of ems, with a px fallback for
+ * older browsers.
+ * 6. Prevent fat text in WebKit.
*
* @todo Consider moving box-sizing into base.css under a universal selector.
* See https://drupal.org/node/2124251
@@ -25,15 +29,123 @@
line-height: normal; /* 2 */
cursor: pointer;
-webkit-appearance: none; /* 3 */
- -moz-appearance: none; /* " */
+ -moz-appearance: none; /* 3 */
+ padding: 4px 1.5em; /* 4 */
+ border: 1px solid #a6a6a6;
+ border-radius: 20em;
+ background-color: #f2f1eb;
+ background-image: -webkit-linear-gradient(top, #f6f6f3, #e7e7df);
+ background-image: linear-gradient(to bottom, #f6f6f3, #e7e7df);
+ color: #333;
+ text-decoration: none;
+ text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
+ font-weight: 600;
+ font-size: 14px;
+ font-size: 0.875rem; /* 5 */
+ -webkit-transition: all 0.1s;
+ transition: all 0.1s;
+ -webkit-font-smoothing: antialiased; /* 6 */
+}
+.button:hover,
+.button:focus {
+ background-color: #f9f8f6;
+ background-image: -webkit-linear-gradient(top, #fcfcfa, #e9e9dd);
+ background-image: linear-gradient(to bottom, #fcfcfa, #e9e9dd);
+ color: #1a1a1a;
+ text-decoration: none;
+ outline: none;
+}
+.button:hover {
+ box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.125);
}
/* Prevent focus ring being covered by next siblings. */
.button:focus {
z-index: 10;
+ border: 1px solid #3AB2FF;
+ box-shadow: 0 0 0.5em 0.1em hsla(203, 100%, 60%, 0.7);
+}
+.button:active {
+ border: 1px solid #a6a6a6;
+ background-color: #dfdfd9;
+ background-image: -webkit-linear-gradient(top, #f6f6f3, #e7e7df);
+ background-image: linear-gradient(to bottom, #f6f6f3, #e7e7df);
+ box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.2);
+ -webkit-transition: none;
+ transition: none;
+}
+
+.button--primary {
+ border-color: #1e5c90;
+ background-color: #0071b8;
+ background-image: -webkit-linear-gradient(top, #007bc6, #0071b8);
+ background-image: linear-gradient(to bottom, #007bc6, #0071b8);
+ color: #fff;
+ text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
+ font-weight: 700;
+ -webkit-font-smoothing: antialiased;
+}
+.button--primary:hover,
+.button--primary:focus {
+ background-color: #2369a6;
+ background-image: -webkit-linear-gradient(top, #0c97ed, #1f86c7);
+ background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
+ border-color: #1e5c90;
+ color: #fff;
+}
+.button--primary:focus {
+ border: 1px solid #1280DF;
+}
+.button--primary:hover {
+ box-shadow: 0 1px 2px hsla(203, 10%, 10%, 0.25);
+}
+.button--primary:active {
+ background-image: -webkit-linear-gradient(top, #08639b, #0071b8);
+ background-image: linear-gradient(to bottom, #08639b, #0071b8);
+ border-color: #144b78;
+ box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.2);
+}
+
+/**
+ * Overrides styling from system.theme.
+ */
+.button-action:before {
+ margin-left: -0.2em;
+ padding-right: 0.2em;
+ font-size: 14px;
+ font-size: 0.875rem;
+ line-height: 16px;
+ -webkit-font-smoothing: auto;
+}
+
+/**
+ * 1. Use px units to ensure button text is centered vertically.
+ */
+.no-touch .button--small {
+ font-size: 13px;
+ font-size: 0.813rem;
+ padding: 2px 1em; /* 1 */
+}
+
+.button:disabled,
+.button:disabled:active,
+.button.is-disabled,
+.button.is-disabled:active {
+ border-color: #d4d4d4;
+ background: #ededed;
+ box-shadow: none;
+ color: #5c5c5c;
+ font-weight: normal;
+ cursor: default;
+ text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
}
/* Link actions. */
+
+/**
+ * Style a clickable/tappable element as a link. Duplicates the base style for
+ * the tag, plus a reset for padding, borders and background.
+ */
.link {
display: inline;
cursor: pointer;
@@ -41,5 +153,55 @@
border: 0;
background: none;
-webkit-appearance: none;
- -moz-appearance: none;
+ -moz-appearance: none;
+ color: #0074bd;
+ text-decoration: none;
+}
+.link:hover,
+.link:focus {
+ color: #008ee6;
+ text-decoration: underline;
+}
+
+/**
+ * We've temporarily added the danger button here, bit of a harsh reset but we
+ * need it.
+ * @todo replace with link--danger.
+ * See https://drupal.org/node/2123731
+ */
+.button--danger {
+ display: inline;
+ cursor: pointer;
+ padding: 0;
+ border: 0;
+ border-radius: 0;
+ box-shadow: none;
+ background: none;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ color: #c72100;
+ font-weight: 400;
+ text-decoration: underline;
+}
+.button--danger:hover,
+.button--danger:focus,
+.button--danger:active {
+ color: #ff2a00;
+ text-decoration: underline;
+ text-shadow: none;
+ padding: 0;
+ border: 0;
+ box-shadow: none;
+ background: none;
+}
+.button--danger:disabled,
+.button--danger.is-disabled {
+ color: #737373;
+ cursor: default;
+ text-decoration: none;
+ -webkit-font-smoothing: antialiased;
+ padding: 0;
+ border: 0;
+ box-shadow: none;
+ background: none;
}
diff --git a/core/themes/seven/css/components/buttons.theme.css b/core/themes/seven/css/components/buttons.theme.css
deleted file mode 100644
index f7152fc..0000000
--- a/core/themes/seven/css/components/buttons.theme.css
+++ /dev/null
@@ -1,179 +0,0 @@
-/**
- * @file
- * Stylistic treatment for Seven’s UI buttons
- */
-
-/* Buttons. */
-
-/**
- * 1. Use px units to ensure button text is centered vertically.
- * 2. Use rems to avoid the font size cascade of ems, with a px fallback for
- * older browsers.
- * 3. Prevent fat text in WebKit.
- */
-.button {
- padding: 4px 1.5em; /* 1 */
- border: 1px solid #a6a6a6;
- border-radius: 20em;
- background-color: #f2f1eb;
- background-image: -webkit-linear-gradient(top, #f6f6f3, #e7e7df);
- background-image: linear-gradient(to bottom, #f6f6f3, #e7e7df);
- color: #333333;
- text-decoration: none;
- text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
- font-weight: 600;
- font-size: 14px;
- font-size: 0.875rem; /* 2 */
- -webkit-transition: all 0.1s;
- transition: all 0.1s;
- -webkit-font-smoothing: antialiased; /* 3 */
-}
-.button:hover,
-.button:focus {
- background-color: #f9f8f6;
- background-image: -webkit-linear-gradient(top, #fcfcfa, #e9e9dd);
- background-image: linear-gradient(to bottom, #fcfcfa, #e9e9dd);
- color: #1a1a1a;
- text-decoration: none;
- outline: none;
-}
-.button:hover {
- box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.125);
-}
-.button:focus {
- border: 1px solid #3AB2FF;
- box-shadow: 0 0 0.5em 0.1em hsla(203, 100%, 60%, 0.7);
-}
-.button:active {
- border: 1px solid #a6a6a6;
- background-color: #dfdfd9;
- background-image: -webkit-linear-gradient(top, #f6f6f3, #e7e7df);
- background-image: linear-gradient(to bottom, #f6f6f3, #e7e7df);
- box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.2);
- -webkit-transition: none;
- transition: none;
-}
-
-.button--primary {
- border-color: #1e5c90;
- background-color: #0071b8;
- background-image: -webkit-linear-gradient(top, #007bc6, #0071b8);
- background-image: linear-gradient(to bottom, #007bc6, #0071b8);
- color: #fff;
- text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
- font-weight: 700;
- -webkit-font-smoothing: antialiased;
-}
-.button--primary:hover,
-.button--primary:focus {
- background-color: #2369a6;
- background-image: -webkit-linear-gradient(top, #0c97ed, #1f86c7);
- background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
- border-color: #1e5c90;
- color: #fff;
-}
-.button--primary:focus {
- border: 1px solid #1280DF;
-}
-.button--primary:hover {
- box-shadow: 0 1px 2px hsla(203, 10%, 10%, 0.25);
-}
-.button--primary:active {
- background-image: -webkit-linear-gradient(top, #08639b, #0071b8);
- background-image: linear-gradient(to bottom, #08639b, #0071b8);
- border-color: #144b78;
- box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.2);
-}
-
-/**
- * Overrides styling from system.theme.
- */
-.button-action:before {
- margin-left: -0.2em;
- padding-right: 0.2em;
- font-size: 14px;
- font-size: 0.875rem;
- line-height: 16px;
- -webkit-font-smoothing: auto;
-}
-
-/**
- * 1. Use px units to ensure button text is centered vertically.
- */
-.no-touch .button--small {
- font-size: 13px;
- font-size: 0.813rem;
- padding: 2px 1em; /* 1 */
-}
-
-.button:disabled,
-.button:disabled:active,
-.button.is-disabled,
-.button.is-disabled:active {
- border-color: #d4d4d4;
- background: #ededed;
- box-shadow: none;
- color: #5c5c5c;
- font-weight: normal;
- cursor: default;
- text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
-}
-
-/* Link actions. */
-
-/**
- * Style a clickable/tappable element as a link. Duplicates the base style for
- * the tag, plus a reset for padding, borders and background.
- */
-.link {
- color: #0074bd;
- text-decoration: none;
-}
-.link:hover,
-.link:focus {
- color: #008ee6;
- text-decoration: underline;
-}
-
-/**
- * We've temporarily added the danger button here, bit of a harsh reset but we
- * need it.
- * @todo replace with link--danger.
- * See https://drupal.org/node/2123731
- */
-.button--danger {
- display: inline;
- cursor: pointer;
- padding: 0;
- border: 0;
- border-radius: 0;
- box-shadow: none;
- background: none;
- -webkit-appearance: none;
- -moz-appearance: none;
- color: #c72100;
- font-weight: 400;
- text-decoration: underline;
-}
-.button--danger:hover,
-.button--danger:focus,
-.button--danger:active {
- color: #ff2a00;
- text-decoration: underline;
- text-shadow: none;
- padding: 0;
- border: 0;
- box-shadow: none;
- background: none;
-}
-.button--danger:disabled,
-.button--danger.is-disabled {
- color: #737373;
- cursor: default;
- text-decoration: none;
- -webkit-font-smoothing: antialiased;
- padding: 0;
- border: 0;
- box-shadow: none;
- background: none;
-}
diff --git a/core/themes/seven/css/components/dropbutton.component.css b/core/themes/seven/css/components/dropbutton.component.css
index 264f290..d62e42d 100644
--- a/core/themes/seven/css/components/dropbutton.component.css
+++ b/core/themes/seven/css/components/dropbutton.component.css
@@ -118,7 +118,7 @@
/**
* Rare instances when a dropbutton is actually just a button.
- * Copied from Seven's buttons.theme.css.
+ * Copied from Seven's buttons.css.
*/
.dropbutton-single .dropbutton-widget {
border: 0;
diff --git a/core/themes/seven/seven.libraries.yml b/core/themes/seven/seven.libraries.yml
index a446265..f784385 100644
--- a/core/themes/seven/seven.libraries.yml
+++ b/core/themes/seven/seven.libraries.yml
@@ -12,7 +12,6 @@ global-styling:
css/components/content-header.css: {}
css/components/breadcrumb.css: {}
css/components/buttons.css: {}
- css/components/buttons.theme.css: {}
css/components/colors.css: {}
css/components/comments.css: {}
css/components/messages.css: {}