Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #3083570 by huzooka, shashikant_chauhan, rensingh99, ckrina, katannshaw, shimpy, andrewmacpherson, mfairchild365: Do not hide the label for the text format select input

merge-requests/2419/head
Alex Pott 2019-10-24 00:04:34 +01:00
parent 323aeb6160
commit b12a3a59e1
No known key found for this signature in database
GPG Key ID: 31905460D4A69276
3 changed files with 86 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
core/themes/claro/css/src/components/form.css
View File

@ -253,6 +253,57 @@ tr .form-item,
clear: both;
}
/**
* Custom label placement for editor filter format select.
*/
.form-item--editor-format {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
max-width: 100%;
}
.form-item--editor-format .form-item__label,
.form-item--editor-format .form-item__prefix,
.form-item--editor-format .form-item__suffix,
.form-item--editor-format .form-element--editor-format {
min-width: 1px;
}
.form-item--editor-format .form-item__label,
.form-item--editor-format .form-item__prefix,
.form-item--editor-format .form-item__suffix {
margin-right: 0.5rem; /* LTR */
}
[dir="rtl"] .form-item--editor-format .form-item__label,
[dir="rtl"] .form-item--editor-format .form-item__prefix,
[dir="rtl"] .form-item--editor-format .form-item__suffix {
margin-right: 0;
margin-left: 0.5rem;
}
.form-item--editor-format .form-item__description,
.form-item--editor-format .form-item__error-message {
-webkit-box-flex: 0;
-webkit-flex: 0 1 100%;
-moz-box-flex: 0;
-ms-flex: 0 1 100%;
flex: 0 1 100%;
min-width: 1px;
}
/**
* Improve form element usability on narrow devices.
*

35
core/themes/claro/css/src/components/form.pcss.css
View File

@ -150,6 +150,41 @@ tr .form-item,
clear: both;
}
/**
* Custom label placement for editor filter format select.
*/
.form-item--editor-format {
display: flex;
flex-wrap: wrap;
align-items: center;
max-width: 100%;
}
.form-item--editor-format .form-item__label,
.form-item--editor-format .form-item__prefix,
.form-item--editor-format .form-item__suffix,
.form-item--editor-format .form-element--editor-format {
min-width: 1px;
}
.form-item--editor-format .form-item__label,
.form-item--editor-format .form-item__prefix,
.form-item--editor-format .form-item__suffix {
margin-right: var(--space-xs); /* LTR */
}
[dir="rtl"] .form-item--editor-format .form-item__label,
[dir="rtl"] .form-item--editor-format .form-item__prefix,
[dir="rtl"] .form-item--editor-format .form-item__suffix {
margin-right: 0;
margin-left: var(--space-xs);
}
.form-item--editor-format .form-item__description,
.form-item--editor-format .form-item__error-message {
flex: 0 1 100%;
min-width: 1px;
}
/**
* Improve form element usability on narrow devices.
*

1
core/themes/claro/src/ClaroPreRender.php
View File

@ -160,7 +160,6 @@ class ClaroPreRender implements TrustedCallbackInterface {
// Add clearfix for filter wrapper.
$element['format']['#attributes']['class'][] = 'clearfix';
// Hide format select label visually.
$element['format']['format']['#title_display'] = 'invisible';
$element['format']['format']['#wrapper_attributes']['class'][] = 'form-item--editor-format';
$element['format']['format']['#attributes']['class'][] = 'form-element--extrasmall';
$element['format']['format']['#attributes']['class'][] = 'form-element--editor-format';