From fa756d622d757ef2e9a9df78fe9341ed2fba417c Mon Sep 17 00:00:00 2001 From: Joseph Knox Date: Mon, 8 May 2017 16:03:47 -0700 Subject: [PATCH 1/3] 4 rows mega menu --- css/soe_regions.css | 32 +++++++------- scss/components/_soe_components.scss | 2 +- scss/components/_soe_dm_megamenu.scss | 46 ++++++++++++++------- scss/variables/_soe_dm_megamenu_colors.scss | 2 +- 4 files changed, 52 insertions(+), 30 deletions(-) diff --git a/css/soe_regions.css b/css/soe_regions.css index 5f23a11..f3e340c 100644 --- a/css/soe_regions.css +++ b/css/soe_regions.css @@ -1,16 +1,20 @@ #digital-magazine-megamenu { z-index: 9999; } - -#digital-magazine-megamenu .container { - position: absolute; - z-index: 9999; - display: flex; - align-items: center; - justify-content: center; - padding: 0; - margin-left: auto; - margin-right: auto; - background-color: #9ca4ab; } - -.region-digital-magazine-megamenu { - width: 1170px; } + #digital-magazine-megamenu .container { + position: absolute; + z-index: 9999; + display: flex; + align-items: center; + justify-content: center; + padding: 0; + margin-left: auto; + margin-right: auto; + background-color: #9ca4ab; } + #digital-magazine-megamenu .container .region-digital-magazine-megamenu { + width: 1170px; + padding: 30px 0; } + #digital-magazine-megamenu .container .region-digital-magazine-megamenu .view-content { + display: flex; + flex-wrap: wrap; } + #digital-magazine-megamenu .container .region-digital-magazine-megamenu .view-content .views-row { + width: calc(100% * (1/4) - 10px - 1px); } diff --git a/scss/components/_soe_components.scss b/scss/components/_soe_components.scss index 9239dd4..d89f40a 100644 --- a/scss/components/_soe_components.scss +++ b/scss/components/_soe_components.scss @@ -5,4 +5,4 @@ /// @import - 'soe_dm_megamenu' + 'soe_dm_megamenu'; diff --git a/scss/components/_soe_dm_megamenu.scss b/scss/components/_soe_dm_megamenu.scss index cf6a29f..d60383d 100644 --- a/scss/components/_soe_dm_megamenu.scss +++ b/scss/components/_soe_dm_megamenu.scss @@ -1,17 +1,35 @@ +@charset "UTF-8"; + +//// +/// DIGITAL MAGAZINE MEGA MENU +/// + #digital-magazine-megamenu { z-index: 9999; -} -#digital-magazine-megamenu .container { - position: absolute; - z-index: 9999; - display: flex; - align-items: center; - justify-content: center; - padding: 0; - margin-left: auto; - margin-right: auto; - background-color: $mm-background; -} -.region-digital-magazine-megamenu { - width: 1170px; + + .container { + position: absolute; + z-index: 9999; + display: flex; + align-items: center; + justify-content: center; + padding: 0; + margin-left: auto; + margin-right: auto; + background-color: $mega-menu-background; + + .region-digital-magazine-megamenu { + width: 1170px; + padding: 30px 0; + + .view-content { + display: flex; + flex-wrap: wrap; + + .views-row { + width: calc(100% * (1/4) - 10px - 1px); + } + } + } + } } diff --git a/scss/variables/_soe_dm_megamenu_colors.scss b/scss/variables/_soe_dm_megamenu_colors.scss index 1114060..a5b0395 100644 --- a/scss/variables/_soe_dm_megamenu_colors.scss +++ b/scss/variables/_soe_dm_megamenu_colors.scss @@ -1,3 +1,3 @@ @charset "UTF-8"; -$mm-background: #9ca4ab; +$mega-menu-background: #9ca4ab; From 0bd235cbedb23b6cb1a4a2082fc5894083c6627c Mon Sep 17 00:00:00 2001 From: Joseph Knox Date: Fri, 12 May 2017 15:14:19 -0700 Subject: [PATCH 2/3] removed non-structural styles from Feature --- css/soe_regions.css | 8 +------- scss/components/_soe_dm_megamenu.scss | 12 +----------- scss/soe_regions.scss | 3 +-- scss/variables/_soe_dm_megamenu_colors.scss | 3 --- scss/variables/_soe_regions_variables.scss | 8 -------- 5 files changed, 3 insertions(+), 31 deletions(-) delete mode 100644 scss/variables/_soe_dm_megamenu_colors.scss delete mode 100644 scss/variables/_soe_regions_variables.scss diff --git a/css/soe_regions.css b/css/soe_regions.css index f3e340c..f4950a8 100644 --- a/css/soe_regions.css +++ b/css/soe_regions.css @@ -8,13 +8,7 @@ justify-content: center; padding: 0; margin-left: auto; - margin-right: auto; - background-color: #9ca4ab; } + margin-right: auto; } #digital-magazine-megamenu .container .region-digital-magazine-megamenu { width: 1170px; padding: 30px 0; } - #digital-magazine-megamenu .container .region-digital-magazine-megamenu .view-content { - display: flex; - flex-wrap: wrap; } - #digital-magazine-megamenu .container .region-digital-magazine-megamenu .view-content .views-row { - width: calc(100% * (1/4) - 10px - 1px); } diff --git a/scss/components/_soe_dm_megamenu.scss b/scss/components/_soe_dm_megamenu.scss index d60383d..6cdbba6 100644 --- a/scss/components/_soe_dm_megamenu.scss +++ b/scss/components/_soe_dm_megamenu.scss @@ -1,7 +1,7 @@ @charset "UTF-8"; //// -/// DIGITAL MAGAZINE MEGA MENU +/// DIGITAL MAGAZINE MEGA MENU REGION STRUCTURE /// #digital-magazine-megamenu { @@ -16,20 +16,10 @@ padding: 0; margin-left: auto; margin-right: auto; - background-color: $mega-menu-background; .region-digital-magazine-megamenu { width: 1170px; padding: 30px 0; - - .view-content { - display: flex; - flex-wrap: wrap; - - .views-row { - width: calc(100% * (1/4) - 10px - 1px); - } - } } } } diff --git a/scss/soe_regions.scss b/scss/soe_regions.scss index f24399e..abba95a 100644 --- a/scss/soe_regions.scss +++ b/scss/soe_regions.scss @@ -1,5 +1,4 @@ @charset "UTF-8"; @import - 'variables/soe_regions_variables', - 'components/soe_components' + 'components/soe_components'; diff --git a/scss/variables/_soe_dm_megamenu_colors.scss b/scss/variables/_soe_dm_megamenu_colors.scss deleted file mode 100644 index a5b0395..0000000 --- a/scss/variables/_soe_dm_megamenu_colors.scss +++ /dev/null @@ -1,3 +0,0 @@ -@charset "UTF-8"; - -$mega-menu-background: #9ca4ab; diff --git a/scss/variables/_soe_regions_variables.scss b/scss/variables/_soe_regions_variables.scss deleted file mode 100644 index 5309f4f..0000000 --- a/scss/variables/_soe_regions_variables.scss +++ /dev/null @@ -1,8 +0,0 @@ -@charset "UTF-8"; - -//// -/// ROLL UP -/// - -@import - 'soe_dm_megamenu_colors' From 6bb4605c0d636fa229e71204a09251b27180b49c Mon Sep 17 00:00:00 2001 From: Joseph Knox Date: Fri, 12 May 2017 15:26:53 -0700 Subject: [PATCH 3/3] added components for all new regions --- scss/components/_soe_components.scss | 8 -------- scss/components/_soe_content_body_bottom.scss | 5 +++++ scss/components/_soe_content_body_lower.scss | 5 +++++ scss/components/_soe_dm_megamenu.scss | 2 +- scss/components/_soe_fw_middle.scss | 5 +++++ scss/components/_soe_fw_super_hero.scss | 5 +++++ scss/components/_soe_regions_components.scss | 12 ++++++++++++ scss/soe_regions.scss | 2 +- 8 files changed, 34 insertions(+), 10 deletions(-) delete mode 100644 scss/components/_soe_components.scss create mode 100644 scss/components/_soe_content_body_bottom.scss create mode 100644 scss/components/_soe_content_body_lower.scss create mode 100644 scss/components/_soe_fw_middle.scss create mode 100644 scss/components/_soe_fw_super_hero.scss create mode 100644 scss/components/_soe_regions_components.scss diff --git a/scss/components/_soe_components.scss b/scss/components/_soe_components.scss deleted file mode 100644 index d89f40a..0000000 --- a/scss/components/_soe_components.scss +++ /dev/null @@ -1,8 +0,0 @@ -@charset "UTF-8"; - -//// -/// ROLL UP -/// - -@import - 'soe_dm_megamenu'; diff --git a/scss/components/_soe_content_body_bottom.scss b/scss/components/_soe_content_body_bottom.scss new file mode 100644 index 0000000..f393b95 --- /dev/null +++ b/scss/components/_soe_content_body_bottom.scss @@ -0,0 +1,5 @@ +@charset "UTF-8"; + +//// +/// CONTENT BODY BOTTOM REGION STRUCTURE +/// diff --git a/scss/components/_soe_content_body_lower.scss b/scss/components/_soe_content_body_lower.scss new file mode 100644 index 0000000..4e31bd0 --- /dev/null +++ b/scss/components/_soe_content_body_lower.scss @@ -0,0 +1,5 @@ +@charset "UTF-8"; + +//// +/// CONTENT BODY LOWER REGION STRUCTURE +/// diff --git a/scss/components/_soe_dm_megamenu.scss b/scss/components/_soe_dm_megamenu.scss index 6cdbba6..58872b5 100644 --- a/scss/components/_soe_dm_megamenu.scss +++ b/scss/components/_soe_dm_megamenu.scss @@ -1,7 +1,7 @@ @charset "UTF-8"; //// -/// DIGITAL MAGAZINE MEGA MENU REGION STRUCTURE +/// DIGITAL MAGAZINE MEGAMENU REGION STRUCTURE /// #digital-magazine-megamenu { diff --git a/scss/components/_soe_fw_middle.scss b/scss/components/_soe_fw_middle.scss new file mode 100644 index 0000000..206f7ba --- /dev/null +++ b/scss/components/_soe_fw_middle.scss @@ -0,0 +1,5 @@ +@charset "UTF-8"; + +//// +/// FULL WIDTH MIDDLE REGION STRUCTURE +/// diff --git a/scss/components/_soe_fw_super_hero.scss b/scss/components/_soe_fw_super_hero.scss new file mode 100644 index 0000000..9f4444b --- /dev/null +++ b/scss/components/_soe_fw_super_hero.scss @@ -0,0 +1,5 @@ +@charset "UTF-8"; + +//// +/// FULL WIDTH SUPER HERO REGION STRUCTURE +/// diff --git a/scss/components/_soe_regions_components.scss b/scss/components/_soe_regions_components.scss new file mode 100644 index 0000000..31eede3 --- /dev/null +++ b/scss/components/_soe_regions_components.scss @@ -0,0 +1,12 @@ +@charset "UTF-8"; + +//// +/// ROLL UP +/// + +@import + 'soe_fw_super_hero', + 'soe_content_body_lower', + 'soe_fw_middle', + 'soe_content_body_bottom', + 'soe_dm_megamenu'; diff --git a/scss/soe_regions.scss b/scss/soe_regions.scss index abba95a..a046b55 100644 --- a/scss/soe_regions.scss +++ b/scss/soe_regions.scss @@ -1,4 +1,4 @@ @charset "UTF-8"; @import - 'components/soe_components'; + 'components/soe_regions_components';