diff --git a/core/includes/form.inc b/core/includes/form.inc
index 306fcbf..9b04108 100644
--- a/core/includes/form.inc
+++ b/core/includes/form.inc
@@ -4183,13 +4183,13 @@ function form_pre_render_button($element) {
$element['#attributes']['class'][] = 'button';
if (!empty($element['#button_type'])) {
- $element['#attributes']['class'][] = 'button-' . $element['#button_type'];
+ $element['#attributes']['class'][] = 'button--' . $element['#button_type'];
}
// @todo Various JavaScript depends on this button class.
$element['#attributes']['class'][] = 'form-submit';
if (!empty($element['#attributes']['disabled'])) {
- $element['#attributes']['class'][] = 'form-button-disabled';
+ $element['#attributes']['class'][] = 'is-disabled';
}
return $element;
@@ -4220,13 +4220,13 @@ function form_pre_render_image_button($element) {
$element['#attributes']['class'][] = 'image-button';
if (!empty($element['#button_type'])) {
- $element['#attributes']['class'][] = 'image-button-' . $element['#button_type'];
+ $element['#attributes']['class'][] = 'image-button--' . $element['#button_type'];
}
// @todo Various JavaScript depends on this button class.
$element['#attributes']['class'][] = 'form-submit';
if (!empty($element['#attributes']['disabled'])) {
- $element['#attributes']['class'][] = 'image-button-disabled';
+ $element['#attributes']['class'][] = 'is-disabled';
}
return $element;
diff --git a/core/modules/system/lib/Drupal/system/Tests/Form/ElementTest.php b/core/modules/system/lib/Drupal/system/Tests/Form/ElementTest.php
index be13136..6346638 100644
--- a/core/modules/system/lib/Drupal/system/Tests/Form/ElementTest.php
+++ b/core/modules/system/lib/Drupal/system/Tests/Form/ElementTest.php
@@ -99,12 +99,12 @@ function testOptions() {
function testButtonClasses() {
$this->drupalGet('form-test/button-class');
// Just contains(@class, "button") won't do because then
- // "button-foo" would contain "button". Instead, check
+ // "button--foo" would contain "button". Instead, check
// " button ". Make sure it matches in the beginning and the end too
// by adding a space before and after.
$this->assertEqual(2, count($this->xpath('//*[contains(concat(" ", @class, " "), " button ")]')));
- $this->assertEqual(1, count($this->xpath('//*[contains(concat(" ", @class, " "), " button-foo ")]')));
- $this->assertEqual(1, count($this->xpath('//*[contains(concat(" ", @class, " "), " button-danger ")]')));
+ $this->assertEqual(1, count($this->xpath('//*[contains(concat(" ", @class, " "), " button--foo ")]')));
+ $this->assertEqual(1, count($this->xpath('//*[contains(concat(" ", @class, " "), " button--danger ")]')));
}
/**
diff --git a/core/modules/system/lib/Drupal/system/Tests/Form/FormTest.php b/core/modules/system/lib/Drupal/system/Tests/Form/FormTest.php
index 951d7c0..f1389b5 100644
--- a/core/modules/system/lib/Drupal/system/Tests/Form/FormTest.php
+++ b/core/modules/system/lib/Drupal/system/Tests/Form/FormTest.php
@@ -582,11 +582,11 @@ function testDisabledMarkup() {
// Setup XPath and CSS class depending on #type.
if (in_array($item['#type'], array('button', 'submit'))) {
$path = "//!type[contains(@class, :div-class) and @value=:value]";
- $class = 'form-button-disabled';
+ $class = 'is-disabled';
}
elseif (in_array($item['#type'], array('image_button'))) {
$path = "//!type[contains(@class, :div-class) and @value=:value]";
- $class = 'image-button-disabled';
+ $class = 'is-disabled';
}
else {
// starts-with() required for checkboxes.
diff --git a/core/modules/system/lib/Drupal/system/Tests/Form/SystemConfigFormTest.php b/core/modules/system/lib/Drupal/system/Tests/Form/SystemConfigFormTest.php
index a672360..211d1be 100644
--- a/core/modules/system/lib/Drupal/system/Tests/Form/SystemConfigFormTest.php
+++ b/core/modules/system/lib/Drupal/system/Tests/Form/SystemConfigFormTest.php
@@ -35,7 +35,7 @@ public static function getInfo() {
*/
function testSystemConfigForm() {
$this->drupalGet('form-test/system-config-form');
- $element = $this->xpath('//div[@id = :id]/input[contains(@class, :class)]', array(':id' => 'edit-actions', ':class' => 'button-primary'));
+ $element = $this->xpath('//div[@id = :id]/input[contains(@class, :class)]', array(':id' => 'edit-actions', ':class' => 'button--primary'));
$this->assertTrue($element, 'The primary action submit button was found.');
$this->drupalPostForm(NULL, array(), t('Save configuration'));
$this->assertText(t('The configuration options have been saved.'));
diff --git a/core/themes/seven/css/components/buttons.css b/core/themes/seven/css/components/buttons.css
new file mode 100644
index 0000000..dd243ea
--- /dev/null
+++ b/core/themes/seven/css/components/buttons.css
@@ -0,0 +1,70 @@
+/**
+ * @file
+ * Structural styles for Seven’s UI buttons
+ *
+ * Apply these classes to any element (,