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

Issue #2485397 by Manjit.Singh, MathieuSpil, gajendra sharma, saki007ster, LewisNyman: Clean up config translation CSS inline with our CSS standards

8.0.x
Alex Pott 2015-06-09 12:15:50 +01:00
parent 5680ad0d70
commit 921db1f5fc
2 changed files with 9 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
core/modules/config_translation/css/config_translation.admin.css
View File

@ -7,38 +7,18 @@
* Hide the label, in an accessible way, for responsive screens which show the
* form in one column.
*/
.config-translation-form .translation-element-wrapper .translation label {
position: absolute !important;
.translation-set__translated label {
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
height: 1px;
overflow: hidden;
position: absolute;
width: 1px;
}
/**
* For wider screens, show the label and display source and translation side by
* side.
*/
@media all and (min-width: 851px) {
.config-translation-form .translation-element-wrapper .source {
width: 48%;
float: left; /* LTR */
}
[dir="rtl"] .config-translation-form .translation-element-wrapper .source {
float: right;
}
.config-translation-form .translation-element-wrapper .translation {
width: 48%;
float: right; /* LTR */
}
[dir="rtl"] .config-translation-form .translation-element-wrapper .translation {
float: left;
}
.config-translation-form .translation-element-wrapper .translation label {
position: static !important;
clip: auto;
overflow: visible;
@media screen and (min-width: 38em) {
.translation-set__translated label {
height: auto;
position: inherit;
width: auto;
}
}

6
core/modules/config_translation/templates/config_translation_manage_form_element.html.twig
View File

@ -14,11 +14,11 @@
* @ingroup themeable
*/
#}
<div class="clearfix translation-element-wrapper">
<div class="source">
<div class="translation-set clearfix">
<div class="layout-column half translation-set__source">
{{ element.source }}
</div>
<div class="translation">
<div class="layout-column half translation-set__translated">
{{ element.translation }}
</div>
</div>