From b12a3a59e1a8f5f2ebc896345a8559c1d746013a Mon Sep 17 00:00:00 2001
From: Alex Pott <alex.a.pott@googlemail.com>
Date: Thu, 24 Oct 2019 00:04:34 +0100
Subject: [PATCH] Issue #3083570 by huzooka, shashikant_chauhan, rensingh99,
 ckrina, katannshaw, shimpy, andrewmacpherson, mfairchild365: Do not hide the
 label for the text format select input

---
 core/themes/claro/css/src/components/form.css | 51 +++++++++++++++++++
 .../claro/css/src/components/form.pcss.css    | 35 +++++++++++++
 core/themes/claro/src/ClaroPreRender.php      |  1 -
 3 files changed, 86 insertions(+), 1 deletion(-)

diff --git a/core/themes/claro/css/src/components/form.css b/core/themes/claro/css/src/components/form.css
index 56cb04893df0..a1d8f5a119f2 100644
--- a/core/themes/claro/css/src/components/form.css
+++ b/core/themes/claro/css/src/components/form.css
@@ -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.
  *
diff --git a/core/themes/claro/css/src/components/form.pcss.css b/core/themes/claro/css/src/components/form.pcss.css
index 81e698abe58f..6c2837b90e7f 100644
--- a/core/themes/claro/css/src/components/form.pcss.css
+++ b/core/themes/claro/css/src/components/form.pcss.css
@@ -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.
  *
diff --git a/core/themes/claro/src/ClaroPreRender.php b/core/themes/claro/src/ClaroPreRender.php
index 72ad62880703..fc0ecad96460 100644
--- a/core/themes/claro/src/ClaroPreRender.php
+++ b/core/themes/claro/src/ClaroPreRender.php
@@ -160,7 +160,6 @@ public static function textFormat($element) {
     // 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';
-- 
GitLab