Update CSS

viamrobotics · Jan 3, 2025 · 833cbc2 · 833cbc2
1 parent 2a33b3a
commit 833cbc2
Show file tree

Hide file tree

Showing 4 changed files with 60 additions and 18 deletions.
diff --git a/assets/scss/_sidebar-tree.scss b/assets/scss/_sidebar-tree.scss
@@ -6,6 +6,7 @@
     margin-right: -15px;
     margin-left: -15px;
     font-size: 1rem;
+    font-weight: 300;
 
     @include media-breakpoint-up(md) {
         @supports (position: sticky) {
@@ -63,7 +64,7 @@
     a, .emptynode {
         display: inline-block;
         padding-bottom: 0.375rem;
-        color: black;
+        color: #333333;
         text-decoration: none;
 
         &:hover {
@@ -96,6 +97,7 @@
 
     li i { // Layout of icons
         padding-right: 0.5em;
+        -webkit-text-stroke: 1px whitesmoke;
         &:before{
             display: inline-block;
             text-align: center;
@@ -170,4 +172,15 @@
 li .indent {
     font-size: 0.833rem;
     padding-left: 0.75rem;
+}
+
+@media (min-width: 768px) {
+    .header-only > span > span.emptynode:hover {
+    color: #aaa;
+    }
+
+    .ul-2 > li:not(:last-child) {
+        padding-bottom: 8px;
+        border-bottom: 1px solid #ccc;
+    }
 }
diff --git a/assets/scss/_styles_project.scss b/assets/scss/_styles_project.scss
@@ -60,16 +60,17 @@ a.footnote-ref::after {
 }
 
 h1, .h1 {
-  font-family: Space Mono, sans-serif;
-  font-size: 2.667rem; // 32pt
+  font-family: Space grotesk, sans-serif;
+  font-size: 2.625rem; // 32pt
   margin-left: 0px;
+  font-weight: 500;
 }
 
 h2, .h2 {
-  font-family: space grotesk, sans-serif;
-  font-size: 2.0rem !important; // 24pt
-  line-height: 2.667rem;
-  font-weight: 600;
+  font-family: Public sans, sans-serif;
+  font-size: 1.25rem !important; // 20px
+  line-height: 1.25rem;
+  font-weight: 500;
   clear: both;
 }
 
@@ -162,7 +163,6 @@ h7, .h7 {
 
 .td-toc ul li a {
   font-size: 0.833rem;
-  font-weight: 500;
   color: #333333;
   text-decoration: none;
 }
@@ -274,9 +274,10 @@ footer small {
 
 /* sets the base font heavier than the theme. */
 .td-content p, .td-content li, .td-content td {
+  font-family: "Public Sans light", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   font-weight: normal;
-  font-size: 1rem !important;
-  line-height: 1.5em !important;
+  font-size: 0.938rem !important;
+  line-height: 1.625rem !important;
 }
 
 /*
@@ -351,6 +352,7 @@ END MARKETING CSS
   color: black;
   border: 1px solid black;
   margin-right: 5px;
+  padding: 1rem 1.25rem;
 
   @each $color, $value in $theme-colors {
     &-#{$color} {
@@ -364,8 +366,12 @@ END MARKETING CSS
   }
 }
 
+.alert * ul:last-child, .alert * p:last-child {
+  margin-bottom: 0;
+}
+
 .td-content .alert:not(:first-child) {
-  margin-top: 1.5rem;
+  margin-top: 37px;
   margin-bottom: 1.5rem;
   clear: both;
 }
@@ -450,7 +456,7 @@ END MARKETING CSS
 
 .expand-label {
   background-color: whitesmoke;
-  border: black solid 1px;
+  border: #d9d9d9 solid 1px;
   padding: 0.5rem 1rem 0.5rem 1rem;
   i {
     font-size: inherit !important;
@@ -462,20 +468,25 @@ END MARKETING CSS
 .expand-label span h5 {
   display: inline;
   font-family: Public Sans,system-ui;
+  font-size: 0.938rem !important;
+}
+
+.tablestep * .expand-label, .tablestep * .expand-content {
+  background-color: white !important;
 }
 
 .expand-content {
-  border-top: black solid 0px;
-  border-left: black solid 1px;
-  border-right: black solid 1px;
-  border-bottom: black solid 1px;
+  border-top: #d9d9d9 solid 0px;
+  border-left: #d9d9d9 solid 1px;
+  border-right: #d9d9d9 solid 1px;
+  border-bottom: #d9d9d9 solid 1px;
   background: whitesmoke;
   padding: 1rem;
   overflow: hidden;
 }
 
 .expand {
-  padding-bottom: 1rem;
+  padding-bottom: 0.75rem;
   clear: both;
 }
 
@@ -2151,6 +2162,23 @@ div .filterable > p {
   overflow: auto;
 }
 
+// Fix tables in steps and expanders
+
+.tablestep > table, .expand-content > table {
+  min-width: 100% !important;
+}
+
+.tablestep > table td, .tablestep > table th, .expand-content > table td, .expand-content > table th {
+  padding: 0.75rem;
+  vertical-align: top;
+  border-top: 1px solid #dee2e6;
+}
+
+.tablestep * tbody > tr:nth-of-type(odd) {
+  background-color: rgba(0, 0, 0, 0.05) !important;
+}
+
+
 .usecase-table .tablestep:nth-of-type(odd) {
   background-color: whitesmoke;
   border-top: 1px solid #d7d7d9;

diff --git a/assets/scss/_variables_project.scss b/assets/scss/_variables_project.scss
@@ -119,7 +119,7 @@ BEGIN CSS CHANGES FOR MARKETING
   @font-face {
     font-family: 'Space Grotesk';
     font-style: normal;
-    font-weight: 700;
+    font-weight: 600;
     font-display: swap;
     src: url(https://fonts.gstatic.com/s/spacegrotesk/v13/V8mDoQDjQSkFtoMM3T6r8E7mPb94C-s0.woff2) format('woff2');
     unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;

diff --git a/layouts/partials/sidebar-tree.html b/layouts/partials/sidebar-tree.html
@@ -112,6 +112,7 @@
         {{ template "section-tree-nav-section" (dict "page" $p "section" . "shouldDelayActive" $shouldDelayActive "sidebarMenuTruncate" $sidebarMenuTruncate "ulNr" $ulNr "ulShow" $ulShow) }}
         {{- end }}
       </ul>
+      <!-- <hr> -->
     {{- end }}
   {{- end }}
 </li>