Skip to content
Snippets Groups Projects
Unverified Commit 7835007c authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3173018 by kostyashupenko, Pooja Ganjage, proeung, mherchel: [Code... 

Issue #3173018 by kostyashupenko, Pooja Ganjage, proeung, mherchel: [Code Review] Remove .form-type as this prefix block element doesn't exist
parent 83200c49
No related branches found
No related tags found
7 merge requests!7452Issue #1797438. HTML5 validation is preventing form submit and not fully...,!1012Issue #3226887: Hreflang on non-canonical content pages,!789Issue #3210310: Adjust Database API to remove deprecated Drupal 9 code in Drupal 10,!596Issue #3046532: deleting an entity reference field, used in a contextual view, makes the whole site unrecoverable,!496Issue #2463967: Use .user.ini file for PHP settings,!144Issue #2666286: Clean up menu_ui to conform to Drupal coding standards,!16Draft: Resolve #2081585 "History storage"
Hide whitespace changes
Inline Side-by-side
core/themes/olivero/css/components/form-boolean.css
+ 48
− 49
View file @ 7835007c
......@@ -61,43 +61,6 @@ input[type="checkbox"].error::-ms-check, input[type="radio"].error::-ms-check {
border: 1px solid #e33f1e;
}
[dir="ltr"] .form-type--boolean input[type="checkbox"],[dir="ltr"]
.form-type--boolean input[type="radio"] {
float: left
}
[dir="rtl"] .form-type--boolean input[type="checkbox"],[dir="rtl"]
.form-type--boolean input[type="radio"] {
float: right
}
[dir="ltr"] .form-type--boolean input[type="checkbox"],[dir="ltr"]
.form-type--boolean input[type="radio"] {
margin-left: -36px
}
[dir="rtl"] .form-type--boolean input[type="checkbox"],[dir="rtl"]
.form-type--boolean input[type="radio"] {
margin-right: -36px
}
.form-type--boolean input[type="checkbox"],
.form-type--boolean input[type="radio"] {
position: relative;
/* stylelint-disable-next-line csstools/use-logical */
top: 9px;
transform: translateY(-50%);
}
.form-type--boolean.form-no-label input[type="checkbox"],
.form-type--boolean.form-no-label input[type="radio"] {
position: static;
float: none;
margin-left: 0;
margin-right: 0;
transform: none;
}
input[type="checkbox"]:checked {
background-image: url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%232494DB' d='M14.8232 0.176777C14.9209 0.0791457 15.0791 0.0791455 15.1768 0.176777L16.9445 1.94454C17.0422 2.04217 17.0422 2.20047 16.9445 2.2981L6.23744 13.0052C6.13981 13.1028 5.98151 13.1028 5.88388 13.0052L0.176777 7.2981C0.0791456 7.20047 0.0791456 7.04218 0.176777 6.94454L1.94454 5.17678C2.04217 5.07915 2.20047 5.07915 2.2981 5.17678L5.88388 8.76256C5.98151 8.86019 6.13981 8.86019 6.23744 8.76256L14.8232 0.176777Z'/%3E%3C/svg%3E%0A");
}
......@@ -111,45 +74,81 @@ input[type="radio"]:checked {
background-size: 17px 17px;
}
[dir="ltr"] .form-type--boolean {
[dir="ltr"] .form-type-boolean {
margin-left: 36px
}
[dir="rtl"] .form-type--boolean {
[dir="rtl"] .form-type-boolean {
margin-right: 36px
}
.form-type--boolean {
.form-type-boolean {
clear: both
}
[dir="ltr"] .form-type--boolean.form-no-label {
[dir="ltr"] .form-type-boolean input[type="checkbox"],[dir="ltr"]
.form-type-boolean input[type="radio"] {
float: left
}
[dir="rtl"] .form-type-boolean input[type="checkbox"],[dir="rtl"]
.form-type-boolean input[type="radio"] {
float: right
}
[dir="ltr"] .form-type-boolean input[type="checkbox"],[dir="ltr"]
.form-type-boolean input[type="radio"] {
margin-left: -36px
}
[dir="rtl"] .form-type-boolean input[type="checkbox"],[dir="rtl"]
.form-type-boolean input[type="radio"] {
margin-right: -36px
}
.form-type-boolean input[type="checkbox"],
.form-type-boolean input[type="radio"] {
position: relative;
top: 9px;
transform: translateY(-50%);
}
[dir="ltr"] .form-type-boolean.form-no-label {
margin-left: 0
}
[dir="rtl"] .form-type--boolean.form-no-label {
[dir="rtl"] .form-type-boolean.form-no-label {
margin-right: 0
}
[dir="ltr"] .form-type--boolean .form-item__description,[dir="ltr"]
.form-type--boolean .form-item--error-message {
.form-type-boolean.form-no-label input[type="checkbox"],
.form-type-boolean.form-no-label input[type="radio"] {
position: static;
float: none;
margin-left: 0;
margin-right: 0;
transform: none;
}
[dir="ltr"] .form-type-boolean .form-item__description,[dir="ltr"]
.form-type-boolean .form-item--error-message {
margin-left: -36px
}
[dir="rtl"] .form-type--boolean .form-item__description,[dir="rtl"]
.form-type--boolean .form-item--error-message {
[dir="rtl"] .form-type-boolean .form-item__description,[dir="rtl"]
.form-type-boolean .form-item--error-message {
margin-right: -36px
}
.form-boolean-group .form-type--boolean {
.form-boolean-group .form-type-boolean {
margin-top: 18px;
margin-bottom: 18px;
}
[dir="ltr"] .container-inline .form-boolean-group .form-type--boolean:not(:last-child) {
[dir="ltr"] .container-inline .form-boolean-group .form-type-boolean:not(:last-child) {
margin-right: 18px
}
[dir="rtl"] .container-inline .form-boolean-group .form-type--boolean:not(:last-child) {
[dir="rtl"] .container-inline .form-boolean-group .form-type-boolean:not(:last-child) {
margin-left: 18px
}
core/themes/olivero/css/components/form-boolean.pcss.css
+ 20
− 25
View file @ 7835007c
......@@ -50,28 +50,6 @@ input[type="radio"] {
}
}
.form-type--boolean {
& input[type="checkbox"],
& input[type="radio"] {
position: relative;
/* stylelint-disable-next-line csstools/use-logical */
top: var(--sp0-5);
float: inline-start;
margin-inline-start: calc(var(--sp2) * -1);
transform: translateY(-50%);
}
&.form-no-label {
& input[type="checkbox"],
& input[type="radio"] {
position: static;
float: none;
margin-inline: 0;
transform: none;
}
}
}
input[type="checkbox"] {
&:checked {
background-image: url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%232494DB' d='M14.8232 0.176777C14.9209 0.0791457 15.0791 0.0791455 15.1768 0.176777L16.9445 1.94454C17.0422 2.04217 17.0422 2.20047 16.9445 2.2981L6.23744 13.0052C6.13981 13.1028 5.98151 13.1028 5.88388 13.0052L0.176777 7.2981C0.0791456 7.20047 0.0791456 7.04218 0.176777 6.94454L1.94454 5.17678C2.04217 5.07915 2.20047 5.07915 2.2981 5.17678L5.88388 8.76256C5.98151 8.86019 6.13981 8.86019 6.23744 8.76256L14.8232 0.176777Z'/%3E%3C/svg%3E%0A");
......@@ -87,12 +65,29 @@ input[type="radio"] {
}
}
.form-type--boolean {
.form-type-boolean {
clear: both;
margin-inline-start: var(--sp2);
& input[type="checkbox"],
& input[type="radio"] {
position: relative;
top: var(--sp0-5);
float: inline-start;
margin-inline-start: calc(var(--sp2) * -1);
transform: translateY(-50%);
}
&.form-no-label {
margin-inline-start: 0;
& input[type="checkbox"],
& input[type="radio"] {
position: static;
float: none;
margin-inline: 0;
transform: none;
}
}
& .form-item__description,
......@@ -101,10 +96,10 @@ input[type="radio"] {
}
}
.form-boolean-group .form-type--boolean {
.form-boolean-group .form-type-boolean {
margin-block: var(--sp1);
}
.container-inline .form-boolean-group .form-type--boolean:not(:last-child) {
.container-inline .form-boolean-group .form-type-boolean:not(:last-child) {
margin-inline-end: var(--sp);
}
core/themes/olivero/css/components/off-canvas.css
+ 7
− 7
View file @ 7835007c
......@@ -10,20 +10,20 @@
* Settings tray specific styles.
*/
[dir="ltr"] #drupal-off-canvas .form-type--boolean {
[dir="ltr"] #drupal-off-canvas .form-type-boolean {
margin-left: 0
}
[dir="rtl"] #drupal-off-canvas .form-type--boolean {
[dir="rtl"] #drupal-off-canvas .form-type-boolean {
margin-right: 0
}
#drupal-off-canvas .form-type--boolean {
#drupal-off-canvas .form-type-boolean {
line-height: 18px
}
#drupal-off-canvas .form-type--boolean input[type="checkbox"],
#drupal-off-canvas .form-type--boolean input[type="radio"] {
#drupal-off-canvas .form-type-boolean input[type="checkbox"],
#drupal-off-canvas .form-type-boolean input[type="radio"] {
float: none;
width: 13.5px;
height: 13.5px;
......@@ -31,11 +31,11 @@
vertical-align: middle;
}
[dir="ltr"] #drupal-off-canvas .form-type--boolean .form-item__description {
[dir="ltr"] #drupal-off-canvas .form-type-boolean .form-item__description {
margin-left: 0
}
[dir="rtl"] #drupal-off-canvas .form-type--boolean .form-item__description {
[dir="rtl"] #drupal-off-canvas .form-type-boolean .form-item__description {
margin-right: 0
}
......
core/themes/olivero/css/components/off-canvas.pcss.css
+ 1
− 1
View file @ 7835007c
......@@ -6,7 +6,7 @@
@import "../base/variables.pcss.css";
#drupal-off-canvas {
& .form-type--boolean {
& .form-type-boolean {
margin-inline-start: 0;
line-height: var(--line-height-s);
......
core/themes/olivero/olivero.theme
+ 1
− 1
View file @ 7835007c
......@@ -230,7 +230,7 @@ function olivero_preprocess_menu_local_tasks(&$variables) {
*/
function olivero_preprocess_form_element(&$variables) {
if (in_array($variables['element']['#type'] ?? FALSE, ['checkbox', 'radio'], TRUE)) {
$variables['attributes']['class'][] = 'form-type--boolean';
$variables['attributes']['class'][] = 'form-type-boolean';
}
if (!empty($variables['description']['attributes'])) {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment