Merge branch 'task/GH-191-support-light-navbar-for-dark-logos' into t…

…ask/GH-101-header-redesign
TACC · Aug 23, 2021 · c31b7e6 · c31b7e6
2 parents e165cc2 + ec8d78a
commit c31b7e6
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 19 deletions.
diff --git a/taccsite_cms/static/site_cms/css/src/_imports/objects/o-section.css b/taccsite_cms/static/site_cms/css/src/_imports/objects/o-section.css
@@ -91,6 +91,8 @@ Styleguide Objects.Section
 }
 
 /* Modifers: Style: Dark & Light */
+/* HELP: How can we change style of `o-section` content without overlap? */
+/* SEE: https://confluence.tacc.utexas.edu/x/DyUFDg */
 
 .o-section--style-dark,
 .o-section--style-dark::before {
@@ -117,7 +119,7 @@ Styleguide Objects.Section
 /* FAQ: Banners should not touch a border of the following section */
 .o-section--style-light:not(.o-section--banner)
 + .o-section--style-light:not(.o-section--banner) {
- border-top: var(--hr-height) solid var(--global-color-primary--xx-light);
+ border-top: var(--hr-height) solid var(--global-color-primary--normal);
 }
 
 /* Modifers: Style: (Fake) Endless Background */

diff --git a/taccsite_cms/static/site_cms/css/src/_imports/settings/color.css b/taccsite_cms/static/site_cms/css/src/_imports/settings/color.css
@@ -21,7 +21,7 @@
 
  --global-color-primary--xx-light: #FFFFFF;
  --global-color-primary--x-light: #F4F4F4;
- --global-color-primary--x-light-rgb: 244, 244, 244;
+  --global-color-primary--x-light-rgb: 244, 244, 244;
  --global-color-primary--light: #C6C6C6;
  --global-color-primary--normal: #AFAFAF;
  --global-color-primary--dark: #707070;

diff --git a/taccsite_cms/static/site_cms/css/src/_imports/settings/font.css b/taccsite_cms/static/site_cms/css/src/_imports/settings/font.css
@@ -47,7 +47,7 @@ Styleguide Settings.CustomProperties.Font
  --global-font-size--small: 1.4rem;
  --global-font-size--medium: 1.6rem;
  --global-font-size--large: 2.0rem;
- --global-font-size--x-large: 2.4rem;
+ --global-font-size--x-large: 2.6rem;
  --global-font-size--xx-large: 3.2rem;
  --global-font-size--xxx-large: 4.1rem;
 

diff --git a/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-style-guide.css b/taccsite_cms/static/site_cms/css/src/_imports/trumps/s-style-guide.css
@@ -9,11 +9,6 @@ A style guide. This is intended for:
 Styleguide Trumps.Scopes.StyleGuide
 */
 
-.s-style-guide {
- margin-top: var(--global-space--large);
- margin-bottom: var(--global-space--x-large);
-}
-
 
 
 
@@ -24,16 +19,34 @@ Styleguide Trumps.Scopes.StyleGuide
 
 /* ELEMENTS: Content Sectioning */
 
-.s-style-guide section {
- clear: both;
-}
-.s-style-guide section:not(section section) {
- border-top: var(--global-border--x-thick);
- padding-top: var(--global-space--x-large);
+/* NOTE: Similar to `s-document` "ELEMENTS: Content Sectioning" */
+
+/* To give little margin above isolated headings for sections */
+/* FAQ: Headings with no prior sibling need spacing before the heading */
+/* FAQ: Headings that begin `o-section` already have spacing from `o-section` */
+.s-style-guide section:not(.o-section) > h1:first-child,
+.s-style-guide section:not(.o-section) > h2:first-child,
+.s-style-guide section:not(.o-section) > h3:first-child,
+.s-style-guide section:not(.o-section) > h4:first-child,
+.s-style-guide section:not(.o-section) > h5:first-child,
+.s-style-guide section:not(.o-section) > h6:first-child,
+/* FAQ: Headings after non-headings need spacing before the heading */
+/* FAQ: Headings after headings already have spacing from prior heading */
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h1,
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h2,
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h3,
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h4,
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h5,
+.s-style-guide section > :not(h1, h2, h3, h4, h5, h6) + h6 {
  margin-top: var(--global-space--x-large);
 }
-.s-style-guide section section {
- border-top: var(--global-border--normal);
- padding-top: var(--global-space--normal);
- margin-top: var(--global-space--normal);
+
+/* To give much margin below all headings for sections */
+.s-style-guide section > h1,
+.s-style-guide section > h2,
+.s-style-guide section > h3,
+.s-style-guide section > h4,
+.s-style-guide section > h5,
+.s-style-guide section > h6 {
+ margin-bottom: var(--global-space--normal);
 }
diff --git a/taccsite_cms/templates/style_guide.html b/taccsite_cms/templates/style_guide.html
@@ -1,4 +1,4 @@
-{% extends "fullwidth.html" %}
+{% extends "standard.html" %}
 {% load cms_tags staticfiles %}
 
 {% block assets_custom %}
@@ -13,6 +13,7 @@
 {% block content %}
 <div class="container s-document s-style-guide">
  {% block guide %}
+ {% include "nav_cms_breadcrumbs.html" %}
  {% placeholder "content" %}
  {% endblock guide %}
 </div>