From fc360e06deb0ad6efa6620cf6ff52e8ee91f49ed Mon Sep 17 00:00:00 2001 From: webchick <drupal@webchick.net> Date: Fri, 13 Jun 2014 11:57:27 -0700 Subject: [PATCH] Issue #1912610 by amitgoyal, BryanCGreen24, lokapujya, Rajendar Reddy, echoz, barraponto, LewisNyman, pixelwhip: Rename layout classes to follow the layout style naming convention. --- .../src/Tests/BlockContentListTest.php | 6 +-- .../config/src/Tests/ConfigEntityListTest.php | 6 +-- .../system/templates/install-page.html.twig | 12 +++--- .../templates/maintenance-page.html.twig | 12 +++--- core/modules/system/templates/page.html.twig | 12 +++--- core/themes/bartik/bartik.theme | 12 +++--- core/themes/bartik/css/layout.css | 14 +++---- core/themes/bartik/css/style.css | 6 +-- core/themes/seven/maintenance-page.css | 12 +++--- core/themes/seven/seven.theme | 6 +-- .../seven/templates/install-page.html.twig | 12 +++--- .../templates/maintenance-page.html.twig | 8 ++-- core/themes/stark/css/layout.css | 38 +++++++++---------- 13 files changed, 78 insertions(+), 78 deletions(-) diff --git a/core/modules/block_content/src/Tests/BlockContentListTest.php b/core/modules/block_content/src/Tests/BlockContentListTest.php index 048fdfb62577..157591a60eac 100644 --- a/core/modules/block_content/src/Tests/BlockContentListTest.php +++ b/core/modules/block_content/src/Tests/BlockContentListTest.php @@ -42,11 +42,11 @@ public function testListing() { $this->assertTitle(t('Custom block library') . ' | Drupal'); // Test for the table. - $element = $this->xpath('//div[@class="l-content"]//table'); + $element = $this->xpath('//div[@class="layout-content"]//table'); $this->assertTrue($element, 'Configuration entity list table found.'); // Test the table header. - $elements = $this->xpath('//div[@class="l-content"]//table/thead/tr/th'); + $elements = $this->xpath('//div[@class="layout-content"]//table/thead/tr/th'); $this->assertEqual(count($elements), 2, 'Correct number of table header cells found.'); // Test the contents of each th cell. @@ -72,7 +72,7 @@ public function testListing() { $this->assertFieldByXpath('//td', $label, 'Label found for added block.'); // Check the number of table row cells. - $elements = $this->xpath('//div[@class="l-content"]//table/tbody/tr[@class="odd"]/td'); + $elements = $this->xpath('//div[@class="layout-content"]//table/tbody/tr[@class="odd"]/td'); $this->assertEqual(count($elements), 2, 'Correct number of table row cells found.'); // Check the contents of each row cell. The first cell contains the label, // the second contains the machine name, and the third contains the diff --git a/core/modules/config/src/Tests/ConfigEntityListTest.php b/core/modules/config/src/Tests/ConfigEntityListTest.php index 71b7a4d27410..e55f84ddee25 100644 --- a/core/modules/config/src/Tests/ConfigEntityListTest.php +++ b/core/modules/config/src/Tests/ConfigEntityListTest.php @@ -153,11 +153,11 @@ function testListUI() { $this->assertTitle('Test configuration | Drupal'); // Test for the table. - $element = $this->xpath('//div[@class="l-content"]//table'); + $element = $this->xpath('//div[@class="layout-content"]//table'); $this->assertTrue($element, 'Configuration entity list table found.'); // Test the table header. - $elements = $this->xpath('//div[@class="l-content"]//table/thead/tr/th'); + $elements = $this->xpath('//div[@class="layout-content"]//table/thead/tr/th'); $this->assertEqual(count($elements), 3, 'Correct number of table header cells found.'); // Test the contents of each th cell. @@ -167,7 +167,7 @@ function testListUI() { } // Check the number of table row cells. - $elements = $this->xpath('//div[@class="l-content"]//table/tbody/tr[@class="odd"]/td'); + $elements = $this->xpath('//div[@class="layout-content"]//table/tbody/tr[@class="odd"]/td'); $this->assertEqual(count($elements), 3, 'Correct number of table row cells found.'); // Check the contents of each row cell. The first cell contains the label, diff --git a/core/modules/system/templates/install-page.html.twig b/core/modules/system/templates/install-page.html.twig index ad1c04cdda14..24d17faa8656 100644 --- a/core/modules/system/templates/install-page.html.twig +++ b/core/modules/system/templates/install-page.html.twig @@ -11,7 +11,7 @@ * @ingroup themeable */ #} - <div class="l-container"> + <div class="layout-container"> <header role="banner"> {% if site_name or site_slogan %} @@ -35,15 +35,15 @@ </main> {% if page.sidebar_first %} - <aside class="l-sidebar-first" role="complementary"> + <aside class="layout-sidebar-first" role="complementary"> {{ page.sidebar_first }} - </aside>{# /.l-sidebar-first #} + </aside>{# /.layout-sidebar-first #} {% endif %} {% if page.sidebar_second %} - <aside class="l-sidebar-second" role="complementary"> + <aside class="layout-sidebar-second" role="complementary"> {{ page.sidebar_second }} - </aside>{# /.l-sidebar-second #} + </aside>{# /.layout-sidebar-second #} {% endif %} {% if page.footer %} @@ -52,4 +52,4 @@ </footer> {% endif %} - </div>{# /.l-container #} + </div>{# /.layout-container #} diff --git a/core/modules/system/templates/maintenance-page.html.twig b/core/modules/system/templates/maintenance-page.html.twig index 3b5a59ed3372..fd780d457e8d 100644 --- a/core/modules/system/templates/maintenance-page.html.twig +++ b/core/modules/system/templates/maintenance-page.html.twig @@ -11,7 +11,7 @@ * @ingroup themeable */ #} -<div class="l-container"> +<div class="layout-container"> <header role="banner"> {% if logo %} @@ -47,15 +47,15 @@ </main> {% if page.sidebar_first %} - <aside class="l-sidebar-first" role="complementary"> + <aside class="layout-sidebar-first" role="complementary"> {{ page.sidebar_first }} - </aside>{# /.l-sidebar-first #} + </aside>{# /.layout-sidebar-first #} {% endif %} {% if page.sidebar_second %} - <aside class="l-sidebar-second" role="complementary"> + <aside class="layout-sidebar-second" role="complementary"> {{ page.sidebar_second }} - </aside>{# /.l-sidebar-second #} + </aside>{# /.layout-sidebar-second #} {% endif %} {% if page.footer %} @@ -64,4 +64,4 @@ </footer> {% endif %} -</div>{# /.l-container #} +</div>{# /.layout-container #} diff --git a/core/modules/system/templates/page.html.twig b/core/modules/system/templates/page.html.twig index d3739e5694a8..d24e33c9b7cd 100644 --- a/core/modules/system/templates/page.html.twig +++ b/core/modules/system/templates/page.html.twig @@ -63,7 +63,7 @@ * @ingroup themeable */ #} -<div class="l-container"> +<div class="layout-container"> <header role="banner"> {% if logo %} @@ -111,7 +111,7 @@ <main role="main"> <a id="main-content"></a>{# link is in html.html.twig #} - <div class="l-content"> + <div class="layout-content"> {{ page.highlighted }} {{ title_prefix }} @@ -129,16 +129,16 @@ {{ page.content }} {{ feed_icons }} - </div>{# /.l-content #} + </div>{# /.layout-content #} {% if page.sidebar_first %} - <aside class="l-sidebar-first" role="complementary"> + <aside class="layout-sidebar-first" role="complementary"> {{ page.sidebar_first }} </aside> {% endif %} {% if page.sidebar_second %} - <aside class="l-sidebar-second" role="complementary"> + <aside class="layout-sidebar-second" role="complementary"> {{ page.sidebar_second }} </aside> {% endif %} @@ -151,4 +151,4 @@ </footer> {% endif %} -</div>{# /.l-container #} +</div>{# /.layout-container #} diff --git a/core/themes/bartik/bartik.theme b/core/themes/bartik/bartik.theme index 5ccf24cfbb12..db70a55b715d 100644 --- a/core/themes/bartik/bartik.theme +++ b/core/themes/bartik/bartik.theme @@ -22,18 +22,18 @@ function bartik_preprocess_page(&$variables) { $attributes = $page_object->getBodyAttributes(); $classes = $attributes['class']; if (!empty($variables['page']['sidebar_first']) && !empty($variables['page']['sidebar_second'])) { - $classes[] = 'two-sidebars'; + $classes[] = 'layout-two-sidebars'; } elseif (!empty($variables['page']['sidebar_first'])) { - $classes[] = 'one-sidebar'; - $classes[] = 'sidebar-first'; + $classes[] = 'layout-one-sidebar'; + $classes[] = 'layout-sidebar-first'; } elseif (!empty($variables['page']['sidebar_second'])) { - $classes[] = 'one-sidebar'; - $classes[] = 'sidebar-second'; + $classes[] = 'layout-one-sidebar'; + $classes[] = 'layout-sidebar-second'; } else { - $classes[] = 'no-sidebars'; + $classes[] = 'layout-no-sidebars'; } if (!empty($variables['page']['featured'])) { diff --git a/core/themes/bartik/css/layout.css b/core/themes/bartik/css/layout.css index 74f015bb46a1..1fadfc24ad2b 100644 --- a/core/themes/bartik/css/layout.css +++ b/core/themes/bartik/css/layout.css @@ -188,30 +188,30 @@ body, [dir="rtl"] .region-footer-fourthcolumn { float: right; } - .two-sidebars #content { + .layout-two-sidebars #content { margin-left: 25%; margin-right: 25%; width: 50%; } - .one-sidebar #content { + .layout-one-sidebar #content { width: 75%; } - .no-sidebars #content { + .layout-no-sidebars #content { width: 100%; } - .sidebar-first #content { + .layout-sidebar-first #content { margin-left: 25%; /* LTR */ margin-right: 0; /* LTR */ } - [dir="rtl"] .sidebar-first #content { + [dir="rtl"] .layout-sidebar-first #content { margin-left: 0; margin-right: 25%; } - .sidebar-second #content { + .layout-sidebar-second #content { margin-right: 25%; /* LTR */ margin-left: 0; /* LTR */ } - [dir="rtl"] .sidebar-second #content { + [dir="rtl"] .layout-sidebar-second #content { margin-right: 0; margin-left: 25%; } diff --git a/core/themes/bartik/css/style.css b/core/themes/bartik/css/style.css index 66406aab990f..119ef7856009 100644 --- a/core/themes/bartik/css/style.css +++ b/core/themes/bartik/css/style.css @@ -1564,13 +1564,13 @@ ul.vertical-tabs-list { .comment-form input.form-file { width: auto; } -.no-sidebars .comment-form .form-text { +.layout-no-sidebars .comment-form .form-text { width: 800px; } -.one-sidebar .comment-form .form-text { +.layout-one-sidebar .comment-form .form-text { width: 500px; } -.two-sidebars .comment-form .form-text { +.layout-two-sidebars .comment-form .form-text { width: 320px; } .comment-form .form-item .description { diff --git a/core/themes/seven/maintenance-page.css b/core/themes/seven/maintenance-page.css index bc56fa065b57..fb1e3a0dd9a8 100644 --- a/core/themes/seven/maintenance-page.css +++ b/core/themes/seven/maintenance-page.css @@ -102,19 +102,19 @@ /** * Layout */ -.l-container { +.layout-container { background: #fff; width: auto; margin-left: 1.25em; margin-right: 1.25em; } -.l-container:after { /* no reason for a clearfix in the markup */ +.layout-container:after { /* no reason for a clearfix in the markup */ content: ""; display: table; clear: both; } @media all and (max-width: 48em) { /* 768px */ - .l-container { + .layout-container { margin: 1.25em; padding: 10px 20px; } @@ -138,7 +138,7 @@ width: 100%; height: 100%; } - .l-container { + .layout-container { margin: 0 auto; max-width: 770px; width: 75%; @@ -165,11 +165,11 @@ padding: 15px; margin: 0.25em 0; } - .l-sidebar-first { + .layout-sidebar-first { float: left; width: 35%; } - [dir="rtl"] .l-sidebar-first { + [dir="rtl"] .layout-sidebar-first { float: right; } diff --git a/core/themes/seven/seven.theme b/core/themes/seven/seven.theme index 292360599ac0..b04d2d5a0b8b 100644 --- a/core/themes/seven/seven.theme +++ b/core/themes/seven/seven.theme @@ -20,11 +20,11 @@ function seven_preprocess_page(&$variables) { // Add information about the number of sidebars. if (!empty($variables['page']['sidebar_first'])) { - $classes[] = 'one-sidebar'; - $classes[] = 'sidebar-first'; + $classes[] = 'layout-one-sidebar'; + $classes[] = 'layout-sidebar-first'; } else { - $classes[] = 'no-sidebars'; + $classes[] = 'layout-no-sidebars'; } $attributes['class'] = $classes; diff --git a/core/themes/seven/templates/install-page.html.twig b/core/themes/seven/templates/install-page.html.twig index f86486edd057..98b3f8a4952a 100644 --- a/core/themes/seven/templates/install-page.html.twig +++ b/core/themes/seven/templates/install-page.html.twig @@ -9,7 +9,7 @@ * @see template_preprocess_install_page() */ #} -<div class="l-container"> +<div class="layout-container"> <header role="banner"> {% if site_name or site_slogan %} @@ -25,9 +25,9 @@ </header> {% if page.sidebar_first %} - <aside class="l-sidebar-first" role="complementary"> + <aside class="layout-sidebar-first" role="complementary"> {{ page.sidebar_first }} - </aside>{# /.l-sidebar-first #} + </aside>{# /.layout-sidebar-first #} {% endif %} <main role="main"> @@ -39,9 +39,9 @@ </main> {% if page.sidebar_second %} - <aside class="l-sidebar-second" role="complementary"> + <aside class="layout-sidebar-second" role="complementary"> {{ page.sidebar_second }} - </aside>{# /.l-sidebar-second #} + </aside>{# /.layout-sidebar-second #} {% endif %} {% if page.page_bottom %} @@ -50,4 +50,4 @@ </footer> {% endif %} -</div>{# /.l-container #} +</div>{# /.layout-container #} diff --git a/core/themes/seven/templates/maintenance-page.html.twig b/core/themes/seven/templates/maintenance-page.html.twig index 9097297476a2..01bc89bb6234 100644 --- a/core/themes/seven/templates/maintenance-page.html.twig +++ b/core/themes/seven/templates/maintenance-page.html.twig @@ -9,7 +9,7 @@ * @see template_preprocess_maintenance_page() */ #} -<div class="l-container"> +<div class="layout-container"> <header role="banner"> {% if site_name or site_slogan %} @@ -25,9 +25,9 @@ </header> {% if page.sidebar_first %} - <aside class="l-sidebar-first" role="complementary"> + <aside class="layout-sidebar-first" role="complementary"> {{ page.sidebar_first }} - </aside>{# /.l-sidebar-first #} + </aside>{# /.layout-sidebar-first #} {% endif %} <main role="main"> @@ -44,4 +44,4 @@ </footer> {% endif %} -</div>{# /.l-container #} +</div>{# /.layout-container #} diff --git a/core/themes/stark/css/layout.css b/core/themes/stark/css/layout.css index b91e9531cb59..123de171188f 100644 --- a/core/themes/stark/css/layout.css +++ b/core/themes/stark/css/layout.css @@ -9,7 +9,7 @@ * This layout method works reasonably well, but shouldn't be used on a * production site because it can break. For example, if an over-large image * (one that is wider than 20% of the viewport) is in the left sidebar, the - * image will overlap with the .l-content to the right. + * image will overlap with the .layout-content to the right. */ img { height: auto; @@ -21,80 +21,80 @@ main:after { clear: both; } -.l-content, -.l-sidebar-first, -.l-sidebar-second { +.layout-content, +.layout-sidebar-first, +.layout-sidebar-second { display: inline; position: relative; } @media all and (min-width: 480px) and (max-width: 959px) { - .l-content { + .layout-content { width: 67%; float: right; /* LTR */ } - [dir="rtl"] .l-content { + [dir="rtl"] .layout-content { float: left; } - .l-sidebar-first { + .layout-sidebar-first { width: 33%; float: left; /* LTR */ } - [dir="rtl"] .l-sidebar-first { + [dir="rtl"] .layout-sidebar-first { float: right; } - .l-sidebar-second { + .layout-sidebar-second { float: right; /* LTR */ clear: both; width: 100%; } - [dir="rtl"] .l-sidebar-second { + [dir="rtl"] .layout-sidebar-second { float: right; clear: right; } - .l-sidebar-second .block { + .layout-sidebar-second .block { float: left; /* LTR */ width: 33%; } - [dir="rtl"] .l-sidebar-second .block { + [dir="rtl"] .layout-sidebar-second .block { float: right; } - .l-sidebar-second .block:nth-child(3n+1) { + .layout-sidebar-second .block:nth-child(3n+1) { clear: both; } } @media all and (min-width: 960px) { - .l-content { + .layout-content { width: 60%; float: left; /* LTR */ left: 20%; /* LTR */ } - [dir="rtl"] .l-content { + [dir="rtl"] .layout-content { float: right; left: 0; right: 20%; } - .l-sidebar-first { + .layout-sidebar-first { width: 20%; float: left; /* LTR */ left: -60%; /* LTR */ } - [dir="rtl"] .l-sidebar-first { + [dir="rtl"] .layout-sidebar-first { float: right; left: 0; right: -60%; } - .l-sidebar-second { + .layout-sidebar-second { float: right; /* LTR */ width: 20%; } - [dir="rtl"] .l-sidebar-second { + [dir="rtl"] .layout-sidebar-second { float: left; } } -- GitLab