progress including font handling
This commit is contained in:
parent
8a9a7e0b52
commit
da2e56d08e
10 changed files with 1329 additions and 5942 deletions
49
assets/css/_bs-colors.scss
Normal file
49
assets/css/_bs-colors.scss
Normal file
|
@ -0,0 +1,49 @@
|
|||
// Colors
|
||||
$primary: #e48663;
|
||||
$secondary: #00b0b0;
|
||||
$success: #99c24d;
|
||||
$info: #b489c7;
|
||||
$warning: #f4d35e;
|
||||
|
||||
$white: #fff;
|
||||
$gray-100: #e8e8e8;
|
||||
$gray-200: #cfcfcf;
|
||||
$gray-300: #b5b5b5;
|
||||
$gray-400: #9c9c9c;
|
||||
$gray-500: #828282;
|
||||
$gray-600: #696969;
|
||||
$gray-700: #4f4f4f;
|
||||
$gray-800: #363636;
|
||||
$gray-900: #242424;
|
||||
$black: #000;
|
||||
|
||||
$light: $gray-200;
|
||||
$dark: $gray-800;
|
||||
|
||||
// Create your own map
|
||||
$custom-colors: (
|
||||
"primary": $primary,
|
||||
"secondary": $secondary,
|
||||
"success": $success,
|
||||
"info": $info,
|
||||
"warning": $warning,
|
||||
"danger": $danger,
|
||||
"light": $light,
|
||||
"dark": $dark,
|
||||
"gray": $gray-600,
|
||||
"gray-dark": $gray-800,
|
||||
);
|
||||
|
||||
// $custom-colors: (
|
||||
// "custom-color": #900
|
||||
// );
|
||||
|
||||
// Merge the maps
|
||||
$theme-colors: map-merge($theme-colors, $custom-colors);
|
||||
|
||||
// misc
|
||||
$navbar-dark-color: rgba($white, 0.75);
|
||||
$navbar-dark-hover-color: rgba($white, 0.9);
|
||||
$navbar-dark-active-color: $white;
|
||||
$navbar-dark-disabled-color: rgba($white, 0.45);
|
||||
$navbar-dark-toggler-border-color: rgba($white, 0.3);
|
21
assets/css/_bs-custom.scss
Normal file
21
assets/css/_bs-custom.scss
Normal file
|
@ -0,0 +1,21 @@
|
|||
/* Bootstrap custom variable overrides */
|
||||
|
||||
// Typography
|
||||
$font-size-base: 1.125rem;
|
||||
|
||||
$font-family-serif: "Source Serif Pro", "Iowan Old Style", "Apple Garamond",
|
||||
Baskerville, "Times New Roman", "Droid Serif", Times, serif,
|
||||
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
|
||||
|
||||
$font-family-brand: Righteous, system-ui, -apple-system, "Segoe UI", Roboto,
|
||||
"Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif,
|
||||
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
|
||||
|
||||
$font-family-monospace: "JetBrains Mono", "Fira Code", SFMono-Regular, Menlo, Monaco, Consolas,
|
||||
"Liberation Mono", "Courier New", monospace !important;
|
||||
|
||||
$font-family-base: $font-family-serif;
|
||||
|
||||
// Features
|
||||
$enable-shadows: true;
|
||||
$enable-negative-margins: true;
|
|
@ -2,49 +2,49 @@
|
|||
@import "bs-custom";
|
||||
|
||||
// Required || Configuration
|
||||
@import "../node_modules/bootstrap/scss/functions";
|
||||
@import "../node_modules/bootstrap/scss/variables";
|
||||
@import "../../node_modules/bootstrap/scss/functions";
|
||||
@import "../../node_modules/bootstrap/scss/variables";
|
||||
|
||||
/* Bootstrap custom variable overrides */
|
||||
@import "bs-colors";
|
||||
|
||||
// Required || Configuration -- CONTINUED
|
||||
@import "../node_modules/bootstrap/scss/mixins";
|
||||
@import "../node_modules/bootstrap/scss/utilities";
|
||||
@import "../../node_modules/bootstrap/scss/mixins";
|
||||
@import "../../node_modules/bootstrap/scss/utilities";
|
||||
|
||||
// Optional || Layout & components
|
||||
@import "../node_modules/bootstrap/scss/root";
|
||||
@import "../node_modules/bootstrap/scss/reboot";
|
||||
@import "../node_modules/bootstrap/scss/type";
|
||||
@import "../node_modules/bootstrap/scss/images";
|
||||
@import "../node_modules/bootstrap/scss/containers";
|
||||
@import "../node_modules/bootstrap/scss/grid";
|
||||
// @import "../node_modules/bootstrap/scss/tables";
|
||||
@import "../node_modules/bootstrap/scss/forms";
|
||||
@import "../node_modules/bootstrap/scss/buttons";
|
||||
@import "../node_modules/bootstrap/scss/transitions";
|
||||
// @import "../node_modules/bootstrap/scss/dropdown";
|
||||
// @import "../node_modules/bootstrap/scss/button-group";
|
||||
@import "../node_modules/bootstrap/scss/nav";
|
||||
@import "../node_modules/bootstrap/scss/navbar";
|
||||
// @import "../node_modules/bootstrap/scss/card";
|
||||
// @import "../node_modules/bootstrap/scss/accordion";
|
||||
// @import "../node_modules/bootstrap/scss/breadcrumb";
|
||||
// @import "../node_modules/bootstrap/scss/pagination";
|
||||
// @import "../node_modules/bootstrap/scss/badge";
|
||||
// @import "../node_modules/bootstrap/scss/alert";
|
||||
// @import "../node_modules/bootstrap/scss/progress";
|
||||
// @import "../node_modules/bootstrap/scss/list-group";
|
||||
// @import "../node_modules/bootstrap/scss/close";
|
||||
// @import "../node_modules/bootstrap/scss/toasts";
|
||||
// @import "../node_modules/bootstrap/scss/modal";
|
||||
// @import "../node_modules/bootstrap/scss/tooltip";
|
||||
// @import "../node_modules/bootstrap/scss/popover";
|
||||
// @import "../node_modules/bootstrap/scss/carousel";
|
||||
// @import "../node_modules/bootstrap/scss/spinners";
|
||||
@import "../../node_modules/bootstrap/scss/root";
|
||||
@import "../../node_modules/bootstrap/scss/reboot";
|
||||
@import "../../node_modules/bootstrap/scss/type";
|
||||
@import "../../node_modules/bootstrap/scss/images";
|
||||
@import "../../node_modules/bootstrap/scss/containers";
|
||||
@import "../../node_modules/bootstrap/scss/grid";
|
||||
// @import "../../node_modules/bootstrap/scss/tables";
|
||||
@import "../../node_modules/bootstrap/scss/forms";
|
||||
@import "../../node_modules/bootstrap/scss/buttons";
|
||||
@import "../../node_modules/bootstrap/scss/transitions";
|
||||
// @import "../../node_modules/bootstrap/scss/dropdown";
|
||||
// @import "../../node_modules/bootstrap/scss/button-group";
|
||||
@import "../../node_modules/bootstrap/scss/nav";
|
||||
@import "../../node_modules/bootstrap/scss/navbar";
|
||||
// @import "../../node_modules/bootstrap/scss/card";
|
||||
// @import "../../node_modules/bootstrap/scss/accordion";
|
||||
// @import "../../node_modules/bootstrap/scss/breadcrumb";
|
||||
// @import "../../node_modules/bootstrap/scss/pagination";
|
||||
// @import "../../node_modules/bootstrap/scss/badge";
|
||||
// @import "../../node_modules/bootstrap/scss/alert";
|
||||
// @import "../../node_modules/bootstrap/scss/progress";
|
||||
// @import "../../node_modules/bootstrap/scss/list-group";
|
||||
// @import "../../node_modules/bootstrap/scss/close";
|
||||
// @import "../../node_modules/bootstrap/scss/toasts";
|
||||
// @import "../../node_modules/bootstrap/scss/modal";
|
||||
// @import "../../node_modules/bootstrap/scss/tooltip";
|
||||
// @import "../../node_modules/bootstrap/scss/popover";
|
||||
// @import "../../node_modules/bootstrap/scss/carousel";
|
||||
// @import "../../node_modules/bootstrap/scss/spinners";
|
||||
|
||||
// Helpers
|
||||
@import "../node_modules/bootstrap/scss/helpers";
|
||||
@import "../../node_modules/bootstrap/scss/helpers";
|
||||
|
||||
// Utilities
|
||||
@import "../node_modules/bootstrap/scss/utilities/api";
|
||||
@import "../../node_modules/bootstrap/scss/utilities/api";
|
||||
|
|
27
assets/css/_fonts.scss
Normal file
27
assets/css/_fonts.scss
Normal file
|
@ -0,0 +1,27 @@
|
|||
/* brand : Fontsource Righteous */
|
||||
@import "../../node_modules/@fontsource/righteous/400.css"; /* normal | normal */
|
||||
|
||||
/* monospace : Fontsource JetBrains Mono */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/100.css"; /* light | normal */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/200.css"; /* light | normal */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/300.css"; /* light | normal */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/400.css"; /* normal | normal */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/500.css"; /* heavier normal? */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/600.css"; /* heavier normal? */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/700.css"; /* bold | normal */
|
||||
@import "../../node_modules/@fontsource/jetbrains-mono/800.css"; /* bolder | normal */
|
||||
|
||||
|
||||
/* Fontsource Source Code Pro */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/200.css"; /* light | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/200-italic.css"; /* light | italic */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/300.css"; /* light | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/300-italic.css"; /* light | italic */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/400.css"; /* normal | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/400-italic.css"; /* normal | italic */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/600.css"; /* heavier? | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/600-italic.css"; /* heavier | italic */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/700.css"; /* bold | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/700-italic.css"; /* bold | italic */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/900.css"; /* bolder? | normal */
|
||||
@import "../../node_modules/@fontsource/source-serif-pro/900-italic.css"; /* bolder? | italic */
|
|
@ -1 +1,81 @@
|
|||
@import "../../node_modules/bootstrap/scss/bootstrap.scss"
|
||||
/* Fonts */
|
||||
@import "fonts";
|
||||
|
||||
/* Load Bootstrap v5 and customizations */
|
||||
@import "bs-load";
|
||||
|
||||
|
||||
|
||||
/* main */
|
||||
html,
|
||||
body {
|
||||
color: $gray-100;
|
||||
background-color: $gray-800;
|
||||
height: 100%;
|
||||
}
|
||||
a {
|
||||
color: rgba($white, 0.75);
|
||||
border-bottom: $gray-600 2px solid;
|
||||
text-decoration: none;
|
||||
&.navbar-brand,
|
||||
&.nav-link {
|
||||
border-bottom: none;
|
||||
}
|
||||
&:visited {
|
||||
color: $info;
|
||||
.post-title & {
|
||||
color: $gray-100;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
color: $primary;
|
||||
text-decoration: none;
|
||||
border-bottom: $secondary 3px solid;
|
||||
&.navbar-brand {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.border-gray-900 {
|
||||
border-color: $gray-900 !important;
|
||||
}
|
||||
.text-gray-200 {
|
||||
color: $gray-200;
|
||||
}
|
||||
.text-gray-300 {
|
||||
color: $gray-300;
|
||||
}
|
||||
.text-gray-400 {
|
||||
color: $gray-400;
|
||||
}
|
||||
.text-gray-500 {
|
||||
color: $gray-500;
|
||||
}
|
||||
.border-10 {
|
||||
border-width: 10px !important;
|
||||
}
|
||||
.border-20 {
|
||||
border-width: 20px !important;
|
||||
}
|
||||
.fw-500 {
|
||||
font-weight: 500;
|
||||
}
|
||||
.fw-600 {
|
||||
font-weight: 600;
|
||||
}
|
||||
.font-brand {
|
||||
font-family: $font-family-brand;
|
||||
}
|
||||
.fs-larger {
|
||||
font-size: larger;
|
||||
}
|
||||
.fs-smaller {
|
||||
font-size: smaller;
|
||||
}
|
||||
.footer73k {
|
||||
position: fixed !important;
|
||||
font-size: 10px !important;
|
||||
border-top-left-radius: 0.3rem !important;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue