Improve H1 Spacing and Improve Tables

Signed-off-by: Shane Miller <shanecm.ux@gmail.com>
This commit is contained in:
Shane Miller 2023-08-04 10:23:41 -07:00
parent 6621db6010
commit 35a0da5237
3 changed files with 64 additions and 0 deletions

View File

@ -45,6 +45,7 @@ body {
font-size: 2rem;
font-weight: 600;
line-height: 2.75rem;
margin-top: 0px !important;
}
@ -73,6 +74,8 @@ h1,h2,h3,h4,h5,h6 {
}
// H1s when manually added
h1 {
margin-top: 3rem;
margin-bottom: 1.5rem !important;
font-size: 2rem !important;
}
// Section titles
@ -107,6 +110,43 @@ h3, h4, h5, h6 {
margin: 0px !important;
}
// Tables
.table {
border-radius: 6px;
border-collapse: separate;
border-spacing: 0px;
}
// Hide bottom borders and wider padding for header items
.table th {
border-bottom: none;
padding-left: 24px;
padding-right: 24px;
padding-top: 12px;
padding-bottom: 12px;
}
// Add only top borders and wider padding for content items
.table td {
border-bottom: none;
padding-left: 24px;
padding-right: 24px;
padding-top: 12px;
padding-bottom: 12px;
}
// Decrease padding for small tables
.table.table-sm th {
padding-left: 16px;
padding-right: 16px;
padding-top: 8px;
padding-bottom: 8px;
}
.table.table-sm td {
padding-left: 16px;
padding-right: 16px;
padding-top: 8px;
padding-bottom: 8px;
}
// Color theme toggle
.form-check-input:checked {
background-color: #{$aqua-700};

View File

@ -80,6 +80,18 @@
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239DA0A0'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}
// Tables
.table td {
border-top: 1px solid #{$fog-400};
}
.table {
border: 1px solid #{$fog-400};
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
--bs-table-accent-bg: #{$fog-900};
color: #{$fog-0};
}
// Add border to top nav and footer
.docs-navbar {
border-bottom: 1px solid #{$fog-850};

View File

@ -86,4 +86,16 @@
.accordion-button::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236C7070'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}
// Tables
.table td {
border-top: 1px solid #{$fog-600};
}
.table {
border: 1px solid #{$fog-600};
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
--bs-table-accent-bg: #{$fog-75};
color: #{$fog-1000};
}
}