+
{% if prefix %}
-
{{ prefix }}
+
{{ prefix }}
{% endif %}
{{ children }}
{% if suffix %}
-
{{ suffix }}
+
{{ suffix }}
{% endif %}
{% if description.content %}
-
{{ description.content }}
+
{{ description.content }}
{% endif %}
diff --git a/core/modules/system/templates/form-element-label.html.twig b/core/modules/system/templates/form-element-label.html.twig
index 6ececd9..2bfd74a 100644
--- a/core/modules/system/templates/form-element-label.html.twig
+++ b/core/modules/system/templates/form-element-label.html.twig
@@ -16,7 +16,6 @@
#}
{%
set classes = [
- title_display == 'after' ? 'option',
title_display == 'invisible' ? 'visually-hidden',
required ? 'form-required',
]
diff --git a/core/modules/system/templates/form-element.html.twig b/core/modules/system/templates/form-element.html.twig
index a961801..54a4ade 100644
--- a/core/modules/system/templates/form-element.html.twig
+++ b/core/modules/system/templates/form-element.html.twig
@@ -47,16 +47,11 @@
#}
{%
set classes = [
- 'form-item',
- 'form-type-' ~ type|clean_class,
- 'form-item-' ~ name|clean_class,
- title_display not in ['after', 'before'] ? 'form-no-label',
- disabled == 'disabled' ? 'form-disabled',
+ disabled == 'disabled' ? 'js-form-disabled',
]
%}
{%
set description_classes = [
- 'description',
description_display == 'invisible' ? 'visually-hidden',
]
%}
@@ -65,7 +60,7 @@
{{ label }}
{% endif %}
{% if prefix is not empty %}
-
{{ prefix }}
+
{{ prefix }}
{% endif %}
{% if description_display == 'before' and description.content %}
@@ -74,7 +69,7 @@
{% endif %}
{{ children }}
{% if suffix is not empty %}
- {{ suffix }}
+ {{ suffix }}
{% endif %}
{% if label_display == 'after' %}
{{ label }}
diff --git a/core/themes/bartik/css/components/form.css b/core/themes/bartik/css/components/form.css
index 69a0a72..518fff8 100644
--- a/core/themes/bartik/css/components/form.css
+++ b/core/themes/bartik/css/components/form.css
@@ -169,9 +169,9 @@ input.form-submit:focus {
}
/* Disabled form elements */
-.form-disabled input,
-.form-disabled select,
-.form-disabled textarea,
+.js-form-disabled input,
+.js-form-disabled select,
+.js-form-disabled textarea,
.form-button-disabled,
.form-button-disabled:hover,
.form-button-disabled:active,
@@ -189,7 +189,7 @@ input.form-submit:focus {
filter: alpha(opacity=50);
opacity: .5;
}
-.form-disabled label {
+.js-form-disabled label {
color: #717171;
}
diff --git a/core/themes/seven/css/components/form.css b/core/themes/seven/css/components/form.css
index 79b342e..7e49f64 100644
--- a/core/themes/seven/css/components/form.css
+++ b/core/themes/seven/css/components/form.css
@@ -40,20 +40,20 @@ label[for] {
.form-item label.option input {
vertical-align: middle;
}
-.form-disabled label {
+.js-form-disabled label {
color: #737373;
}
-.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 {
+.js-form-disabled input.form-text,
+.js-form-disabled input.form-tel,
+.js-form-disabled input.form-email,
+.js-form-disabled input.form-url,
+.js-form-disabled input.form-search,
+.js-form-disabled input.form-number,
+.js-form-disabled input.form-color,
+.js-form-disabled input.form-file,
+.js-form-disabled textarea.form-textarea,
+.js-form-disabled select.form-select {
border-color: #d4d4d4;
background-color: hsla(0, 0%, 0%, .08);
box-shadow: none;