Add Lotusdocs theme
This commit is contained in:
Abner Coimbre
362
themes/lotusdocs/assets/docs/scss/_variables.scss
Normal file
362
themes/lotusdocs/assets/docs/scss/_variables.scss
Normal file
@@ -0,0 +1,362 @@
|
||||
// Prefix for :root CSS variables
|
||||
|
||||
$prefix: bs-;
|
||||
|
||||
$btn-link-color: var(--#{$prefix}link-color);
|
||||
$btn-link-hover-color: var(--#{$prefix}link-hover-color);
|
||||
|
||||
:root {
|
||||
|
||||
// color-variables (HSL)
|
||||
|
||||
--blue-900-hsl: 243, 72%, 25%;
|
||||
--blue-800-hsl: 239, 70%, 32%;
|
||||
--blue-700-hsl: 235, 68%, 38%;
|
||||
--blue-600-hsl: 231, 66%, 45%;
|
||||
--blue-500-hsl: 226, 66%, 51%;
|
||||
--blue-400-hsl: 221, 77%, 60%;
|
||||
--blue-300-hsl: 217, 88%, 69%;
|
||||
--blue-200-hsl: 212, 100%, 79%;
|
||||
--blue-100-hsl: 207, 100%, 88%;
|
||||
--blue-50-hsl: 198, 100%, 97%;
|
||||
|
||||
--green-900-hsl: 153, 54%, 20%;
|
||||
--green-800-hsl: 145, 57%, 25%;
|
||||
--green-700-hsl: 136, 60%, 29%;
|
||||
--green-600-hsl: 128, 63%, 34%;
|
||||
--green-500-hsl: 119, 66%, 39%;
|
||||
--green-400-hsl: 114, 49%, 51%;
|
||||
--green-300-hsl: 110, 56%, 62%;
|
||||
--green-200-hsl: 105, 64%, 74%;
|
||||
--green-100-hsl: 102, 69%, 86%;
|
||||
--green-50-hsl: 98, 73%, 97%;
|
||||
|
||||
--red-900-hsl: 344, 48%, 33%;
|
||||
--red-800-hsl: 348, 50%, 40%;
|
||||
--red-700-hsl: 352, 53%, 46%;
|
||||
--red-600-hsl: 356, 62%, 53%;
|
||||
--red-500-hsl: 1, 84%, 59%;
|
||||
--red-400-hsl: 356, 98%, 67%;
|
||||
--red-300-hsl: 350, 100%, 73%;
|
||||
--red-200-hsl: 345, 100%, 80%;
|
||||
--red-100-hsl: 339, 100%, 88%;
|
||||
--red-50-hsl: 332, 100%, 97%;
|
||||
|
||||
--yellow-900-hsl: 44, 60%, 17%;
|
||||
--yellow-800-hsl: 45, 59%, 25%;
|
||||
--yellow-700-hsl: 46, 58%, 33%;
|
||||
--yellow-600-hsl: 48, 57%, 41%;
|
||||
--yellow-500-hsl: 48, 55%, 49%;
|
||||
--yellow-400-hsl: 50, 72%, 57%;
|
||||
--yellow-300-hsl: 51, 98%, 65%;
|
||||
--yellow-200-hsl: 54, 100%, 72%;
|
||||
--yellow-100-hsl: 54, 100%, 81%;
|
||||
--yellow-50-hsl: 55, 100%, 93%;
|
||||
|
||||
--cyan-900-hsl: 194, 100%, 16%;
|
||||
--cyan-800-hsl: 193, 100%, 21%;
|
||||
--cyan-700-hsl: 192, 100%, 27%;
|
||||
--cyan-600-hsl: 191, 100%, 32%;
|
||||
--cyan-500-hsl: 190, 98%, 37%;
|
||||
--cyan-400-hsl: 189, 94%, 43%;
|
||||
--cyan-300-hsl: 187, 85%, 58%;
|
||||
--cyan-200-hsl: 185, 100%, 72%;
|
||||
--cyan-100-hsl: 180, 100%, 83%;
|
||||
--cyan-50-hsl: 180, 100%, 94%;
|
||||
|
||||
--cardinal-900-hsl: 355, 68%, 21%;
|
||||
--cardinal-800-hsl: 353, 67%, 29%;
|
||||
--cardinal-700-hsl: 353, 65%, 37%;
|
||||
--cardinal-600-hsl: 352, 63%, 45%;
|
||||
--cardinal-500-hsl: 351, 67%, 52%;
|
||||
--cardinal-400-hsl: 350, 89%, 60%;
|
||||
--cardinal-300-hsl: 347, 100%, 68%;
|
||||
--cardinal-200-hsl: 343, 100%, 75%;
|
||||
--cardinal-100-hsl: 340, 100%, 83%;
|
||||
--cardinal-50-hsl: 338, 100%, 96%;
|
||||
|
||||
--magenta-900-hsl: 297, 63%, 21%;
|
||||
--magenta-800-hsl: 296, 62%, 29%;
|
||||
--magenta-700-hsl: 295, 61%, 37%;
|
||||
--magenta-600-hsl: 294, 58%, 45%;
|
||||
--magenta-500-hsl: 293, 63%, 53%;
|
||||
--magenta-400-hsl: 292, 84%, 61%;
|
||||
--magenta-300-hsl: 291, 100%, 69%;
|
||||
--magenta-200-hsl: 292, 100%, 75%;
|
||||
--magenta-100-hsl: 293, 100%, 84%;
|
||||
--magenta-50-hsl: 293, 100%, 94%;
|
||||
|
||||
--emerald-900-hsl: 165, 97%, 13%;
|
||||
--emerald-800-hsl: 164, 96%, 18%;
|
||||
--emerald-700-hsl: 163, 93%, 23%;
|
||||
--emerald-600-hsl: 162, 89%, 29%;
|
||||
--emerald-500-hsl: 161, 87%, 34%;
|
||||
--emerald-400-hsl: 160, 84%, 39%;
|
||||
--emerald-300-hsl: 158, 66%, 53%;
|
||||
--emerald-200-hsl: 154, 77%, 68%;
|
||||
--emerald-100-hsl: 149, 89%, 82%;
|
||||
--emerald-50-hsl: 145, 100%, 94%;
|
||||
|
||||
--blue-900: hsl(var(--blue-900-hsl));
|
||||
--blue-800: hsl(var(--blue-800-hsl));
|
||||
--blue-700: hsl(var(--blue-700-hsl));
|
||||
--blue-600: hsl(var(--blue-600-hsl));
|
||||
--blue-500: hsl(var(--blue-500-hsl));
|
||||
--blue-400: hsl(var(--blue-400-hsl));
|
||||
--blue-300: hsl(var(--blue-300-hsl));
|
||||
--blue-200: hsl(var(--blue-200-hsl));
|
||||
--blue-100: hsl(var(--blue-100-hsl));
|
||||
--blue-50: hsl(var(--blue-50-hsl));
|
||||
|
||||
--green-900: hsl(var(--green-900-hsl));
|
||||
--green-800: hsl(var(--green-800-hsl));
|
||||
--green-700: hsl(var(--green-700-hsl));
|
||||
--green-600: hsl(var(--green-600-hsl));
|
||||
--green-500: hsl(var(--green-500-hsl));
|
||||
--green-400: hsl(var(--green-400-hsl));
|
||||
--green-300: hsl(var(--green-300-hsl));
|
||||
--green-200: hsl(var(--green-200-hsl));
|
||||
--green-100: hsl(var(--green-100-hsl));
|
||||
--green-50: hsl(var(--green-50-hsl));
|
||||
|
||||
--red-900: hsl(var(--red-900-hsl));
|
||||
--red-800: hsl(var(--red-800-hsl));
|
||||
--red-700: hsl(var(--red-700-hsl));
|
||||
--red-600: hsl(var(--red-600-hsl));
|
||||
--red-500: hsl(var(--red-500-hsl));
|
||||
--red-400: hsl(var(--red-400-hsl));
|
||||
--red-300: hsl(var(--red-300-hsl));
|
||||
--red-200: hsl(var(--red-200-hsl));
|
||||
--red-100: hsl(var(--red-100-hsl));
|
||||
--red-50: hsl(var(--red-50-hsl));
|
||||
|
||||
--yellow-900: hsl(var(--yellow-900-hsl));
|
||||
--yellow-800: hsl(var(--yellow-800-hsl));
|
||||
--yellow-700: hsl(var(--yellow-700-hsl));
|
||||
--yellow-600: hsl(var(--yellow-600-hsl));
|
||||
--yellow-500: hsl(var(--yellow-500-hsl));
|
||||
--yellow-400: hsl(var(--yellow-400-hsl));
|
||||
--yellow-300: hsl(var(--yellow-300-hsl));
|
||||
--yellow-200: hsl(var(--yellow-200-hsl));
|
||||
--yellow-100: hsl(var(--yellow-100-hsl));
|
||||
--yellow-50: hsl(var(--yellow-50-hsl));
|
||||
|
||||
--cyan-900: hsl(var(--cyan-900-hsl));
|
||||
--cyan-800: hsl(var(--cyan-800-hsl));
|
||||
--cyan-700: hsl(var(--cyan-700-hsl));
|
||||
--cyan-600: hsl(var(--cyan-600-hsl));
|
||||
--cyan-500: hsl(var(--cyan-500-hsl));
|
||||
--cyan-400: hsl(var(--cyan-400-hsl));
|
||||
--cyan-300: hsl(var(--cyan-300-hsl));
|
||||
--cyan-200: hsl(var(--cyan-200-hsl));
|
||||
--cyan-100: hsl(var(--cyan-100-hsl));
|
||||
--cyan-50: hsl(var(--cyan-50-hsl));
|
||||
|
||||
--cardinal-900: hsl(var(--cardinal-900-hsl));
|
||||
--cardinal-800: hsl(var(--cardinal-800-hsl));
|
||||
--cardinal-700: hsl(var(--cardinal-700-hsl));
|
||||
--cardinal-600: hsl(var(--cardinal-600-hsl));
|
||||
--cardinal-500: hsl(var(--cardinal-500-hsl));
|
||||
--cardinal-400: hsl(var(--cardinal-400-hsl));
|
||||
--cardinal-300: hsl(var(--cardinal-300-hsl));
|
||||
--cardinal-200: hsl(var(--cardinal-200-hsl));
|
||||
--cardinal-100: hsl(var(--cardinal-100-hsl));
|
||||
--cardinal-50: hsl(var(--cardinal-50-hsl));
|
||||
|
||||
--magenta-900: hsl(var(--magenta-900-hsl));
|
||||
--magenta-800: hsl(var(--magenta-800-hsl));
|
||||
--magenta-700: hsl(var(--magenta-700-hsl));
|
||||
--magenta-600: hsl(var(--magenta-600-hsl));
|
||||
--magenta-500: hsl(var(--magenta-500-hsl));
|
||||
--magenta-400: hsl(var(--magenta-400-hsl));
|
||||
--magenta-300: hsl(var(--magenta-300-hsl));
|
||||
--magenta-200: hsl(var(--magenta-200-hsl));
|
||||
--magenta-100: hsl(var(--magenta-100-hsl));
|
||||
--magenta-50: hsl(var(--magenta-50-hsl));
|
||||
|
||||
--emerald-900: hsl(var(--emerald-900-hsl));
|
||||
--emerald-800: hsl(var(--emerald-800-hsl));
|
||||
--emerald-700: hsl(var(--emerald-700-hsl));
|
||||
--emerald-600: hsl(var(--emerald-600-hsl));
|
||||
--emerald-500: hsl(var(--emerald-500-hsl));
|
||||
--emerald-400: hsl(var(--emerald-400-hsl));
|
||||
--emerald-300: hsl(var(--emerald-300-hsl));
|
||||
--emerald-200: hsl(var(--emerald-200-hsl));
|
||||
--emerald-100: hsl(var(--emerald-100-hsl));
|
||||
--emerald-50: hsl(var(--emerald-50-hsl));
|
||||
|
||||
--blue: var(--blue-500);
|
||||
--green: var(--green-500);
|
||||
--red: var(--red-500);
|
||||
--yellow: var(--yellow-500);
|
||||
--cyan: var(--cyan-500);
|
||||
--cardinal: var(--cardinal-500);
|
||||
--magenta: var(--magenta-500);
|
||||
--emerald: var(--emerald-500);
|
||||
|
||||
--secondary: var(--gray-600);
|
||||
--success: var(--green);
|
||||
--info: var(--cyan);
|
||||
--warning: var(--yellow);
|
||||
--danger: var(--red);
|
||||
--light: var(--gray-100);
|
||||
// --dark: #0e1420;
|
||||
--dark: #181921;
|
||||
// --dark: #241c2d;
|
||||
--dark-alt: #212529;
|
||||
--dark-secondary: #292a35;
|
||||
|
||||
// scss-docs-start gray-color-variables
|
||||
--white: #ffffff;
|
||||
--gray-50: #f7fafc;
|
||||
--gray-100: #f8f9fa;
|
||||
--gray-200: #e9ecef;
|
||||
--gray-300: #dee2e6;
|
||||
--gray-400: #ced4da;
|
||||
--gray-500: #adb5bd;
|
||||
--gray-600: #6c757d;
|
||||
--gray-700: #495057;
|
||||
--gray-800: #343a40;
|
||||
--gray-900: #212529;
|
||||
--black: #000000;
|
||||
|
||||
// Links
|
||||
//
|
||||
// Style anchor elements.
|
||||
|
||||
--link-color: var(--primary);
|
||||
--link-decoration: underline;
|
||||
--link-shade-percentage: 20%;
|
||||
// $link-hover-color: shift-color($link-color, $link-shade-percentage);
|
||||
--link-hover-decoration: null;
|
||||
|
||||
// Buttons
|
||||
|
||||
// Core
|
||||
--text-default: var(--text-dark);
|
||||
--text-default-inv: var(--text-light);
|
||||
--text-muted: var(--gray-600);
|
||||
--#{$prefix}secondary-color: var(--gray-600);
|
||||
|
||||
--body-color: var(--text-default);
|
||||
|
||||
--body-bg: var(--white);
|
||||
|
||||
// Text
|
||||
--text-dark: #3C4257;
|
||||
--text-light: #dee2e6;
|
||||
|
||||
// Fonts
|
||||
--fw-medium: 600;
|
||||
|
||||
// Shadows
|
||||
--shadow-sm: 0 .125rem .25rem rgba(var(--dark), .15);
|
||||
--shadow: 0 0 3px rgba(var(--dark), .15);
|
||||
--shadow-md: 0 5px 13px rgba(var(--dark), .2);
|
||||
--shadow-lg: 0 10px 25px rgba(var(--dark), 0.15);
|
||||
|
||||
// Overlay
|
||||
--overlay: rgba(var(--dark), 0.7);
|
||||
--bg-overlay-white: rgba(var(--white), 0.5);
|
||||
|
||||
// Back to top
|
||||
--back-to-top-color: var(--white);
|
||||
|
||||
// Simplebar
|
||||
--simplebar-color: #adb5bd;
|
||||
|
||||
// Footer
|
||||
--footer: #202942;
|
||||
--footer-bg: var(--white);
|
||||
--foot-social-color: #adb5bd;
|
||||
--social-border-color: #adb5bd;
|
||||
--foot-social-color-white: var(--white);
|
||||
|
||||
// lightness variables
|
||||
--l-100: 100%;
|
||||
|
||||
// Buttons
|
||||
--btn-soft-color: var(--primary);
|
||||
--btn-soft-bg: transparent;
|
||||
--btn-soft-border: var(--gray-200);
|
||||
|
||||
--btn-primary-color: var(--white);
|
||||
--btn-primary-bg: var(--primary);
|
||||
--btn-primary-border: transparent;
|
||||
|
||||
--btn-default-color: var(--text-default);
|
||||
--btn-default-hover-color: var(--primary);
|
||||
--btn-default-bg: transparent;
|
||||
--btn-default-border: transparent;
|
||||
|
||||
// Icons
|
||||
--icon-color: var(--primary);
|
||||
|
||||
--folder: "\e2c7";
|
||||
--article: "\ef42";
|
||||
--dash: "\f88a";
|
||||
--dir-right: "\e5da";
|
||||
|
||||
// Cards
|
||||
--card-bg: var(--white);
|
||||
--card-border-color: var(--gray-400);
|
||||
--card-border-hover-color: var(--primary);
|
||||
|
||||
// Sidebar
|
||||
--sidebar-primary: var(--primary);
|
||||
--sidebar-bg: var(--white);
|
||||
--top-header-bg: hsla(255,100%,100%,0.8);
|
||||
--sidebar-text-color: #606770;
|
||||
--sidebar-border-color: var(--gray-200);
|
||||
--sidebar-dropdown-hover-bg: #eff1f4;
|
||||
--sidebar-menu-active-bg: #f5f6f8;
|
||||
--sidebar-icon-bg: #f8f9fa;
|
||||
--sidebar-light-icon: #f8f9fa;
|
||||
--sidebar-scrollbar-thumb-color: var(--gray-200);
|
||||
|
||||
--sidebar-directory-icon: var(--dir-right);
|
||||
--sidebar-file-icon: var(--dash);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
|
||||
--body-bg: var(--dark);
|
||||
--text-default: var(--text-light);
|
||||
--text-default-inv: var(--text-dark);
|
||||
--text-muted: #b6b9be;
|
||||
--#{$prefix}secondary-color: #6c757d;
|
||||
|
||||
// Buttons
|
||||
--btn-soft-color: var(--gray-400);
|
||||
--btn-soft-bg: none;
|
||||
--btn-soft-border: var(--gray-800);
|
||||
|
||||
--btn-primary-color: var(--primary-200);
|
||||
--btn-primary-bg: none;
|
||||
--btn-primary-border: var(--gray-700);
|
||||
|
||||
--btn-default-color: var(--text-default);
|
||||
--btn-default-hover-color: var(--primary-300);
|
||||
--btn-default-bg: transparent;
|
||||
--btn-default-border: transparent;
|
||||
|
||||
// Icons
|
||||
--icon-color: #b6bbc9;
|
||||
|
||||
// Cards
|
||||
--card-bg: none;
|
||||
--card-border-color: var(--gray-800);
|
||||
--card-border-hover-color: var(--primary-200);
|
||||
|
||||
// sidebar
|
||||
--sidebar-primary: var(--primary-300);
|
||||
--sidebar-bg: var(--dark);
|
||||
--top-header-bg: hsla(233,16%,11%,0.8);
|
||||
--sidebar-text-color: #b6bbc9;
|
||||
--sidebar-border-color: var(--gray-900);
|
||||
--sidebar-dropdown-hover-bg: #2b303b;
|
||||
--sidebar-menu-active-bg: #2b303b;
|
||||
--sidebar-icon-bg: #2b303b;
|
||||
--sidebar-light-icon: #f8f9fa;
|
||||
--sidebar-scrollbar-thumb-color: var(--gray-800);
|
||||
}
|
||||
17
themes/lotusdocs/assets/docs/scss/custom/colors/_blue.scss
Normal file
17
themes/lotusdocs/assets/docs/scss/custom/colors/_blue.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
// blue (default)
|
||||
:root {
|
||||
--primary: var(--blue);
|
||||
--primary-50: var(--blue-50);
|
||||
--primary-100: var(--blue-100);
|
||||
--primary-200: var(--blue-200);
|
||||
--primary-300: var(--blue-300);
|
||||
--primary-400: var(--blue-400);
|
||||
--primary-800: var(--blue-800);
|
||||
|
||||
--primary-hsl: var(--blue-500-hsl);
|
||||
--primary-50-hsl: var(--blue-50-hsl);
|
||||
--primary-100-hsl: var(--blue-100-hsl);
|
||||
--primary-200-hsl: var(--blue-200-hsl);
|
||||
--primary-300-hsl: var(--blue-300-hsl);
|
||||
--primary-800-hsl: var(--blue-800-hsl);
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
// cardinal
|
||||
:root {
|
||||
--primary: var(--cardinal);
|
||||
--primary-50: var(--cardinal-50);
|
||||
--primary-100: var(--cardinal-100);
|
||||
--primary-200: var(--cardinal-200);
|
||||
--primary-300: var(--cardinal-300);
|
||||
--primary-400: var(--cardinal-400);
|
||||
--primary-800: var(--cardinal-800);
|
||||
|
||||
--primary-hsl: var(--cardinal-500-hsl);
|
||||
--primary-50-hsl: var(--cardinal-50-hsl);
|
||||
--primary-100-hsl: var(--cardinal-100-hsl);
|
||||
--primary-200-hsl: var(--cardinal-200-hsl);
|
||||
--primary-300-hsl: var(--cardinal-300-hsl);
|
||||
--primary-800-hsl: var(--cardinal-800-hsl);
|
||||
}
|
||||
17
themes/lotusdocs/assets/docs/scss/custom/colors/_cyan.scss
Normal file
17
themes/lotusdocs/assets/docs/scss/custom/colors/_cyan.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
// cyan
|
||||
:root {
|
||||
--primary: var(--cyan);
|
||||
--primary-50: var(--cyan-50);
|
||||
--primary-100: var(--cyan-100);
|
||||
--primary-200: var(--cyan-200);
|
||||
--primary-300: var(--cyan-300);
|
||||
--primary-400: var(--cyan-400);
|
||||
--primary-800: var(--cyan-800);
|
||||
|
||||
--primary-hsl: var(--cyan-500-hsl);
|
||||
--primary-50-hsl: var(--cyan-50-hsl);
|
||||
--primary-100-hsl: var(--cyan-100-hsl);
|
||||
--primary-200-hsl: var(--cyan-200-hsl);
|
||||
--primary-300-hsl: var(--cyan-300-hsl);
|
||||
--primary-800-hsl: var(--cyan-800-hsl);
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
// emerald
|
||||
:root {
|
||||
--primary: var(--emerald);
|
||||
--primary-50: var(--emerald-50);
|
||||
--primary-100: var(--emerald-100);
|
||||
--primary-200: var(--emerald-200);
|
||||
--primary-300: var(--emerald-300);
|
||||
--primary-400: var(--emerald-400);
|
||||
--primary-800: var(--emerald-800);
|
||||
|
||||
--primary-hsl: var(--emerald-500-hsl);
|
||||
--primary-50-hsl: var(--emerald-50-hsl);
|
||||
--primary-100-hsl: var(--emerald-100-hsl);
|
||||
--primary-200-hsl: var(--emerald-200-hsl);
|
||||
--primary-300-hsl: var(--emerald-300-hsl);
|
||||
--primary-800-hsl: var(--emerald-800-hsl);
|
||||
}
|
||||
17
themes/lotusdocs/assets/docs/scss/custom/colors/_green.scss
Normal file
17
themes/lotusdocs/assets/docs/scss/custom/colors/_green.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
// green
|
||||
:root {
|
||||
--primary: var(--green);
|
||||
--primary-50: var(--green-50);
|
||||
--primary-100: var(--green-100);
|
||||
--primary-200: var(--green-200);
|
||||
--primary-300: var(--green-300);
|
||||
--primary-400: var(--green-400);
|
||||
--primary-800: var(--green-800);
|
||||
|
||||
--primary-hsl: var(--green-500-hsl);
|
||||
--primary-50-hsl: var(--green-50-hsl);
|
||||
--primary-100-hsl: var(--green-100-hsl);
|
||||
--primary-200-hsl: var(--green-200-hsl);
|
||||
--primary-300-hsl: var(--green-300-hsl);
|
||||
--primary-800-hsl: var(--green-800-hsl);
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
// magenta
|
||||
:root {
|
||||
--primary: var(--magenta);
|
||||
--primary-50: var(--magenta-50);
|
||||
--primary-100: var(--magenta-100);
|
||||
--primary-200: var(--magenta-200);
|
||||
--primary-300: var(--magenta-300);
|
||||
--primary-400: var(--magenta-400);
|
||||
--primary-800: var(--magenta-800);
|
||||
|
||||
--primary-hsl: var(--magenta-500-hsl);
|
||||
--primary-50-hsl: var(--magenta-50-hsl);
|
||||
--primary-100-hsl: var(--magenta-100-hsl);
|
||||
--primary-200-hsl: var(--magenta-200-hsl);
|
||||
--primary-300-hsl: var(--magenta-300-hsl);
|
||||
--primary-800-hsl: var(--magenta-800-hsl);
|
||||
}
|
||||
17
themes/lotusdocs/assets/docs/scss/custom/colors/_red.scss
Normal file
17
themes/lotusdocs/assets/docs/scss/custom/colors/_red.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
// red
|
||||
:root {
|
||||
--primary: var(--red);
|
||||
--primary-50: var(--red-50);
|
||||
--primary-100: var(--red-100);
|
||||
--primary-200: var(--red-200);
|
||||
--primary-300: var(--red-300);
|
||||
--primary-400: var(--red-400);
|
||||
--primary-800: var(--red-800);
|
||||
|
||||
--primary-hsl: var(--red-500-hsl);
|
||||
--primary-50-hsl: var(--red-50-hsl);
|
||||
--primary-100-hsl: var(--red-100-hsl);
|
||||
--primary-200-hsl: var(--red-200-hsl);
|
||||
--primary-300-hsl: var(--red-300-hsl);
|
||||
--primary-800-hsl: var(--red-800-hsl);
|
||||
}
|
||||
17
themes/lotusdocs/assets/docs/scss/custom/colors/_yellow.scss
Normal file
17
themes/lotusdocs/assets/docs/scss/custom/colors/_yellow.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
// yellow
|
||||
:root {
|
||||
--primary: var(--yellow);
|
||||
--primary-50: var(--yellow-50);
|
||||
--primary-100: var(--yellow-100);
|
||||
--primary-200: var(--yellow-200);
|
||||
--primary-300: var(--yellow-300);
|
||||
--primary-400: var(--yellow-400);
|
||||
--primary-800: var(--yellow-800);
|
||||
|
||||
--primary-hsl: var(--yellow-500-hsl);
|
||||
--primary-50-hsl: var(--yellow-50-hsl);
|
||||
--primary-100-hsl: var(--yellow-100-hsl);
|
||||
--primary-200-hsl: var(--yellow-200-hsl);
|
||||
--primary-300-hsl: var(--yellow-300-hsl);
|
||||
--primary-800-hsl: var(--yellow-800-hsl);
|
||||
}
|
||||
241
themes/lotusdocs/assets/docs/scss/custom/components/_alerts.scss
Normal file
241
themes/lotusdocs/assets/docs/scss/custom/components/_alerts.scss
Normal file
@@ -0,0 +1,241 @@
|
||||
:root {
|
||||
--alert-border-color: #dee2e6;
|
||||
|
||||
// Default
|
||||
--alert-default-color: 225.9, 68%, 95.1%;
|
||||
--alert-default-bg: hsl(var(--alert-default-color));
|
||||
--alert-default-border-color: var(--alert-border-color);
|
||||
|
||||
// Primary
|
||||
--alert-primary-color: var(--primary-50-hsl);
|
||||
--alert-primary-bg: hsl(var(--alert-primary-color),0.5);
|
||||
--alert-primary-border-color: var(--alert-border-color);
|
||||
|
||||
// Info
|
||||
--alert-info-color: 204, 45.5%, 97.8%;
|
||||
--alert-info-bg: hsl(var(--alert-info-color));
|
||||
--alert-info-border-color: var(--alert-border-color);
|
||||
|
||||
// Success
|
||||
--alert-success-color: var(--emerald-50-hsl);
|
||||
--alert-success-bg: hsl(var(--alert-success-color),0.4);
|
||||
--alert-success-border-color: var(--alert-border-color);
|
||||
|
||||
// Danger
|
||||
--alert-danger-color: var(--cardinal-50-hsl);
|
||||
--alert-danger-bg: hsl(var(--alert-danger-color),0.5);
|
||||
--alert-danger-border-color: var(--alert-border-color);
|
||||
|
||||
// Warning
|
||||
--alert-warning-color: var(--yellow-50-hsl);
|
||||
--alert-warning-bg: hsl(var(--alert-warning-color),0.5);
|
||||
--alert-warning-border-color: var(--alert-border-color);
|
||||
|
||||
// Light
|
||||
--alert-light-bg: var(--gray-200);
|
||||
--alert-light-border-color: var(--alert-border-color);
|
||||
|
||||
// Dark
|
||||
--alert-dark-bg: var(--gray-800);
|
||||
--alert-dark-border-color: var(--alert-border-color);
|
||||
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--alert-border-color: var(--gray-800);
|
||||
|
||||
// Default
|
||||
--alert-default-bg: hsl(var(--alert-default-color),0.05);
|
||||
--alert-default-border-color: var(--alert-border-color);
|
||||
|
||||
// Primary
|
||||
--alert-primary-bg: hsl(var(--primary-hsl),0.1);
|
||||
--alert-primary-icon-color: var(--primary-200);
|
||||
--alert-primary-border-color: var(--primary-800);
|
||||
|
||||
// Info
|
||||
--alert-info-bg: hsl(var(--blue-500-hsl),0.1);
|
||||
--alert-info-icon-color: var(--blue-200);
|
||||
--alert-info-border-color: var(--blue-800);
|
||||
|
||||
// Success
|
||||
--alert-success-bg: hsl(var(--emerald-500-hsl),0.1);
|
||||
--alert-success-icon-color: var(--emerald-200);
|
||||
--alert-success-border-color: var(--emerald-800);
|
||||
|
||||
// Danger
|
||||
--alert-danger-bg: hsl(var(--cardinal-500-hsl),0.1);
|
||||
--alert-danger-icon-color: var(--cardinal-200);
|
||||
--alert-danger-border-color: var(--cardinal-800);
|
||||
|
||||
// Warning
|
||||
--alert-warning-bg: hsl(var(--yellow-500-hsl),0.1);
|
||||
--alert-warning-icon-color: var(--yellow-200);
|
||||
--alert-warning-border-color: var(--yellow-800);
|
||||
|
||||
// Light
|
||||
--alert-light-bg: var(--gray-900);
|
||||
--alert-light-icon-color: var(--gray-200);
|
||||
--alert-light-border-color: var(--gray-800);
|
||||
|
||||
// Dark
|
||||
--alert-dark-bg: var(--gray-400);
|
||||
--alert-dark-icon-color: var(--gray-800);
|
||||
--alert-dark-border-color: var(--gray-200);
|
||||
}
|
||||
.alert {
|
||||
// font-family: $font-family-monospace;
|
||||
font-size: var(--font-size-sm);
|
||||
border-radius: 4px;
|
||||
color: var(--gray-700);
|
||||
|
||||
p {
|
||||
line-height: 1.525rem;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-icon {
|
||||
margin-right: 0.35rem;
|
||||
}
|
||||
|
||||
.alert-default {
|
||||
background-color: var(--alert-default-bg);
|
||||
border-color: var(--alert-border-color);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.alert-white {
|
||||
background-color: rgba(255, 255, 255, 0.95);
|
||||
}
|
||||
|
||||
.alert-primary {
|
||||
background-color: var(--alert-primary-bg);
|
||||
border-color: var(--alert-primary-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-primary-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-primary a {
|
||||
font-weight: bold;
|
||||
// color: $white;
|
||||
}
|
||||
|
||||
.alert-success {
|
||||
background-color: var(--alert-success-bg);
|
||||
border-color: var(--alert-success-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-success-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-success a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
background-color: var(--alert-info-bg);
|
||||
border-color: var(--alert-info-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-info-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-info a {
|
||||
font-weight: bold;
|
||||
// color: #04414d;
|
||||
}
|
||||
|
||||
.alert-warning {
|
||||
background-color: var(--alert-warning-bg);
|
||||
border-color: var(--alert-warning-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-warning-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-warning .alert-link {
|
||||
color: #523e02;
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
background-color: var(--alert-danger-bg);
|
||||
border-color: var(--alert-danger-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-danger-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-danger .alert-link {
|
||||
color: #6a1a21;
|
||||
}
|
||||
|
||||
.alert-light {
|
||||
background-color: var(--alert-light-bg);
|
||||
border-color: var(--alert-light-border-color);
|
||||
color: var(--text-default);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-light-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-light .alert-link {
|
||||
color: #4f5050;
|
||||
}
|
||||
|
||||
.alert-dark {
|
||||
background-color: var(--alert-dark-bg);
|
||||
border-color: var(--alert-dark-border-color);
|
||||
color: var(--text-default-inv);
|
||||
|
||||
> .alert-icon span {
|
||||
color: var(--alert-dark-icon-color);
|
||||
margin-top: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-dark .alert-link {
|
||||
color: #101214;
|
||||
}
|
||||
|
||||
.alert .alert-link:hover,
|
||||
.alert .alert-link:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.alert-dismissible .btn-close {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 1rem;
|
||||
z-index: 2;
|
||||
padding: 0.5rem;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
|
||||
background-size: 1.5rem;
|
||||
filter: invert(1) grayscale(100%) brightness(200%);
|
||||
}
|
||||
|
||||
[data-global-alert="closed"] #announcement {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,37 @@
|
||||
//
|
||||
// backgrounds.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--bg-default: hsl(var(--primary-800-hsl),0.1);
|
||||
--bg-default-border: hsl(var(--primary-800-hsl),0.1);
|
||||
--bg-default-color: var(--text-default);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--bg-default: var(--gray-800);
|
||||
--bg-default-border: hsl(var(--primary-200-hsl),0.1);
|
||||
--bg-default-color: var(--text-default);
|
||||
}
|
||||
|
||||
.bg-default {
|
||||
background-color: var(--bg-default) !important;
|
||||
border: 1px solid var(--bg-default-border) !important;
|
||||
color: var(--bg-default-color) !important;
|
||||
}
|
||||
|
||||
.bg-primary {
|
||||
background-color: var(--btn-primary-bg) !important;
|
||||
border: 1px solid var(--btn-primary-border) !important;
|
||||
color: var(--btn-primary-color) !important;
|
||||
}
|
||||
// .bg-light {
|
||||
// background-color: rgba($value, 0.1) !important;
|
||||
// border: 1px solid rgba($value, 0.1) !important;
|
||||
// color: #{$value} !important;
|
||||
// }
|
||||
// .bg-dark {
|
||||
// background-color: rgba($value, 0.1) !important;
|
||||
// border: 1px solid rgba($value, 0.1) !important;
|
||||
// color: #{$value} !important;
|
||||
// }
|
||||
@@ -0,0 +1,17 @@
|
||||
//
|
||||
// _badge.scss
|
||||
//
|
||||
|
||||
//Badges
|
||||
.badge {
|
||||
letter-spacing: 1.1px;
|
||||
padding: 6px 8px 7px 8px;
|
||||
font-weight: 600;
|
||||
line-height: 11px;
|
||||
border-radius: 4px;
|
||||
&.badge-link {
|
||||
&:hover {
|
||||
color: var(--white) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
//
|
||||
// breadcrumb.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--breadcrumb-item-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--breadcrumb-item-color: var(--primary-300);
|
||||
}
|
||||
|
||||
.breadcrumb .breadcrumb-item a {
|
||||
color: var(--breadcrumb-item-color);
|
||||
}
|
||||
.breadcrumb .breadcrumb-item.active {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.breadcrumb {
|
||||
--bs-breadcrumb-padding-x: 0.7rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,211 @@
|
||||
//
|
||||
// _buttons.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--invert: invert(0%);
|
||||
--btn-modal-hover-bg: var(--gray-200);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--invert: invert(100%);
|
||||
--btn-modal-hover-bg: var(--gray-800);
|
||||
}
|
||||
|
||||
//Buttons
|
||||
.btn-soft {
|
||||
background-color: var(--btn-soft-bg) !important;
|
||||
border: 1px solid var(--btn-soft-border) !important;
|
||||
color: var(--btn-soft-color) !important;
|
||||
// box-shadow: 0 3px 5px 0 hsl(var(--primary-hsl), 0.1);
|
||||
|
||||
&:hover,
|
||||
// &:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&.focus {
|
||||
// background-color: var(--primary) !important;
|
||||
background: var(--btn-soft-bg);
|
||||
border-color: var(--btn-soft-border) !important;
|
||||
color: var(--btn-soft-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: var(--btn-primary-bg) !important;
|
||||
border: 1px solid var(--btn-primary-border) !important;
|
||||
color: var(--btn-primary-color) !important;
|
||||
// box-shadow: 0 3px 5px 0 hsl(var(--primary-hsl), 0.1);
|
||||
|
||||
&:hover,
|
||||
// &:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&.focus {
|
||||
// background-color: var(--primary) !important;
|
||||
background: var(--btn-primary-bg);
|
||||
border-color: var(--btn-primary-border) !important;
|
||||
color: var(--btn-primary-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
background-color: var(--btn-default-bg) !important;
|
||||
border: 1px solid var(--btn-default-border) !important;
|
||||
color: var(--btn-default-color) !important;
|
||||
// box-shadow: 0 3px 5px 0 hsl(var(--primary-hsl), 0.1);
|
||||
|
||||
&:hover,
|
||||
// &:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&.focus {
|
||||
// background-color: var(--primary) !important;
|
||||
background: var(--btn-default-bg);
|
||||
border-color: var(--btn-default-border) !important;
|
||||
color: var(--btn-default-hover-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-link-modal {
|
||||
--bs-btn-font-weight: 600;
|
||||
--bs-btn-color: var(--text-default);
|
||||
--bs-btn-bg: none;
|
||||
--bs-btn-border-color: var(--bd-violet-bg);
|
||||
--bs-btn-hover-color: var(--btn-default-hover-color);
|
||||
--bs-btn-hover-bg: var(--btn-modal-hover-bg);
|
||||
--bs-btn-hover-border-color: var(--bd-violet-bg);
|
||||
--bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
|
||||
--bs-btn-active-color: var(--bs-btn-hover-color);
|
||||
--bs-btn-active-bg: var(--bd-violet-bg);
|
||||
--bs-btn-active-border-color: var(--bd-violet-bg);
|
||||
}
|
||||
|
||||
.btn-close {
|
||||
filter: var(--invert);
|
||||
}
|
||||
|
||||
body .toggle-dark {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body .toggle-light {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-dark-mode] body .toggle-light {
|
||||
display: block;
|
||||
}
|
||||
|
||||
[data-dark-mode] body .toggle-dark {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 8px 20px;
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
font-size: 16px;
|
||||
letter-spacing: 0.5px;
|
||||
transition: all 0.3s;
|
||||
font-weight: 600;
|
||||
border-radius: 6px;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
&.btn-sm {
|
||||
padding: 7px 16px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&.btn-xs {
|
||||
padding: 4px 10px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
&.btn-lg {
|
||||
padding: 14px 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&.searchbtn {
|
||||
padding: 6px 20px;
|
||||
}
|
||||
|
||||
&.btn-pills {
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
// &.btn-light {
|
||||
// border: 1px solid darken($light, 2%);
|
||||
// }
|
||||
|
||||
&.btn-outline-light {
|
||||
border-color: var(--gray-200) !important;
|
||||
}
|
||||
|
||||
&.btn-soft-light {
|
||||
color: var(--gray-500) !important;
|
||||
border-color: var(--gray-200) !important;
|
||||
}
|
||||
|
||||
&.btn-soft-dark {
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&.focus {
|
||||
color: var(--gray-400) !important;
|
||||
border-color: var(--gray-200) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-dark,
|
||||
&.btn-secondary {
|
||||
color: var(--gray-200);
|
||||
}
|
||||
|
||||
&.btn-outline-light {
|
||||
color: var(--gray-900);
|
||||
}
|
||||
|
||||
&.btn-icon {
|
||||
height: 36px;
|
||||
width: 36px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
|
||||
.icons {
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&.btn-lg {
|
||||
height: 48px;
|
||||
width: 48px;
|
||||
line-height: 46px;
|
||||
|
||||
.icons {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-sm {
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
line-height: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button:not(:disabled) {
|
||||
outline: none;
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
//
|
||||
// _card.scss
|
||||
//
|
||||
//card
|
||||
:root {
|
||||
--card-title-color: var(--text-default);
|
||||
--card-text-color: var(--text-muted);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--card-title-color: var(--text-default);
|
||||
--card-text-color: var(--gray-500);
|
||||
}
|
||||
|
||||
.card {
|
||||
background: var(--card-bg);
|
||||
border-color: var(--card-border-color);
|
||||
border-radius: 4px;
|
||||
transition: all 0.2s;
|
||||
-webkit-transition: all 0.2s;
|
||||
.card-body {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
&:hover {
|
||||
border-color: var(--card-border-hover-color);
|
||||
.card-title {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-title {
|
||||
color: var(--card-title-color);
|
||||
}
|
||||
|
||||
.card-text {
|
||||
color: var(--card-text-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
//
|
||||
// dropdown.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--dropdown-link-color: var(--text-default);
|
||||
--dropdown-bg: var(--body-bg);
|
||||
--dropdown-border-color: var(--alert-border-color);
|
||||
--dropdown-border-radius: 0 0 4px 4px;
|
||||
|
||||
--dropdown-link-hover-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--dropdown-link-color: var(--text-default);
|
||||
--dropdown-bg: var(--body-bg);
|
||||
--dropdown-border-color: var(--alert-border-color);
|
||||
--dropdown-border-radius: 0 0 4px 4px;
|
||||
|
||||
--dropdown-link-hover-color: var(--primary-300);
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
--bs-dropdown-min-width: 7rem;
|
||||
--#{$prefix}dropdown-link-color: var(--dropdown-link-color);
|
||||
--#{$prefix}dropdown-bg: var(--dropdown-bg);
|
||||
--#{$prefix}dropdown-border-color: var(--dropdown-border-color);
|
||||
|
||||
--#{$prefix}dropdown-link-hover-bg: none;
|
||||
--#{$prefix}dropdown-link-hover-color: var(--dropdown-link-hover-color);
|
||||
|
||||
--#{$prefix}dropdown-border-radius: var(--dropdown-border-radius);
|
||||
|
||||
transform: translate(0px, 57px) !important;
|
||||
border-top: none;
|
||||
}
|
||||
@@ -0,0 +1,79 @@
|
||||
//
|
||||
// Forms.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--form-border-color: var(--gray-200);
|
||||
--form-control-focus-color: var(--gray-900);
|
||||
--form-control-focus-bg-color: none;
|
||||
--form-control-focus-border-color: var(--primary);
|
||||
--form-control-placeholder-color: #666d78;
|
||||
|
||||
--form-check-input-border-color:var(--gray-400);
|
||||
--form-check-input-background-color:var(--primary);
|
||||
--form-check-input-checked-border-color:var(--primary);
|
||||
--form-check-input-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='%23fff'/></svg>");
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--form-border-color: var(--gray-800);
|
||||
--form-control-focus-color: var(--gray-200);
|
||||
--form-control-focus-bg-color: #000;
|
||||
--form-control-focus-border-color: var(--primary-300);
|
||||
--form-control-placeholder-color: #7f8497;
|
||||
|
||||
--form-check-input-border-color:var(--gray-700);
|
||||
--form-check-input-background-color:var(--primary-300);
|
||||
--form-check-input-checked-border-color:var(--primary-300);
|
||||
--form-check-input-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='%23181921'/></svg>");
|
||||
}
|
||||
|
||||
//Form
|
||||
.form-label,
|
||||
.form-check-label {
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
border: 1px solid var(--form-border-color);
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
border-radius: 4px;
|
||||
color: var(--text-default) !important;
|
||||
background-color: var(--body-bg);
|
||||
text-align: left;
|
||||
&:focus {
|
||||
border-color: var(--primary);
|
||||
box-shadow: none;
|
||||
}
|
||||
&[readonly] {
|
||||
background-color: var(--white);
|
||||
}
|
||||
&:disabled {
|
||||
background-color: var(--gray-300);
|
||||
}
|
||||
&::placeholder{
|
||||
color: var(--form-control-placeholder-color);
|
||||
}
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
color: var(--form-control-focus-color);
|
||||
border-color: var(--form-control-focus-border-color);
|
||||
background-color: var(--form-control-focus-bg-color);
|
||||
}
|
||||
|
||||
.form-check-input {
|
||||
border: 1px solid var(--form-check-input-border-color);
|
||||
background-color: var(--body-bg);
|
||||
&:focus {
|
||||
border-color: var(--primary);
|
||||
box-shadow: none;
|
||||
}
|
||||
&.form-check-input:checked {
|
||||
background-color: var(--form-check-input-background-color);
|
||||
border-color: var(--form-check-input-checked-border-color);
|
||||
--bs-form-check-bg-image: var(--form-check-input-checked-bg-image);
|
||||
}
|
||||
}
|
||||
156
themes/lotusdocs/assets/docs/scss/custom/components/_table.scss
Normal file
156
themes/lotusdocs/assets/docs/scss/custom/components/_table.scss
Normal file
@@ -0,0 +1,156 @@
|
||||
//
|
||||
// _table.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--table-hover-bg: rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--table-hover-bg: rgba(255, 255, 255, 0.075);
|
||||
}
|
||||
|
||||
// Default Table
|
||||
table {
|
||||
td {
|
||||
border-top: 1px solid var(--card-border-color);
|
||||
}
|
||||
td, th {
|
||||
border-right: 1px solid var(--card-border-color);
|
||||
padding: 8px 12px;
|
||||
}
|
||||
td:last-child, th:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Shortcode Table
|
||||
.table {
|
||||
--bs-table-color: var(--text-default);
|
||||
--bs-table-bg: transparent;
|
||||
--bs-table-accent-bg: none;
|
||||
--bs-table-striped-color: var(--text-default);
|
||||
--bs-table-striped-bg: var(--alert-primary-bg);
|
||||
--bs-table-hover-color: var(--text-default);
|
||||
--bs-table-hover-bg: var(--table-hover-bg);
|
||||
|
||||
color: var(--text-default);
|
||||
font-size: 0.875rem;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
|
||||
> :not(caption) > * > * {
|
||||
padding: 1rem 1rem;
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
|
||||
tbody {
|
||||
vertical-align: top;
|
||||
|
||||
td {
|
||||
border-top: inherit;
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
td:first-child {
|
||||
border-left-width: 1px;
|
||||
}
|
||||
|
||||
td:last-child {
|
||||
border-right: inherit;
|
||||
border-right-width: 1px;
|
||||
}
|
||||
|
||||
tr:first-child {
|
||||
td {
|
||||
border-top-width: 1px;
|
||||
}
|
||||
td:first-child {
|
||||
border-top-left-radius: 4px;
|
||||
}
|
||||
td:last-child {
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
tr:last-child {
|
||||
td:first-child {
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
td:last-child {
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td, th {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
thead, tbody, tfoot, tr, td, th {
|
||||
border-color: var(--card-border-color);
|
||||
}
|
||||
|
||||
thead tr th {
|
||||
text-transform: uppercase;
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
.table-sm,
|
||||
.table-striped,
|
||||
.table-borderless,
|
||||
.table-hover,
|
||||
.table-striped-columns {
|
||||
> :not(caption) > * > * {
|
||||
padding: 0.6rem 0.6rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
|
||||
.table-sm,
|
||||
.table-striped,
|
||||
.table-borderless,
|
||||
.table-hover,
|
||||
.table-striped-columns {
|
||||
> :not(caption)>*>* {
|
||||
padding: 0.6rem 0.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-xs {
|
||||
> :not(caption) > * > * {
|
||||
padding: 0.25rem 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.table-borderless {
|
||||
> :not(caption)>*>* {
|
||||
border-bottom-width: 0 !important;
|
||||
}
|
||||
|
||||
td:first-child {
|
||||
border-left-width: 0 !important;
|
||||
}
|
||||
|
||||
td:last-child {
|
||||
border-right-width: 0 !important;
|
||||
}
|
||||
|
||||
tr:first-child td {
|
||||
border-top-width: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.table-striped-columns > :not(caption) > tr > th:nth-child(2n) {
|
||||
--bs-table-striped-bg: none;
|
||||
}
|
||||
|
||||
// Responsive Table
|
||||
.table-responsive {
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
//
|
||||
// _tabs.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--nav-tabs-border-width: none;
|
||||
--nav-tabs-link-active-bg: none;
|
||||
--nav-tabs-link-active-color: var(--text-default);
|
||||
--nav-tabs-border-color: var(--gray-400);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--nav-tabs-border-color: var(--gray-800);
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
--bs-nav-tabs-border-width: var(--nav-tabs-border-width);
|
||||
--bs-nav-tabs-link-active-bg: var(--nav-tabs-link-active-bg);
|
||||
--bs-nav-tabs-link-active-color: var(--nav-tabs-link-active-color);
|
||||
|
||||
border-bottom: 1px solid var(--nav-tabs-border-color);
|
||||
margin-bottom: 0.8rem;
|
||||
|
||||
.nav-link {
|
||||
color: var(--text-muted) !important;
|
||||
margin-bottom: -1px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-link.active {
|
||||
border-bottom: 2px solid var(--content-link-color);
|
||||
color: var(--content-link-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
margin-bottom: 0.8rem;
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
//
|
||||
// _tooltip.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--tooltip-bg: var(--white);
|
||||
--tooltip-border-color: var(--content-link-color);
|
||||
--tooltip-drop-shadow-color: var(--gray-500);
|
||||
--tooltip-link-color: var(--gray-700);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--tooltip-bg: var(--dark-alt);
|
||||
--tooltip-border-color: var(--primary-300);
|
||||
--tooltip-drop-shadow-color: var(--gray-900);
|
||||
--tooltip-link-color: var(--gray-500);
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--#{$prefix}tooltip-bg: var(--tooltip-bg);
|
||||
--#{$prefix}tooltip-opacity: 1.0;
|
||||
--#{$prefix}tooltip-font-size: 0.575rem;
|
||||
--#{$prefix}tooltip-max-width: 300px;
|
||||
}
|
||||
|
||||
.tooltip-inner {
|
||||
text-align: left;
|
||||
border: 2px solid var(--tooltip-border-color);
|
||||
border-width: 2px 2px 2px 8px;
|
||||
filter: drop-shadow(4px 4px 5px var(--tooltip-drop-shadow-color));
|
||||
--#{$prefix}tooltip-border-radius: 4px;
|
||||
|
||||
a {
|
||||
color: var(--tooltip-link-color);
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.55;
|
||||
p {
|
||||
margin-bottom: 0.2rem;
|
||||
color: var(--text-muted);
|
||||
font-weight: 600;
|
||||
}
|
||||
strong {
|
||||
font-size: 0.975rem;
|
||||
line-height: 2;
|
||||
color: var(--text-default);
|
||||
}
|
||||
}
|
||||
}
|
||||
77
themes/lotusdocs/assets/docs/scss/custom/fonts/_fonts.scss
Normal file
77
themes/lotusdocs/assets/docs/scss/custom/fonts/_fonts.scss
Normal file
@@ -0,0 +1,77 @@
|
||||
|
||||
/* nunito-300 - latin */
|
||||
@font-face {
|
||||
font-family: 'Nunito';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/nunito-v25-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/nunito-v25-latin-300.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* nunito-regular - latin */
|
||||
@font-face {
|
||||
font-family: 'Nunito';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/nunito-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/nunito-v25-latin-regular.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* nunito-500 - latin */
|
||||
@font-face {
|
||||
font-family: 'Nunito';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/nunito-v25-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/nunito-v25-latin-500.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* nunito-600 - latin */
|
||||
@font-face {
|
||||
font-family: 'Nunito';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/nunito-v25-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/nunito-v25-latin-600.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* nunito-700 - latin */
|
||||
@font-face {
|
||||
font-family: 'Nunito';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/nunito-v25-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/nunito-v25-latin-700.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* source-code-pro-500 - latin */
|
||||
@font-face {
|
||||
font-family: 'Source Code Pro';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/source-code-pro-v22-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/source-code-pro-v22-latin-500.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
|
||||
/* source-code-pro-700 - latin */
|
||||
@font-face {
|
||||
font-family: 'Source Code Pro';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local(''),
|
||||
url('/docs/fonts/source-code-pro-v22-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('/docs/fonts/source-code-pro-v22-latin-700.woff') format('woff'), /* Modern Browsers */
|
||||
}
|
||||
227
themes/lotusdocs/assets/docs/scss/custom/pages/_features.scss
Normal file
227
themes/lotusdocs/assets/docs/scss/custom/pages/_features.scss
Normal file
@@ -0,0 +1,227 @@
|
||||
//
|
||||
// features.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--feature-icon-color: var(--primary);
|
||||
--feature-icon-faint: var(--gray-200);
|
||||
--feature-link-hover-bg-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--feature-icon-color: var(--primary-300);
|
||||
--feature-icon-faint: var(--gray-900);
|
||||
--feature-link-hover-bg-color: var(--gray-900);
|
||||
}
|
||||
|
||||
.features {
|
||||
.icon {
|
||||
background: rgba(var(--primary), 0.1);
|
||||
}
|
||||
|
||||
.image {
|
||||
&:before {
|
||||
background: linear-gradient(45deg, transparent, rgba(var(--primary), 0.1));
|
||||
}
|
||||
}
|
||||
|
||||
.read-more,
|
||||
.color {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
|
||||
&.feature-clean {
|
||||
.icons {
|
||||
color: var(--primary) !important;
|
||||
i {
|
||||
background-color: rgba(var(--primary), 0.1);
|
||||
}
|
||||
}
|
||||
.title {
|
||||
&:hover {
|
||||
color: var(--primary-800) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.feature-full-bg {
|
||||
.icon-color {
|
||||
color: var(--feature-icon-color) !important;
|
||||
}
|
||||
.icon-faint {
|
||||
color: var(--feature-icon-faint) !important;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
&:hover {
|
||||
background-color: var(--feature-link-hover-bg-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.key-feature {
|
||||
.icon {
|
||||
background: linear-gradient(45deg, transparent, rgba(var(--primary), 0.15));
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
&.course-feature {
|
||||
.full-img {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.explore-feature {
|
||||
&:hover {
|
||||
.icons,
|
||||
.title {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-soft {
|
||||
background-color: rgba(var(--primary), 0.05) !important;
|
||||
border: 1px solid rgba(var(--primary), 0.05) !important;
|
||||
color: var(--primary) !important;
|
||||
box-shadow: 0 3px 5px 0 rgba(var(--primary), 0.1);
|
||||
&:hover, &:focus, &:active, &.active, &.focus{
|
||||
background-color: var(--primary) !important;
|
||||
border-color: var(--primary) !important;
|
||||
color: var(--white) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.image {
|
||||
&:before {
|
||||
background: rgba(var(--primary), 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.features {
|
||||
.image {
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 5px;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
border-radius: 6px;
|
||||
transform: rotate(33.75deg);
|
||||
}
|
||||
}
|
||||
&.feature-clean {
|
||||
background-color: var(--body-bg);
|
||||
.icons {
|
||||
i {
|
||||
height: 65px;
|
||||
width: 65px;
|
||||
line-height: 65px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ride-image {
|
||||
transform: rotate(-45deg);
|
||||
img {
|
||||
border-radius: 100% 100% 100% 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.key-feature {
|
||||
transition: all 0.3s ease;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: var(--shadow-md) !important;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.image {
|
||||
&:before {
|
||||
animation: spinner-border 5s linear infinite !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.feature-full-bg {
|
||||
transition: all 0.5s ease;
|
||||
.big-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
right: 0;
|
||||
opacity: 0.015;
|
||||
font-size: 180px;
|
||||
}
|
||||
&:hover {
|
||||
box-shadow: var--(shadow-lg);
|
||||
color: var(--white) !important;
|
||||
.icon-color i,
|
||||
.badge,
|
||||
.para {
|
||||
color: var(--white) !important;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.content,
|
||||
.icon-color {
|
||||
z-index: 2;
|
||||
}
|
||||
.big-icon {
|
||||
opacity: 0.05;
|
||||
}
|
||||
.readmore {
|
||||
color: var(--white) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.course-feature {
|
||||
transition: all 0.5s ease;
|
||||
.full-img {
|
||||
position: absolute;
|
||||
bottom: 50%;
|
||||
transform: translateY(50%);
|
||||
left: 0;
|
||||
right: 0;
|
||||
opacity: 0;
|
||||
margin: 0 auto;
|
||||
z-index: -2;
|
||||
transition: all 0.5s ease;
|
||||
font-size: 250px;
|
||||
}
|
||||
&:hover {
|
||||
transform: translateY(-10px);
|
||||
.full-img {
|
||||
opacity: 0.05;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.explore-feature {
|
||||
transition: all 0.5s ease;
|
||||
.icons {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
line-height: 80px;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
&:hover {
|
||||
box-shadow: var(--shadow-lg) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.features,
|
||||
.key-feature {
|
||||
.title {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
.icon {
|
||||
height: 45px;
|
||||
min-width: 45px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
330
themes/lotusdocs/assets/docs/scss/custom/pages/_helper.scss
Normal file
330
themes/lotusdocs/assets/docs/scss/custom/pages/_helper.scss
Normal file
@@ -0,0 +1,330 @@
|
||||
//
|
||||
// _helper.scss
|
||||
//
|
||||
.fw-medium {
|
||||
font-weight: var(--fw-medium);
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 100px 0;
|
||||
position: relative;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 60px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-overlay {
|
||||
background-color: var(--overlay);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.bg-overlay-white {
|
||||
background-color: var(--bg-overlay-white);
|
||||
}
|
||||
|
||||
//Title
|
||||
.title-heading {
|
||||
line-height: 26px;
|
||||
|
||||
.heading {
|
||||
font-size: 45px !important;
|
||||
letter-spacing: 1px;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 35px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.para-desc {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
|
||||
// position: relative;
|
||||
.title {
|
||||
letter-spacing: 0.5px;
|
||||
font-size: 30px !important;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.para-desc {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
.mt-100 {
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
//back to top
|
||||
.back-to-top {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
bottom: 30px;
|
||||
right: 30px;
|
||||
display: none;
|
||||
transition: all 0.5s ease;
|
||||
height: 36px;
|
||||
width: 36px;
|
||||
line-height: 0;
|
||||
padding: 0;
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
background: var(--primary);
|
||||
|
||||
svg {
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transform: rotate(45deg);
|
||||
svg {
|
||||
transform: rotate(-45deg) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Opacity
|
||||
.opacity-05 {
|
||||
opacity: 0.05;
|
||||
}
|
||||
|
||||
.opacity-1 {
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.opacity-2 {
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.opacity-3 {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.opacity-4 {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.opacity-5 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.opacity-6 {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.opacity-7 {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.opacity-075 {
|
||||
opacity: 0.075;
|
||||
}
|
||||
|
||||
.opacity-8 {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.opacity-9 {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
//back-to-home
|
||||
.back-to-home {
|
||||
position: fixed;
|
||||
top: 4%;
|
||||
right: 2%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
//Sticky Sidebar
|
||||
.sticky-bar {
|
||||
position: sticky;
|
||||
top: 80px;
|
||||
}
|
||||
|
||||
[class^=uil-],
|
||||
[class*=" uil-"] {
|
||||
&:before {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.uim-svg {
|
||||
vertical-align: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//Social icons
|
||||
.social-icon {
|
||||
li {
|
||||
a {
|
||||
color: var(--dark);
|
||||
border: 1px solid var(--dark);
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
transition: all 0.4s ease;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.fea-social {
|
||||
stroke-width: 2;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--primary);
|
||||
border-color: var(--primary) !important;
|
||||
color: var(--foot-social-color-white) !important;
|
||||
|
||||
.fea-social {
|
||||
fill: var(--primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.social {
|
||||
li {
|
||||
a {
|
||||
color: var(--foot-social-color);
|
||||
border-color: var(--social-border-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.foot-social-icon {
|
||||
li {
|
||||
a {
|
||||
color: var(--foot-social-color);
|
||||
// border-color: lighten($footer, 5%);
|
||||
border-color: hsl(var(--footer), 100%,calc(var(--l) + 5%));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Rounded
|
||||
.rounded {
|
||||
border-radius: 6px !important;
|
||||
}
|
||||
|
||||
.rounded-top {
|
||||
border-top-left-radius: 6px !important;
|
||||
border-top-right-radius: 6px !important;
|
||||
}
|
||||
|
||||
.rounded-left {
|
||||
border-top-left-radius: 6px !important;
|
||||
border-bottom-left-radius: 6px !important;
|
||||
}
|
||||
|
||||
.rounded-bottom {
|
||||
border-bottom-left-radius: 6px !important;
|
||||
border-bottom-right-radius: 6px !important;
|
||||
}
|
||||
|
||||
.rounded-right {
|
||||
border-top-right-radius: 6px !important;
|
||||
border-bottom-right-radius: 6px !important;
|
||||
}
|
||||
|
||||
.rounded-md {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
.rounded-lg {
|
||||
border-radius: 30px !important;
|
||||
}
|
||||
|
||||
.bg-white-color {
|
||||
background: var(--bg-white-color);
|
||||
}
|
||||
|
||||
.d-flex {
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//Google Material Symbol Icons
|
||||
.material-icons {
|
||||
font-family: 'Material Symbols Outlined';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
/* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
overflow: hidden;
|
||||
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
/* Support for IE. */
|
||||
font-feature-settings: 'liga';
|
||||
}
|
||||
|
||||
/* Recommended icon sizes */
|
||||
span,
|
||||
i {
|
||||
&.size-16 {
|
||||
font-size: 16px !important;
|
||||
font-variation-settings: 'OPSZ' 16;
|
||||
}
|
||||
&.size-20 {
|
||||
font-size: 20px !important;
|
||||
font-variation-settings: 'OPSZ' 20;
|
||||
}
|
||||
&.size-24 {
|
||||
font-size: 24px !important;
|
||||
font-variation-settings: 'OPSZ' 24;
|
||||
}
|
||||
&.size-40 {
|
||||
font-size: 40px !important;
|
||||
font-variation-settings: 'OPSZ' 40;
|
||||
}
|
||||
&.size-48 {
|
||||
font-size: 48px !important;
|
||||
font-variation-settings: 'OPSZ' 48;
|
||||
}
|
||||
}
|
||||
|
||||
// Content Anchors
|
||||
.anchor {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
h1:hover a,
|
||||
h2:hover a,
|
||||
h3:hover a,
|
||||
h4:hover a {
|
||||
visibility: visible;
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
/* Chroma CSS */
|
||||
|
||||
.docs-content .main-content code {
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.docs-content .main-content pre {
|
||||
background-color: var(--code-block-bg) !important;
|
||||
code {
|
||||
color: #f5fbff;
|
||||
background: var(--code-block-bg);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,761 @@
|
||||
/*! @docsearch/css 3.3.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */
|
||||
|
||||
:root {
|
||||
--docsearch-primary-color: var(--primary);
|
||||
--docsearch-text-color: #1c1e21;
|
||||
--docsearch-spacing: 12px;
|
||||
--docsearch-icon-stroke-width: 1.4;
|
||||
--docsearch-highlight-color: var(--docsearch-primary-color);
|
||||
--docsearch-muted-color: #666d78;
|
||||
--docsearch-container-background: rgba(101, 108, 133, 0.8);
|
||||
--docsearch-logo-color: #5468ff;
|
||||
--docsearch-modal-width: 560px;
|
||||
--docsearch-modal-height: 600px;
|
||||
--docsearch-modal-background: #f5f6f7;
|
||||
--docsearch-modal-shadow: inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5), 0 3px 8px 0 #555a64;
|
||||
--docsearch-searchbox-height: 56px;
|
||||
--docsearch-searchbox-background: var(--body-bg);
|
||||
--docsearch-searchbox-border: #e5e5e5;
|
||||
--docsearch-searchbox-focus-background: #fff;
|
||||
--docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color);
|
||||
--docsearch-hit-height: 56px;
|
||||
--docsearch-hit-color: #444950;
|
||||
--docsearch-hit-active-color: #fff;
|
||||
--docsearch-hit-background: #fff;
|
||||
--docsearch-hit-shadow: 0 1px 3px 0 #d4d9e1;
|
||||
--docsearch-key-gradient: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
|
||||
--docsearch-key-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, 0 1px 2px 1px rgba(30, 35, 90, 0.4);
|
||||
--docsearch-key-color: #fff;
|
||||
--docsearch-key-background-color: var(--docsearch-primary-color);
|
||||
--docsearch-footer-height: 44px;
|
||||
--docsearch-footer-background: #fff;
|
||||
--docsearch-footer-shadow: 0 -1px 0 0 #e0e3e8, 0 -3px 6px 0 rgba(69, 98, 155, 0.12)
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--docsearch-text-color: #f5f6f7;
|
||||
--docsearch-container-background: rgba(9, 10, 17, 0.8);
|
||||
--docsearch-modal-background: var(--dark);
|
||||
--docsearch-modal-shadow: inset 1px 1px 0 0 #2c2e40, 0 3px 8px 0 #000309;
|
||||
--docsearch-searchbox-background: var(--body-bg);
|
||||
--docsearch-searchbox-border: var(--gray-800);
|
||||
--docsearch-searchbox-focus-background: #000;
|
||||
--docsearch-hit-color: #bec3c9;
|
||||
--docsearch-hit-shadow: none;
|
||||
--docsearch-hit-background: #090a11;
|
||||
--docsearch-key-gradient: linear-gradient(-26.5deg, #565872, #31355b);
|
||||
--docsearch-key-shadow: inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, 0.3);
|
||||
--docsearch-key-color: var(--primary-200);
|
||||
--docsearch-key-background-color: hsl(var(--primary-hsl), 0.15);
|
||||
--docsearch-footer-background: #1e2136;
|
||||
--docsearch-footer-shadow: inset 0 1px 0 0 rgba(73, 76, 106, 0.5), 0 -4px 8px 0 rgba(0, 0, 0, 0.2);
|
||||
--docsearch-logo-color: #fff;
|
||||
--docsearch-muted-color: #7f8497
|
||||
}
|
||||
|
||||
.DocSearch-Button {
|
||||
align-items: center;
|
||||
background: none;
|
||||
border: 1px solid var(--docsearch-searchbox-border);
|
||||
border-radius: 4px;
|
||||
color: var(--docsearch-muted-color);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
font-weight: 500;
|
||||
height: 36px;
|
||||
justify-content: space-between;
|
||||
margin: 0 0 0 16px;
|
||||
padding: 0 8px;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.DocSearch-Button:active,
|
||||
.DocSearch-Button:focus,
|
||||
.DocSearch-Button:hover {
|
||||
background: var(--docsearch-searchbox-focus-background);
|
||||
// box-shadow: var(--docsearch-searchbox-shadow);
|
||||
border: 1px solid var(--docsearch-searchbox-border);
|
||||
color: var(--docsearch-text-color);
|
||||
outline: none
|
||||
}
|
||||
|
||||
.DocSearch-Button-Container {
|
||||
align-items: center;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Search-Icon {
|
||||
stroke-width: 1.6
|
||||
}
|
||||
|
||||
.DocSearch-Button .DocSearch-Search-Icon {
|
||||
color: var(--docsearch-text-color)
|
||||
}
|
||||
|
||||
.DocSearch-Button-Placeholder {
|
||||
font-size: 1rem;
|
||||
padding: 0 12px 0 6px
|
||||
}
|
||||
|
||||
.DocSearch-Button-Keys {
|
||||
display: flex;
|
||||
min-width: calc(40px + .8em)
|
||||
}
|
||||
|
||||
.DocSearch-Command-Key {
|
||||
align-items: center;
|
||||
background: var(--docsearch-key-background-color);
|
||||
border-radius: 3px;
|
||||
// box-shadow: var(--docsearch-key-shadow);
|
||||
color: var(--docsearch-key-color);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
position: relative;
|
||||
// padding: 0 0 2px;
|
||||
border: 0;
|
||||
top: 1px;
|
||||
width: 56px
|
||||
}
|
||||
|
||||
.DocSearch-Button-Key {
|
||||
align-items: center;
|
||||
background: var(--docsearch-key-background-color);
|
||||
border-radius: 3px;
|
||||
// box-shadow: var(--docsearch-key-shadow);
|
||||
color: var(--docsearch-key-color);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
position: relative;
|
||||
// padding: 0 0 2px;
|
||||
border: 0;
|
||||
top: 1px;
|
||||
width: 20px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
@media (max-width:768px) {
|
||||
|
||||
.DocSearch-Button-Keys,
|
||||
.DocSearch-Button-Placeholder {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch--active {
|
||||
overflow: hidden !important
|
||||
}
|
||||
|
||||
.DocSearch-Container,
|
||||
.DocSearch-Container * {
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.DocSearch-Container {
|
||||
background-color: var(--docsearch-container-background);
|
||||
height: 100vh;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100vw;
|
||||
z-index: 200
|
||||
}
|
||||
|
||||
.DocSearch-Container a {
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
.DocSearch-Link {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Modal {
|
||||
background: var(--docsearch-modal-background);
|
||||
border-radius: 6px;
|
||||
box-shadow: var(--docsearch-modal-shadow);
|
||||
flex-direction: column;
|
||||
margin: 65px calc(100vw - 925px) auto auto;
|
||||
max-width: var(--docsearch-modal-width);
|
||||
position: relative
|
||||
}
|
||||
|
||||
@media (max-width:1024px) {
|
||||
.DocSearch-Modal {
|
||||
margin: 65px calc(100vw - 640px) auto auto;
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-SearchBar {
|
||||
display: flex;
|
||||
padding: var(--docsearch-spacing) var(--docsearch-spacing) 0
|
||||
}
|
||||
|
||||
.DocSearch-Form {
|
||||
align-items: center;
|
||||
background: var(--docsearch-searchbox-focus-background);
|
||||
border-radius: 4px;
|
||||
box-shadow: var(--docsearch-searchbox-shadow);
|
||||
display: flex;
|
||||
height: var(--docsearch-searchbox-height);
|
||||
margin: 0;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
position: relative;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Input {
|
||||
appearance: none;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
color: var(--docsearch-text-color);
|
||||
flex: 1;
|
||||
font: inherit;
|
||||
font-size: 1.2em;
|
||||
height: 100%;
|
||||
outline: none;
|
||||
padding: 0 0 0 8px;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Input::placeholder {
|
||||
color: var(--docsearch-muted-color);
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.DocSearch-Input::-webkit-search-cancel-button,
|
||||
.DocSearch-Input::-webkit-search-decoration,
|
||||
.DocSearch-Input::-webkit-search-results-button,
|
||||
.DocSearch-Input::-webkit-search-results-decoration {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-LoadingIndicator,
|
||||
.DocSearch-MagnifierLabel,
|
||||
.DocSearch-Reset {
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-MagnifierLabel,
|
||||
.DocSearch-Reset {
|
||||
align-items: center;
|
||||
color: var(--docsearch-highlight-color);
|
||||
display: flex;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,
|
||||
.DocSearch-LoadingIndicator {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Container--Stalled .DocSearch-LoadingIndicator {
|
||||
align-items: center;
|
||||
color: var(--docsearch-highlight-color);
|
||||
display: flex;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Reset {
|
||||
animation: none;
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: var(--docsearch-icon-color);
|
||||
cursor: pointer;
|
||||
right: 0;
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Reset {
|
||||
animation: fade-in .1s ease-in forwards;
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: var(--docsearch-icon-color);
|
||||
cursor: pointer;
|
||||
padding: 2px;
|
||||
right: 0;
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
|
||||
.DocSearch-Reset[hidden] {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Reset:focus {
|
||||
outline: none
|
||||
}
|
||||
|
||||
.DocSearch-Reset:hover {
|
||||
color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-LoadingIndicator svg,
|
||||
.DocSearch-MagnifierLabel svg {
|
||||
height: 24px;
|
||||
width: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Cancel {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
max-height: calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));
|
||||
min-height: var(--docsearch-spacing);
|
||||
overflow-y: auto;
|
||||
overflow-y: overlay;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
scrollbar-color: var(--docsearch-muted-color) var(--docsearch-modal-background);
|
||||
scrollbar-width: thin
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar {
|
||||
width: 12px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar-track {
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar-thumb {
|
||||
background-color: var(--docsearch-muted-color);
|
||||
border: 3px solid var(--docsearch-modal-background);
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Label {
|
||||
font-size: .75em;
|
||||
line-height: 1.6em
|
||||
}
|
||||
|
||||
.DocSearch-Help,
|
||||
.DocSearch-Label {
|
||||
color: var(--docsearch-muted-color)
|
||||
}
|
||||
|
||||
.DocSearch-Help {
|
||||
font-size: .9em;
|
||||
margin: 0;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.DocSearch-Title {
|
||||
font-size: 1.2em
|
||||
}
|
||||
|
||||
.DocSearch-Logo a {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Logo svg {
|
||||
color: var(--docsearch-logo-color);
|
||||
margin-left: 8px
|
||||
}
|
||||
|
||||
.DocSearch-Hits:last-of-type {
|
||||
margin-bottom: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Hits mark {
|
||||
padding: 0;
|
||||
background: none;
|
||||
color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-HitsFooter {
|
||||
color: var(--docsearch-muted-color);
|
||||
display: flex;
|
||||
font-size: .85em;
|
||||
justify-content: center;
|
||||
margin-bottom: var(--docsearch-spacing);
|
||||
padding: var(--docsearch-spacing)
|
||||
}
|
||||
|
||||
.DocSearch-HitsFooter a {
|
||||
border-bottom: 1px solid;
|
||||
color: inherit
|
||||
}
|
||||
|
||||
.DocSearch-Hit {
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
padding-bottom: 4px;
|
||||
position: relative
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Hit--deleting {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit--deleting {
|
||||
opacity: 0;
|
||||
transition: all .25s linear
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Hit--favoriting {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit--favoriting {
|
||||
transform: scale(0);
|
||||
transform-origin: top center;
|
||||
transition: all .25s linear;
|
||||
transition-delay: .25s
|
||||
}
|
||||
|
||||
.DocSearch-Hit a {
|
||||
background: var(--docsearch-hit-background);
|
||||
border-radius: 4px;
|
||||
box-shadow: var(--docsearch-hit-shadow);
|
||||
display: block;
|
||||
padding-left: var(--docsearch-spacing);
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Hit-source {
|
||||
background: var(--docsearch-modal-background);
|
||||
color: var(--docsearch-highlight-color);
|
||||
font-size: .85em;
|
||||
font-weight: 600;
|
||||
line-height: 32px;
|
||||
margin: 0 -4px;
|
||||
padding: 8px 4px 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10
|
||||
}
|
||||
|
||||
.DocSearch-Hit-Tree {
|
||||
color: var(--docsearch-muted-color);
|
||||
height: var(--docsearch-hit-height);
|
||||
opacity: .5;
|
||||
stroke-width: var(--docsearch-icon-stroke-width);
|
||||
width: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] a {
|
||||
background-color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] mark {
|
||||
text-decoration: underline
|
||||
}
|
||||
|
||||
.DocSearch-Hit-Container {
|
||||
align-items: center;
|
||||
color: var(--docsearch-hit-color);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: var(--docsearch-hit-height);
|
||||
padding: 0 var(--docsearch-spacing) 0 0
|
||||
}
|
||||
|
||||
.DocSearch-Hit-icon {
|
||||
height: 20px;
|
||||
width: 20px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action,
|
||||
.DocSearch-Hit-icon {
|
||||
color: var(--docsearch-muted-color);
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: 22px;
|
||||
width: 22px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action svg {
|
||||
display: block;
|
||||
height: 18px;
|
||||
width: 18px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action+.DocSearch-Hit-action {
|
||||
margin-left: 6px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
padding: 2px
|
||||
}
|
||||
|
||||
svg.DocSearch-Hit-Select-Icon {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon {
|
||||
display: block
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
transition: background-color .1s ease-in
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button:focus path,
|
||||
.DocSearch-Hit-action-button:hover path {
|
||||
fill: #fff
|
||||
}
|
||||
|
||||
.DocSearch-Hit-content-wrapper {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
flex-direction: column;
|
||||
font-weight: 600;
|
||||
justify-content: center;
|
||||
line-height: 1.2em;
|
||||
margin: 0 8px;
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Hit-title {
|
||||
font-size: .9em
|
||||
}
|
||||
|
||||
.DocSearch-Hit-path {
|
||||
color: var(--docsearch-muted-color);
|
||||
font-size: .75em
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,
|
||||
.DocSearch-Hit[aria-selected=true] mark {
|
||||
color: var(--docsearch-hit-active-color) !important
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-ErrorScreen,
|
||||
.DocSearch-NoResults,
|
||||
.DocSearch-StartScreen {
|
||||
font-size: .9em;
|
||||
margin: 0 auto;
|
||||
padding: 36px 0;
|
||||
text-align: center;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Screen-Icon {
|
||||
color: var(--docsearch-muted-color);
|
||||
padding-bottom: 12px
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List {
|
||||
display: inline-block;
|
||||
padding-bottom: 24px;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List ul {
|
||||
display: inline-block;
|
||||
padding: 8px 0 0
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List li {
|
||||
list-style-position: inside;
|
||||
list-style-type: "» "
|
||||
}
|
||||
|
||||
.DocSearch-Prefill {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 1em;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-size: 1em;
|
||||
font-weight: 700;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Prefill:focus,
|
||||
.DocSearch-Prefill:hover {
|
||||
outline: none;
|
||||
text-decoration: underline
|
||||
}
|
||||
|
||||
.DocSearch-Footer {
|
||||
align-items: center;
|
||||
background: var(--docsearch-footer-background);
|
||||
border-radius: 0 0 8px 8px;
|
||||
box-shadow: var(--docsearch-footer-shadow);
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
flex-shrink: 0;
|
||||
height: var(--docsearch-footer-height);
|
||||
justify-content: space-between;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
position: relative;
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
z-index: 300
|
||||
}
|
||||
|
||||
.DocSearch-Commands {
|
||||
color: var(--docsearch-muted-color);
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Commands li {
|
||||
align-items: center;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Commands li:not(:last-of-type) {
|
||||
margin-right: .8em
|
||||
}
|
||||
|
||||
.DocSearch-Commands-Key {
|
||||
align-items: center;
|
||||
background: var(--docsearch-key-background-color);
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
height: 20px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
color: var(--docsearch-key-color);
|
||||
border: 0;
|
||||
width: 30px
|
||||
}
|
||||
|
||||
@media (max-width:768px) {
|
||||
:root {
|
||||
--docsearch-spacing: 10px;
|
||||
--docsearch-footer-height: 40px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
height: calc(100% - 92px);
|
||||
}
|
||||
|
||||
.DocSearch-Container {
|
||||
height: 100vh;
|
||||
height: -webkit-fill-available;
|
||||
height: calc(var(--docsearch-vh, 1vh)*100);
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.DocSearch-Footer {
|
||||
border-radius: 0;
|
||||
bottom: 0;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.DocSearch-Hit-content-wrapper {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Modal {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
// height: 100vh;
|
||||
height: -webkit-calc(100% - 72px);
|
||||
height: calc(100% - 72px);
|
||||
margin: 72px 0 0 0;
|
||||
max-width: 100%;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
max-height: calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))
|
||||
}
|
||||
|
||||
.DocSearch-Cancel {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
flex: none;
|
||||
font: inherit;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
margin-left: var(--docsearch-spacing);
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
white-space: nowrap
|
||||
}
|
||||
|
||||
.DocSearch-Commands,
|
||||
.DocSearch-Hit-Tree {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fade-in {
|
||||
0% {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
/*! @docsearch/css Variables 3.3.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */
|
||||
|
||||
:root {
|
||||
--docsearch-primary-color: #5468ff;
|
||||
--docsearch-text-color: #1c1e21;
|
||||
--docsearch-spacing: 12px;
|
||||
--docsearch-icon-stroke-width: 1.4;
|
||||
--docsearch-highlight-color: var(--docsearch-primary-color);
|
||||
--docsearch-muted-color: #969faf;
|
||||
--docsearch-container-background: rgba(101, 108, 133, 0.8);
|
||||
--docsearch-logo-color: #5468ff;
|
||||
--docsearch-modal-width: 560px;
|
||||
--docsearch-modal-height: 600px;
|
||||
--docsearch-modal-background: #f5f6f7;
|
||||
--docsearch-modal-shadow: inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5), 0 3px 8px 0 #555a64;
|
||||
--docsearch-searchbox-height: 56px;
|
||||
--docsearch-searchbox-background: #ebedf0;
|
||||
--docsearch-searchbox-focus-background: #fff;
|
||||
--docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color);
|
||||
--docsearch-hit-height: 56px;
|
||||
--docsearch-hit-color: #444950;
|
||||
--docsearch-hit-active-color: #fff;
|
||||
--docsearch-hit-background: #fff;
|
||||
--docsearch-hit-shadow: 0 1px 3px 0 #d4d9e1;
|
||||
--docsearch-key-gradient: linear-gradient(-225deg, #d5dbe4, #f8f8f8);
|
||||
--docsearch-key-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, 0 1px 2px 1px rgba(30, 35, 90, 0.4);
|
||||
--docsearch-footer-height: 44px;
|
||||
--docsearch-footer-background: #fff;
|
||||
--docsearch-footer-shadow: 0 -1px 0 0 #e0e3e8, 0 -3px 6px 0 rgba(69, 98, 155, 0.12)
|
||||
}
|
||||
|
||||
html[data-theme=dark] {
|
||||
--docsearch-text-color: #f5f6f7;
|
||||
--docsearch-container-background: rgba(9, 10, 17, 0.8);
|
||||
--docsearch-modal-background: #15172a;
|
||||
--docsearch-modal-shadow: inset 1px 1px 0 0 #2c2e40, 0 3px 8px 0 #000309;
|
||||
--docsearch-searchbox-background: #090a11;
|
||||
--docsearch-searchbox-focus-background: #000;
|
||||
--docsearch-hit-color: #bec3c9;
|
||||
--docsearch-hit-shadow: none;
|
||||
--docsearch-hit-background: #090a11;
|
||||
--docsearch-key-gradient: linear-gradient(-26.5deg, #565872, #31355b);
|
||||
--docsearch-key-shadow: inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, 0.3);
|
||||
--docsearch-footer-background: #1e2136;
|
||||
--docsearch-footer-shadow: inset 0 1px 0 0 rgba(73, 76, 106, 0.5), 0 -4px 8px 0 rgba(0, 0, 0, 0.2);
|
||||
--docsearch-logo-color: #fff;
|
||||
--docsearch-muted-color: #7f8497
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
/*! @docsearch/css Button 3.3.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */
|
||||
|
||||
.DocSearch-Button {
|
||||
align-items: center;
|
||||
background: var(--docsearch-searchbox-background);
|
||||
border: 0;
|
||||
border-radius: 40px;
|
||||
color: var(--docsearch-muted-color);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
font-weight: 500;
|
||||
height: 36px;
|
||||
justify-content: space-between;
|
||||
margin: 0 0 0 16px;
|
||||
padding: 0 8px;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.DocSearch-Button:active,
|
||||
.DocSearch-Button:focus,
|
||||
.DocSearch-Button:hover {
|
||||
background: var(--docsearch-searchbox-focus-background);
|
||||
box-shadow: var(--docsearch-searchbox-shadow);
|
||||
color: var(--docsearch-text-color);
|
||||
outline: none
|
||||
}
|
||||
|
||||
.DocSearch-Button-Container {
|
||||
align-items: center;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Search-Icon {
|
||||
stroke-width: 1.6
|
||||
}
|
||||
|
||||
.DocSearch-Button .DocSearch-Search-Icon {
|
||||
color: var(--docsearch-text-color)
|
||||
}
|
||||
|
||||
.DocSearch-Button-Placeholder {
|
||||
font-size: 1rem;
|
||||
padding: 0 12px 0 6px
|
||||
}
|
||||
|
||||
.DocSearch-Button-Keys {
|
||||
display: flex;
|
||||
min-width: calc(40px + .8em)
|
||||
}
|
||||
|
||||
.DocSearch-Button-Key {
|
||||
align-items: center;
|
||||
background: var(--docsearch-key-gradient);
|
||||
border-radius: 3px;
|
||||
box-shadow: var(--docsearch-key-shadow);
|
||||
color: var(--docsearch-muted-color);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
position: relative;
|
||||
padding: 0 0 2px;
|
||||
border: 0;
|
||||
top: -1px;
|
||||
width: 20px
|
||||
}
|
||||
|
||||
@media (max-width:768px) {
|
||||
|
||||
.DocSearch-Button-Keys,
|
||||
.DocSearch-Button-Placeholder {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,611 @@
|
||||
/*! @docsearch/css Modal 3.3.0 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */
|
||||
|
||||
.DocSearch--active {
|
||||
overflow: hidden !important
|
||||
}
|
||||
|
||||
.DocSearch-Container,
|
||||
.DocSearch-Container * {
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.DocSearch-Container {
|
||||
background-color: var(--docsearch-container-background);
|
||||
height: 100vh;
|
||||
left: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100vw;
|
||||
z-index: 200
|
||||
}
|
||||
|
||||
.DocSearch-Container a {
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
.DocSearch-Link {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Modal {
|
||||
background: var(--docsearch-modal-background);
|
||||
border-radius: 6px;
|
||||
box-shadow: var(--docsearch-modal-shadow);
|
||||
flex-direction: column;
|
||||
margin: 60px auto auto;
|
||||
max-width: var(--docsearch-modal-width);
|
||||
position: relative
|
||||
}
|
||||
|
||||
.DocSearch-SearchBar {
|
||||
display: flex;
|
||||
padding: var(--docsearch-spacing) var(--docsearch-spacing) 0
|
||||
}
|
||||
|
||||
.DocSearch-Form {
|
||||
align-items: center;
|
||||
background: var(--docsearch-searchbox-focus-background);
|
||||
border-radius: 4px;
|
||||
box-shadow: var(--docsearch-searchbox-shadow);
|
||||
display: flex;
|
||||
height: var(--docsearch-searchbox-height);
|
||||
margin: 0;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
position: relative;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Input {
|
||||
appearance: none;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
color: var(--docsearch-text-color);
|
||||
flex: 1;
|
||||
font: inherit;
|
||||
font-size: 1.2em;
|
||||
height: 100%;
|
||||
outline: none;
|
||||
padding: 0 0 0 8px;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Input::placeholder {
|
||||
color: var(--docsearch-muted-color);
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.DocSearch-Input::-webkit-search-cancel-button,
|
||||
.DocSearch-Input::-webkit-search-decoration,
|
||||
.DocSearch-Input::-webkit-search-results-button,
|
||||
.DocSearch-Input::-webkit-search-results-decoration {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-LoadingIndicator,
|
||||
.DocSearch-MagnifierLabel,
|
||||
.DocSearch-Reset {
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-MagnifierLabel,
|
||||
.DocSearch-Reset {
|
||||
align-items: center;
|
||||
color: var(--docsearch-highlight-color);
|
||||
display: flex;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,
|
||||
.DocSearch-LoadingIndicator {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Container--Stalled .DocSearch-LoadingIndicator {
|
||||
align-items: center;
|
||||
color: var(--docsearch-highlight-color);
|
||||
display: flex;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Reset {
|
||||
animation: none;
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: var(--docsearch-icon-color);
|
||||
cursor: pointer;
|
||||
right: 0;
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Reset {
|
||||
animation: fade-in .1s ease-in forwards;
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: var(--docsearch-icon-color);
|
||||
cursor: pointer;
|
||||
padding: 2px;
|
||||
right: 0;
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
|
||||
.DocSearch-Reset[hidden] {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Reset:focus {
|
||||
outline: none
|
||||
}
|
||||
|
||||
.DocSearch-Reset:hover {
|
||||
color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-LoadingIndicator svg,
|
||||
.DocSearch-MagnifierLabel svg {
|
||||
height: 24px;
|
||||
width: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Cancel {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
max-height: calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));
|
||||
min-height: var(--docsearch-spacing);
|
||||
overflow-y: auto;
|
||||
overflow-y: overlay;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
scrollbar-color: var(--docsearch-muted-color) var(--docsearch-modal-background);
|
||||
scrollbar-width: thin
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar {
|
||||
width: 12px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar-track {
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown::-webkit-scrollbar-thumb {
|
||||
background-color: var(--docsearch-muted-color);
|
||||
border: 3px solid var(--docsearch-modal-background);
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Label {
|
||||
font-size: .75em;
|
||||
line-height: 1.6em
|
||||
}
|
||||
|
||||
.DocSearch-Help,
|
||||
.DocSearch-Label {
|
||||
color: var(--docsearch-muted-color)
|
||||
}
|
||||
|
||||
.DocSearch-Help {
|
||||
font-size: .9em;
|
||||
margin: 0;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.DocSearch-Title {
|
||||
font-size: 1.2em
|
||||
}
|
||||
|
||||
.DocSearch-Logo a {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Logo svg {
|
||||
color: var(--docsearch-logo-color);
|
||||
margin-left: 8px
|
||||
}
|
||||
|
||||
.DocSearch-Hits:last-of-type {
|
||||
margin-bottom: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Hits mark {
|
||||
background: none;
|
||||
color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-HitsFooter {
|
||||
color: var(--docsearch-muted-color);
|
||||
display: flex;
|
||||
font-size: .85em;
|
||||
justify-content: center;
|
||||
margin-bottom: var(--docsearch-spacing);
|
||||
padding: var(--docsearch-spacing)
|
||||
}
|
||||
|
||||
.DocSearch-HitsFooter a {
|
||||
border-bottom: 1px solid;
|
||||
color: inherit
|
||||
}
|
||||
|
||||
.DocSearch-Hit {
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
padding-bottom: 4px;
|
||||
position: relative
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Hit--deleting {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit--deleting {
|
||||
opacity: 0;
|
||||
transition: all .25s linear
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
.DocSearch-Hit--favoriting {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit--favoriting {
|
||||
transform: scale(0);
|
||||
transform-origin: top center;
|
||||
transition: all .25s linear;
|
||||
transition-delay: .25s
|
||||
}
|
||||
|
||||
.DocSearch-Hit a {
|
||||
background: var(--docsearch-hit-background);
|
||||
border-radius: 4px;
|
||||
box-shadow: var(--docsearch-hit-shadow);
|
||||
display: block;
|
||||
padding-left: var(--docsearch-spacing);
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Hit-source {
|
||||
background: var(--docsearch-modal-background);
|
||||
color: var(--docsearch-highlight-color);
|
||||
font-size: .85em;
|
||||
font-weight: 600;
|
||||
line-height: 32px;
|
||||
margin: 0 -4px;
|
||||
padding: 8px 4px 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10
|
||||
}
|
||||
|
||||
.DocSearch-Hit-Tree {
|
||||
color: var(--docsearch-muted-color);
|
||||
height: var(--docsearch-hit-height);
|
||||
opacity: .5;
|
||||
stroke-width: var(--docsearch-icon-stroke-width);
|
||||
width: 24px
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] a {
|
||||
background-color: var(--docsearch-highlight-color)
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] mark {
|
||||
text-decoration: underline
|
||||
}
|
||||
|
||||
.DocSearch-Hit-Container {
|
||||
align-items: center;
|
||||
color: var(--docsearch-hit-color);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: var(--docsearch-hit-height);
|
||||
padding: 0 var(--docsearch-spacing) 0 0
|
||||
}
|
||||
|
||||
.DocSearch-Hit-icon {
|
||||
height: 20px;
|
||||
width: 20px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action,
|
||||
.DocSearch-Hit-icon {
|
||||
color: var(--docsearch-muted-color);
|
||||
stroke-width: var(--docsearch-icon-stroke-width)
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
height: 22px;
|
||||
width: 22px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action svg {
|
||||
display: block;
|
||||
height: 18px;
|
||||
width: 18px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action+.DocSearch-Hit-action {
|
||||
margin-left: 6px
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
padding: 2px
|
||||
}
|
||||
|
||||
svg.DocSearch-Hit-Select-Icon {
|
||||
display: none
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon {
|
||||
display: block
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
transition: background-color .1s ease-in
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-Hit-action-button:focus path,
|
||||
.DocSearch-Hit-action-button:hover path {
|
||||
fill: #fff
|
||||
}
|
||||
|
||||
.DocSearch-Hit-content-wrapper {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
flex-direction: column;
|
||||
font-weight: 500;
|
||||
justify-content: center;
|
||||
line-height: 1.2em;
|
||||
margin: 0 8px;
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Hit-title {
|
||||
font-size: .9em
|
||||
}
|
||||
|
||||
.DocSearch-Hit-path {
|
||||
color: var(--docsearch-muted-color);
|
||||
font-size: .75em
|
||||
}
|
||||
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,
|
||||
.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,
|
||||
.DocSearch-Hit[aria-selected=true] mark {
|
||||
color: var(--docsearch-hit-active-color) !important
|
||||
}
|
||||
|
||||
@media screen and (prefers-reduced-motion:reduce) {
|
||||
|
||||
.DocSearch-Hit-action-button:focus,
|
||||
.DocSearch-Hit-action-button:hover {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
transition: none
|
||||
}
|
||||
}
|
||||
|
||||
.DocSearch-ErrorScreen,
|
||||
.DocSearch-NoResults,
|
||||
.DocSearch-StartScreen {
|
||||
font-size: .9em;
|
||||
margin: 0 auto;
|
||||
padding: 36px 0;
|
||||
text-align: center;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Screen-Icon {
|
||||
color: var(--docsearch-muted-color);
|
||||
padding-bottom: 12px
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List {
|
||||
display: inline-block;
|
||||
padding-bottom: 24px;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List ul {
|
||||
display: inline-block;
|
||||
padding: 8px 0 0
|
||||
}
|
||||
|
||||
.DocSearch-NoResults-Prefill-List li {
|
||||
list-style-position: inside;
|
||||
list-style-type: "» "
|
||||
}
|
||||
|
||||
.DocSearch-Prefill {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
border-radius: 1em;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-size: 1em;
|
||||
font-weight: 700;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Prefill:focus,
|
||||
.DocSearch-Prefill:hover {
|
||||
outline: none;
|
||||
text-decoration: underline
|
||||
}
|
||||
|
||||
.DocSearch-Footer {
|
||||
align-items: center;
|
||||
background: var(--docsearch-footer-background);
|
||||
border-radius: 0 0 8px 8px;
|
||||
box-shadow: var(--docsearch-footer-shadow);
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
flex-shrink: 0;
|
||||
height: var(--docsearch-footer-height);
|
||||
justify-content: space-between;
|
||||
padding: 0 var(--docsearch-spacing);
|
||||
position: relative;
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
z-index: 300
|
||||
}
|
||||
|
||||
.DocSearch-Commands {
|
||||
color: var(--docsearch-muted-color);
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.DocSearch-Commands li {
|
||||
align-items: center;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.DocSearch-Commands li:not(:last-of-type) {
|
||||
margin-right: .8em
|
||||
}
|
||||
|
||||
.DocSearch-Commands-Key {
|
||||
align-items: center;
|
||||
background: var(--docsearch-key-gradient);
|
||||
border-radius: 2px;
|
||||
box-shadow: var(--docsearch-key-shadow);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
padding: 0 0 1px;
|
||||
color: var(--docsearch-muted-color);
|
||||
border: 0;
|
||||
width: 20px
|
||||
}
|
||||
|
||||
@media (max-width:768px) {
|
||||
:root {
|
||||
--docsearch-spacing: 10px;
|
||||
--docsearch-footer-height: 40px
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Container {
|
||||
height: 100vh;
|
||||
height: -webkit-fill-available;
|
||||
height: calc(var(--docsearch-vh, 1vh)*100);
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.DocSearch-Footer {
|
||||
border-radius: 0;
|
||||
bottom: 0;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.DocSearch-Hit-content-wrapper {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 80%
|
||||
}
|
||||
|
||||
.DocSearch-Modal {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
height: 100vh;
|
||||
height: -webkit-fill-available;
|
||||
height: calc(var(--docsearch-vh, 1vh)*100);
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.DocSearch-Dropdown {
|
||||
max-height: calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))
|
||||
}
|
||||
|
||||
.DocSearch-Cancel {
|
||||
appearance: none;
|
||||
background: none;
|
||||
border: 0;
|
||||
color: var(--docsearch-highlight-color);
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
flex: none;
|
||||
font: inherit;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
margin-left: var(--docsearch-spacing);
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
white-space: nowrap
|
||||
}
|
||||
|
||||
.DocSearch-Commands,
|
||||
.DocSearch-Hit-Tree {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fade-in {
|
||||
0% {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,143 @@
|
||||
/* Feedback Widget */
|
||||
|
||||
:root {
|
||||
--emoticon-container-border-color: var(--gray-500);
|
||||
--emoticon-color: var(--gray-500);
|
||||
--emoticon-checked-color: var(--primary);
|
||||
--emoticon-checked--bg-color: var(--primary-100);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--emoticon-container-border-color: var(--gray-700);
|
||||
--emoticon-color: var(--gray-600);
|
||||
--emoticon-checked-color: var(--primary-300);
|
||||
--emoticon-checked--bg-color: var(--gray-800);
|
||||
}
|
||||
|
||||
#feedback-init {
|
||||
transition: opacity 0.5s;
|
||||
}
|
||||
|
||||
#feedback-form-pos,
|
||||
#feedback-form-neg,
|
||||
#feedback-end,
|
||||
#feedback-emoji-end,
|
||||
#feedback-submit-container,
|
||||
#feedback-emoji-submit-container {
|
||||
height: 0;
|
||||
line-height:0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
transition: opacity 0.5s;
|
||||
|
||||
&.is-visible {
|
||||
height: auto;
|
||||
line-height: inherit;
|
||||
overflow: inherit;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.form-check {
|
||||
margin-bottom: 0.525rem;
|
||||
}
|
||||
|
||||
.form-check-label,
|
||||
.form-check-input {
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
#feedback-emoji-end {
|
||||
padding: 0;
|
||||
|
||||
&.is-visible {
|
||||
padding: 10px 30px;
|
||||
width: 40vh;
|
||||
}
|
||||
}
|
||||
|
||||
.feedback-radio-desc {
|
||||
color: var(--text-muted);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.feedback-textarea {
|
||||
width: 50%;
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-default);
|
||||
background: var(--card-bg);
|
||||
resize: none;
|
||||
border: solid 1px;
|
||||
border-radius: 4px ;
|
||||
border-color: var(--card-border-color);
|
||||
@media (max-width:578px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#feedback-widget-emoticon {
|
||||
border: 1px solid var(--emoticon-container-border-color);
|
||||
border-radius: 30px;
|
||||
padding: 1px 5px;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
#feedback-cta {
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
#text-wrapper {
|
||||
|
||||
height: 0;
|
||||
line-height:0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
transition: opacity 0.5s;
|
||||
|
||||
&.is-visible {
|
||||
height: auto;
|
||||
line-height: inherit;
|
||||
overflow: inherit;
|
||||
opacity: 1;
|
||||
|
||||
padding: 10px 3px 0px 3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.feedback-textarea-emoji {
|
||||
width: 100%;
|
||||
font-size: 0.875rem;
|
||||
color: var(--text-default);
|
||||
background: var(--card-bg);
|
||||
resize: none;
|
||||
border: solid 1px;
|
||||
border-radius: 4px ;
|
||||
border-color: var(--card-border-color);
|
||||
}
|
||||
|
||||
.radio-emoji {
|
||||
|
||||
>input[type="radio"] {
|
||||
display: none;
|
||||
|
||||
+label {
|
||||
background: transparent;
|
||||
color: var(--emoticon-color);
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
transition:background .2s,border-color .2s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.radio-emoji input[type="radio"]:checked + label {
|
||||
background: var(--emoticon-checked--bg-color);
|
||||
color: var(--emoticon-checked-color);
|
||||
}
|
||||
@@ -0,0 +1,259 @@
|
||||
/* FlexSearch */
|
||||
|
||||
:root {
|
||||
--flexsearch-container-bg-color: var(--gray-100);
|
||||
--flexsearch-after-bg-color: var(--primary);
|
||||
--flexsearch-after-color: var(--white);
|
||||
--flexsearch-button-hover-bg-color: none;
|
||||
--flexsearch-key-bg-color: var(--primary);
|
||||
--flexsearch-key-color: #fff;
|
||||
--flexsearch-suggestion-bg-color: var(--white);
|
||||
--flexsearch-suggestion-link-hover-bg-color: #f5f6f7;
|
||||
--flexsearch-suggestion-title-color: var(--primary);
|
||||
--flexsearch-suggestion-title-border-color: var(--gray-300);
|
||||
--flexsearch-suggestion-desc-color: var(--text-default);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--flexsearch-container-bg-color: var(--dark-secondary);
|
||||
--flexsearch-after-bg-color: hsl(var(--primary-hsl),0.15);
|
||||
--flexsearch-after-color: var(--primary-200);
|
||||
--flexsearch-button-hover-bg-color: var(--black);
|
||||
--flexsearch-key-bg-color: hsl(var(--primary-hsl), 0.15);
|
||||
--flexsearch-key-color: var(--primary-200);
|
||||
--flexsearch-suggestion-bg-color: var(--dark-secondary);
|
||||
--flexsearch-suggestion-link-hover-bg-color: var(--gray-800);
|
||||
--flexsearch-suggestion-title-color: var(--primary-200);
|
||||
--flexsearch-suggestion-title-border-color: var(--gray-700);
|
||||
--flexsearch-suggestion-desc-color: var(--gray-300);
|
||||
}
|
||||
|
||||
#FlexSearchCollapse {
|
||||
transition: 0.05s ease;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.flexsearch-container {
|
||||
background-color: var(--flexsearch-container-bg-color);
|
||||
padding: 0.8rem;
|
||||
.form-control {
|
||||
border: 2px solid var(--primary);
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.flexsearch-container {
|
||||
border-radius: 0 0 4px 0;
|
||||
}
|
||||
|
||||
.flexsearch {
|
||||
min-width: 500px;
|
||||
width: 500px;
|
||||
}
|
||||
}
|
||||
|
||||
.flexsearch-keymap {
|
||||
padding: 0 0 0.8rem 0.5rem;
|
||||
list-style: none;
|
||||
display: flex;
|
||||
|
||||
.flexsearch-button-cmd-key {
|
||||
height: 20px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
li:not(:last-of-type) {
|
||||
margin-right: 0.8rem;
|
||||
}
|
||||
|
||||
li {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.flexsearch-keymap {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.flexsearch-key-label {
|
||||
color: var(--form-control-placeholder-color);
|
||||
font-size: 0.75em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
|
||||
.flexsearch-button-keys {
|
||||
display: flex;
|
||||
min-width: calc(40px + .8em);
|
||||
}
|
||||
|
||||
.flexsearch-button-cmd-key {
|
||||
align-items: center;
|
||||
background: var(--flexsearch-key-bg-color);
|
||||
border-radius: 3px;
|
||||
color: var(--flexsearch-key-color);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
position: relative;
|
||||
border: 0;
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
.flexsearch-button-key {
|
||||
align-items: center;
|
||||
background: var(--flexsearch-key-bg-color);
|
||||
border-radius: 3px;
|
||||
color: var(--flexsearch-key-color);
|
||||
display: flex;
|
||||
height: 18px;
|
||||
justify-content: center;
|
||||
margin-right: .4em;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
border: 0;
|
||||
width: 20px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#flexsearch-button {
|
||||
display: flex;
|
||||
height: 36px;
|
||||
padding: 0 8px;
|
||||
margin: 0 0 0 16px;
|
||||
font-weight: 400;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-radius: 4px;
|
||||
|
||||
.flexsearch-button-placeholder {
|
||||
color: var(--form-control-placeholder-color);
|
||||
}
|
||||
}
|
||||
|
||||
#flexsearch-button:hover {
|
||||
background: var(--flexsearch-button-hover-bg-color) !important;
|
||||
|
||||
.flexsearch-button-placeholder {
|
||||
color: var(--text-default);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.flexsearch::after {
|
||||
right: 0.5125rem
|
||||
}
|
||||
}
|
||||
|
||||
#suggestions {
|
||||
position: absolute;
|
||||
background-color: var(--flexsearch-suggestion-bg-color);
|
||||
left: 0;
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: thin;
|
||||
&::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(155, 155, 155, 0.5);
|
||||
border-radius: 2px;
|
||||
border: transparent;
|
||||
}
|
||||
margin-top: 0.5rem;
|
||||
// width: calc(100vw - 0.3rem);
|
||||
max-width: calc(100vw - 0.15rem);
|
||||
z-index: 999
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#suggestions {
|
||||
// right: -2rem
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#suggestions {
|
||||
left: 0
|
||||
}
|
||||
}
|
||||
|
||||
#suggestions a,
|
||||
.suggestion__no-results {
|
||||
padding: 0.75rem;
|
||||
margin: 0 0.5rem
|
||||
}
|
||||
|
||||
#suggestions a {
|
||||
display: block;
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
#suggestions a:focus {
|
||||
background: var(--flexsearch-suggestion-link-hover-bg-color);
|
||||
border-radius: 4px;
|
||||
outline: 0
|
||||
}
|
||||
|
||||
#suggestions div:not(:first-child) {
|
||||
// border-top: 1px dashed #e9ecef
|
||||
}
|
||||
|
||||
#suggestions div:first-child {
|
||||
margin-top: 0.5rem
|
||||
}
|
||||
|
||||
#suggestions div:last-child {
|
||||
margin-bottom: 0.5rem
|
||||
}
|
||||
|
||||
#suggestions a:hover {
|
||||
background: var(--flexsearch-suggestion-link-hover-bg-color);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
#suggestions span {
|
||||
display: flex;
|
||||
font-size: 1rem
|
||||
}
|
||||
|
||||
.suggestion__title {
|
||||
font-weight: 700;
|
||||
color: var(--flexsearch-suggestion-title-color);
|
||||
}
|
||||
|
||||
.suggestion__description,
|
||||
.suggestion__no-results {
|
||||
color: var(--flexsearch-suggestion-desc-color);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
#suggestions {
|
||||
width: 500px;
|
||||
max-width: 500px
|
||||
}
|
||||
|
||||
#suggestions a {
|
||||
display: flex
|
||||
}
|
||||
|
||||
.suggestion__title {
|
||||
width: 9rem;
|
||||
padding-right: 1rem;
|
||||
border-right: 1px solid var(--flexsearch-suggestion-title-border-color);
|
||||
display: inline-block;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.suggestion__description {
|
||||
width: 20.1rem;
|
||||
padding-left: 1rem
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
// Google Material Icon Font via
|
||||
// https://github.com/marella/material-symbols/tree/main/material-symbols
|
||||
|
||||
@font-face {
|
||||
font-family: 'Material Symbols Outlined';
|
||||
font-weight: 400 700;
|
||||
font-display: block;
|
||||
font-style: normal;
|
||||
src: local('Material Symbols Outlined'), local('Material Icons'), local('MaterialIcons-Outlined'),
|
||||
url('../fonts/material-symbols-outlined.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
// url('../fonts/material-symbols-outlined.woff') format('woff'); /* Modern Browsers */
|
||||
}
|
||||
1389
themes/lotusdocs/assets/docs/scss/custom/plugins/katex/_katex.scss
Normal file
1389
themes/lotusdocs/assets/docs/scss/custom/plugins/katex/_katex.scss
Normal file
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,41 @@
|
||||
/* Mermaid */
|
||||
|
||||
.docs-content .main-content pre {
|
||||
|
||||
&.mermaid {
|
||||
background-color: transparent !important;
|
||||
text-align: center !important;
|
||||
.messageText {
|
||||
fill: var(--text-default) !important;
|
||||
}
|
||||
.messageLine0,
|
||||
.messageLine1 {
|
||||
stroke: var(--text-default) !important;
|
||||
}
|
||||
#arrowhead path,
|
||||
#crosshead path {
|
||||
fill: var(--text-default) !important;
|
||||
stroke: var(--text-default) !important;
|
||||
}
|
||||
.edgePaths path {
|
||||
stroke: var(--text-default) !important;
|
||||
}
|
||||
.marker {
|
||||
fill: var(--text-default) !important;
|
||||
stroke: var(--text-default) !important;
|
||||
}
|
||||
.grid .tick {
|
||||
stroke: var(--text-default) !important;
|
||||
|
||||
text {
|
||||
fill: var(--text-default) !important;
|
||||
}
|
||||
}
|
||||
line {
|
||||
stroke: var(--text-default) !important;
|
||||
}
|
||||
text {
|
||||
fill: var(--text-default) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,478 @@
|
||||
/* PrismJS 1.29.0 */
|
||||
|
||||
// Fit codeblock container to contents
|
||||
// .prism-codeblock {
|
||||
// width: fit-content;
|
||||
// max-width: 100%;
|
||||
// }
|
||||
|
||||
code {
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.docs-content .main-content pre {
|
||||
background-color: var(--prism-code-bg) !important;
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
border: none !important;
|
||||
font-family: $font-family-monospace;
|
||||
font-size: 0.8rem;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-rendering: optimizeLegibility;
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--prism-code-scrollbar-thumb-color) var(--prism-code-bg);
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
height: 5px;
|
||||
background: var(--prism-code-bg);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: var(--prism-code-scrollbar-thumb-color);
|
||||
}
|
||||
}
|
||||
|
||||
pre[data-line] {
|
||||
position: relative;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.line-highlight:first-of-type {
|
||||
margin-top: 0em;
|
||||
}
|
||||
|
||||
.line-highlight:last-of-type {
|
||||
margin-top: 0em !important;
|
||||
}
|
||||
|
||||
.line-highlight {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: inherit 0;
|
||||
margin-top: 0em; /* Same as .prism’s padding-top */
|
||||
|
||||
background: hsla(24, 20%, 50%,.08);
|
||||
background: linear-gradient(to right, hsla(24, 20%, 50%,.1) 70%, hsla(24, 20%, 50%, 0));
|
||||
|
||||
pointer-events: none;
|
||||
|
||||
line-height: inherit;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.line-highlight {
|
||||
/*
|
||||
* This will prevent browsers from replacing the background color with white.
|
||||
* It's necessary because the element is layered on top of the displayed code.
|
||||
*/
|
||||
-webkit-print-color-adjust: exact;
|
||||
color-adjust: exact;
|
||||
}
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
content: attr(data-start);
|
||||
position: absolute;
|
||||
top: 0.14em;
|
||||
left: .6em;
|
||||
min-width: 1.5em;
|
||||
padding: 0 .5em;
|
||||
// background-color: var(--blue-400);
|
||||
color: hsl(24, 20%, 95%);
|
||||
font: bold 95%/1.3 sans-serif;
|
||||
text-align: center;
|
||||
vertical-align: .3em;
|
||||
border-radius: 4px;
|
||||
text-shadow: none;
|
||||
// box-shadow: 0 1px white;
|
||||
}
|
||||
|
||||
.line-highlight[data-end]:after {
|
||||
content: attr(data-end);
|
||||
top: auto;
|
||||
bottom: .14em;
|
||||
}
|
||||
|
||||
.line-numbers .line-highlight {
|
||||
margin-top: 0em !important;
|
||||
}
|
||||
|
||||
.line-numbers .line-highlight:before,
|
||||
.line-numbers .line-highlight:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
// .line-numbers .line-highlight:first-of-type,
|
||||
// .line-numbers .line-highlight:last-of-type {
|
||||
// margin-top: 0 !important;
|
||||
// }
|
||||
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows {
|
||||
pointer-events: all;
|
||||
}
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows > span:before {
|
||||
cursor: pointer;
|
||||
}
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows > span:hover:before {
|
||||
background-color: rgba(128, 128, 128, .2);
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers {
|
||||
position: relative;
|
||||
padding-left: 0;
|
||||
counter-reset: linenumber;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers > code {
|
||||
position: relative;
|
||||
white-space: inherit;
|
||||
padding: 0.3rem 3.0rem 1.25rem 3rem !important;
|
||||
}
|
||||
|
||||
.line-numbers .line-numbers-rows {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
top: .40em;
|
||||
font-size: 100%;
|
||||
left: 0em;
|
||||
width: 3em; /* works for line-numbers below 1000 lines */
|
||||
letter-spacing: -1px;
|
||||
// border-right: 1px solid #999;
|
||||
border-right: none;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.line-numbers-rows > span {
|
||||
display: block;
|
||||
counter-increment: linenumber;
|
||||
}
|
||||
|
||||
.line-numbers-rows > span:before {
|
||||
content: counter(linenumber);
|
||||
color: var(--gray-400);
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
div.code-toolbar {
|
||||
position: relative;
|
||||
margin: 16px 0;
|
||||
padding-top: 1.25rem !important;
|
||||
background-color: var(--prism-code-bg);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
div.prism-codeblock.hl_lines .code-toolbar {
|
||||
padding-top: 1.25rem !important;
|
||||
}
|
||||
|
||||
div.prism-shortcode.data-line .code-toolbar {
|
||||
padding-top: 1.25rem !important;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
top: .4em;
|
||||
right: .4em;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
div.code-toolbar:hover > .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Separate line b/c rules are thrown out if selector is invalid.
|
||||
IE11 and old Edge versions don't support :focus-within. */
|
||||
div.code-toolbar:focus-within > .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button {
|
||||
background: none;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
line-height: normal;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
-webkit-user-select: none; /* for button */
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
|
||||
&.copy-to-clipboard-button {
|
||||
box-shadow: none;
|
||||
background: var(--prism-code-bg);
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
// Custom Copy, Copied and Error Icons
|
||||
[data-copy-state="copy"] span:empty::before {
|
||||
content: "";
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M9 43.95q-1.2 0-2.1-.9-.9-.9-.9-2.1V10.8h3v30.15h23.7v3Zm6-6q-1.2 0-2.1-.9-.9-.9-.9-2.1v-28q0-1.2.9-2.1.9-.9 2.1-.9h22q1.2 0 2.1.9.9.9.9 2.1v28q0 1.2-.9 2.1-.9.9-2.1.9Zm0-3h22v-28H15v28Zm0 0v-28 28Z'/%3E%3C/svg%3E");
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M9 43.95q-1.2 0-2.1-.9-.9-.9-.9-2.1V10.8h3v30.15h23.7v3Zm6-6q-1.2 0-2.1-.9-.9-.9-.9-2.1v-28q0-1.2.9-2.1.9-.9 2.1-.9h22q1.2 0 2.1.9.9.9.9 2.1v28q0 1.2-.9 2.1-.9.9-2.1.9Zm0-3h22v-28H15v28Zm0 0v-28 28Z'/%3E%3C/svg%3E");
|
||||
-webkit-mask-size: contain;
|
||||
mask-size: contain;
|
||||
// background-color: var(--gray-400);
|
||||
display: block;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
// [data-copy-state="copy"] span:empty:hover::before {
|
||||
// background-color: var(--white);
|
||||
// }
|
||||
|
||||
[data-copy-state="copy-success"] span:empty::before {
|
||||
content: "";
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M18.9 35.7 7.7 24.5l2.15-2.15 9.05 9.05 19.2-19.2 2.15 2.15Z'/%3E%3C/svg%3E");
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M18.9 35.7 7.7 24.5l2.15-2.15 9.05 9.05 19.2-19.2 2.15 2.15Z'/%3E%3C/svg%3E");
|
||||
-webkit-mask-size: contain;
|
||||
mask-size: contain;
|
||||
// background-color: var(--emerald-200);
|
||||
display: block;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
[data-copy-state="copy-error"] span:empty::before {
|
||||
content: "";
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M24 34q.7 0 1.175-.475.475-.475.475-1.175 0-.7-.475-1.175Q24.7 30.7 24 30.7q-.7 0-1.175.475-.475.475-.475 1.175 0 .7.475 1.175Q23.3 34 24 34Zm-1.35-7.65h3V13.7h-3ZM24 44q-4.1 0-7.75-1.575-3.65-1.575-6.375-4.3-2.725-2.725-4.3-6.375Q4 28.1 4 23.95q0-4.1 1.575-7.75 1.575-3.65 4.3-6.35 2.725-2.7 6.375-4.275Q19.9 4 24.05 4q4.1 0 7.75 1.575 3.65 1.575 6.35 4.275 2.7 2.7 4.275 6.35Q44 19.85 44 24q0 4.1-1.575 7.75-1.575 3.65-4.275 6.375t-6.35 4.3Q28.15 44 24 44Zm.05-3q7.05 0 12-4.975T41 23.95q0-7.05-4.95-12T24 7q-7.05 0-12.025 4.95Q7 16.9 7 24q0 7.05 4.975 12.025Q16.95 41 24.05 41ZM24 24Z'/%3E%3C/svg%3E");
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48' width='48' viewBox='0 0 48 48'%3E%3Cpath d='M24 34q.7 0 1.175-.475.475-.475.475-1.175 0-.7-.475-1.175Q24.7 30.7 24 30.7q-.7 0-1.175.475-.475.475-.475 1.175 0 .7.475 1.175Q23.3 34 24 34Zm-1.35-7.65h3V13.7h-3ZM24 44q-4.1 0-7.75-1.575-3.65-1.575-6.375-4.3-2.725-2.725-4.3-6.375Q4 28.1 4 23.95q0-4.1 1.575-7.75 1.575-3.65 4.3-6.35 2.725-2.7 6.375-4.275Q19.9 4 24.05 4q4.1 0 7.75 1.575 3.65 1.575 6.35 4.275 2.7 2.7 4.275 6.35Q44 19.85 44 24q0 4.1-1.575 7.75-1.575 3.65-4.275 6.375t-6.35 4.3Q28.15 44 24 44Zm.05-3q7.05 0 12-4.975T41 23.95q0-7.05-4.95-12T24 7q-7.05 0-12.025 4.95Q7 16.9 7 24q0 7.05 4.975 12.025Q16.95 41 24.05 41ZM24 24Z'/%3E%3C/svg%3E");
|
||||
-webkit-mask-size: contain;
|
||||
mask-size: contain;
|
||||
background-color: var(--cardinal-300);
|
||||
display: block;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span {
|
||||
color: #bbb;
|
||||
font-size: .8em;
|
||||
padding: 4px;
|
||||
background: rgba(224, 224, 224, 0.2);
|
||||
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a:focus,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button:focus,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span:focus {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.token.treeview-part .entry-line {
|
||||
position: relative;
|
||||
text-indent: -99em;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: 1.2em;
|
||||
}
|
||||
.token.treeview-part .entry-line:before,
|
||||
.token.treeview-part .line-h:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
.token.treeview-part .line-h:before,
|
||||
.token.treeview-part .line-v:before {
|
||||
border-left: 1px solid #ccc;
|
||||
}
|
||||
.token.treeview-part .line-v-last:before {
|
||||
height: 50%;
|
||||
border-left: 1px solid #ccc;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
.token.treeview-part .line-h:after {
|
||||
height: 50%;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
.token.treeview-part .entry-name {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
.token.treeview-part .entry-name.dotfile {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* @GENERATED-FONT */
|
||||
@font-face {
|
||||
font-family: "PrismTreeview";
|
||||
/**
|
||||
* This font is generated from the .svg files in the `icons` folder. See the `treeviewIconFont` function in
|
||||
* `gulpfile.js/index.js` for more information.
|
||||
*
|
||||
* Use the following escape sequences to refer to a specific icon:
|
||||
*
|
||||
* - \ea01 file
|
||||
* - \ea02 folder
|
||||
* - \ea03 image
|
||||
* - \ea04 audio
|
||||
* - \ea05 video
|
||||
* - \ea06 text
|
||||
* - \ea07 code
|
||||
* - \ea08 archive
|
||||
* - \ea09 pdf
|
||||
* - \ea0a excel
|
||||
* - \ea0b powerpoint
|
||||
* - \ea0c word
|
||||
*/
|
||||
src: url("data:application/font-woff;base64,d09GRgABAAAAAAgYAAsAAAAAEGAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAAPwAAAFY1UkH9Y21hcAAAAYQAAAB/AAACCtvO7yxnbHlmAAACBAAAA+MAAAlACm1VqmhlYWQAAAXoAAAAKgAAADZfxj5jaGhlYQAABhQAAAAYAAAAJAFbAMFobXR4AAAGLAAAAA4AAAA0CGQAAGxvY2EAAAY8AAAAHAAAABwM9A9CbWF4cAAABlgAAAAfAAAAIAEgAHZuYW1lAAAGeAAAATcAAAJSfUrk+HBvc3QAAAewAAAAZgAAAIka0DSfeJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGRYyjiBgZWBgaGQoRZISkLpUAYOBj0GBiYGVmYGrCAgzTWFweEV4ysehs1ArgDDFgZGIA3CDAB2tQjAAHic7ZHLEcMwCESfLCz/VEoKSEE5parURxMOC4c0Ec283WGFdABgBXrwCAzam4bOK9KWeefM3Hhmjyn3ed+hTRq1pS7Ra/HjYGPniHcXMy4G/zNTP7/KW5HTXArkvdBW3ArN19dCG/NRIN8K5HuB/CiQn4U26VeBfBbML9NEH78AeJyVVc1u20YQ3pn905JcSgr/YsuSDTEg3cR1bFEkYyS1HQcQ2jQF2hot6vYSoECKnnPLA/SWUy9NTr31Bfp+6azsNI0SGiolzu7ODnfn+2Z2lnHG3rxhr9nfLGKbLGesncAYYnUHpsVnMG/uwyzNdFIVd6HI6twp8+R3LpT4TSglLoTHwwJgG2/dFvKrl9yI507/p5CCq4LTxB/PlPjkFaMHnWB/0S9je7RTPS+utnGtom1T2q5pk/e3H0M1S18rsXAL7wgpxQuhAmteGGvNjmcfGXuwnFNOPCXxeOGmnjrBLWNyBeNtVq2Hs03yus1aPS3mzSyNVSfu588iW1Q93x/4fjcHn+5EkS2tMxr4xIRa8ese+4L9uKZnxEqs8+ldyN9atU02a5t5uQ8hZGms1QTKpaKYqnipiNNOAIeIADC0JNEOYY+jtSgFoOchiAjRGFACpUTRje8bwIYWGCDEgENY8MEu9bnCYCdAxftoNg0KiSpUtPaHcanYwzXRu6T4r40b5npal3V7UHWCPJW9niyl1vIHgoujEXZjudBkeWkOeMQBRmbEPhKzij1i52t6/TadL+3q7H0U1eq4E8cG4gIIwQLx8VX7ToPXgPrehVc5QXHR7gMSmwjKfaYAP4KvZV+yn9bE18y2IY37LvtyrSg3i7ZK++B603ndlg/gBJpZRsfpBI6hyiaQ6FjlnThz8lAC3LgBIMnXDOAXxBQ4SIgiEhx2AcGCAwAhwjXRpCQms42bwAUt75BvAwgONzdgOfWEwzk4Ylzj4mz+5YEzzXzWX9aNlk7ot65y5QnBHsNlm6zDTu7sspRqG4V+fgJ1lVBZ07Nm7s5nemo3Lf3PO7iwtnroQ5/YDGwPRUip6fV6L+27p+wCHwSvPs85UnHqId8NAn5IBsKdv95KrL9m31Gsf2a/rluDslk1y1J9GE+LUmmVT/OyOHaFKGnapt2H5XeJTmKd6qYNoVVZOy+pWzr7rMip3ndG/4mQSoUcMbAqG/YNIAdXhkAqTVruXhocSKN0iS4Rwj7vSS4fcF/La07BfeQSuRAcFeW+9igjwPhhYPpGCBCBHhxiKMyFMFT7ziRH7RtfIWdiha+TdW+Rqs7bLHdN2ZJIKl0um0x3op9saYr0REeRdj09pl43pMzz4tjztrY8L4o8bzT+oLY27PR/eFtXs/YY5vtwB5Iqad14eYN0ujveMaGWqkdU3TKbQSC5Uvxaf4fA7SAQ3r2tEfIhd4duld91bwMisjqBw22orthNcroXl7KqO1329HBgAexgoCfGAwiDPoBnriki3lmNojrzvD0tjo6E3vPYP6E2BMIAeJxjYGRgYADiY8t3FsTz23xl4GbYzIAB/v9nWM6wBcjgYGAC8QH+QQhZAAB4nGNgZGBg2MzAACeXMzAyoAJeADPyAh14nGNgAILNpGEA0fgIZQAAAAAAAAA2AHIAvgE+AZgCCAKMAv4DlgPsBEYEoHicY2BkYGDgZchi4GQAASYg5gJCBob/YD4DABTSAZcAeJx9kU1uwjAQhV/4qwpqhdSqi67cTTeVEmBXDgBbhBD7AHYISuLUMSD2PUdP0HNwjp6i676k3qQS9Ujjb968mYUNoI8zPJTHw02Vy9PAFatfbpLuHbfIT47b6MF33KH+6riLF0wc93CHN27wWtdUHvHuuIFbfDhuUv903CKfHbfxgC/HHerfjrtYen3HPTx7ambiIl0YKQ+xPM5ltE9CU9NqxVKaItaZGPqDmj6VmTShlRuxOoniEI2sVUIZnYqJzqxMEi1yo3dybf2ttfk4CJTT/bVOMYNBjAIpFiTJOLCWOGLOHGGPBCE7l32XO0tmw04MjQwCQ7774B//lDmrZkJY3hvOrHBiLuiJMKJqoVgrejQ3CP5Yubt0JwxNJa96Oypr6j621VSOMQKG+uP36eKmHylcb0MAeJxtwdEOgjAMBdBeWEFR/Mdl7bTJtMsygc/nwVfPoYF+QP+tGDAigDFhxgVXLLjhjhUPCtmKTtmLaGN7x6dy/Io5bybqoevRQ3LRObb0sk3HKpn1SFqW6ru26vbpYfcmRCccJhqsAAA=")
|
||||
format("woff");
|
||||
}
|
||||
|
||||
.token.treeview-part .entry-name:before {
|
||||
content: "\ea01";
|
||||
font-family: "PrismTreeview";
|
||||
font-size: inherit;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
width: 2.5ex;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.token.treeview-part .entry-name.dir:before {
|
||||
content: "\ea02";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-bmp:before,
|
||||
.token.treeview-part .entry-name.ext-eps:before,
|
||||
.token.treeview-part .entry-name.ext-gif:before,
|
||||
.token.treeview-part .entry-name.ext-jpe:before,
|
||||
.token.treeview-part .entry-name.ext-jpg:before,
|
||||
.token.treeview-part .entry-name.ext-jpeg:before,
|
||||
.token.treeview-part .entry-name.ext-png:before,
|
||||
.token.treeview-part .entry-name.ext-svg:before,
|
||||
.token.treeview-part .entry-name.ext-tiff:before {
|
||||
content: "\ea03";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-cfg:before,
|
||||
.token.treeview-part .entry-name.ext-conf:before,
|
||||
.token.treeview-part .entry-name.ext-config:before,
|
||||
.token.treeview-part .entry-name.ext-csv:before,
|
||||
.token.treeview-part .entry-name.ext-ini:before,
|
||||
.token.treeview-part .entry-name.ext-log:before,
|
||||
.token.treeview-part .entry-name.ext-md:before,
|
||||
.token.treeview-part .entry-name.ext-nfo:before,
|
||||
.token.treeview-part .entry-name.ext-txt:before {
|
||||
content: "\ea06";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-asp:before,
|
||||
.token.treeview-part .entry-name.ext-aspx:before,
|
||||
.token.treeview-part .entry-name.ext-c:before,
|
||||
.token.treeview-part .entry-name.ext-cc:before,
|
||||
.token.treeview-part .entry-name.ext-cpp:before,
|
||||
.token.treeview-part .entry-name.ext-cs:before,
|
||||
.token.treeview-part .entry-name.ext-css:before,
|
||||
.token.treeview-part .entry-name.ext-h:before,
|
||||
.token.treeview-part .entry-name.ext-hh:before,
|
||||
.token.treeview-part .entry-name.ext-htm:before,
|
||||
.token.treeview-part .entry-name.ext-html:before,
|
||||
.token.treeview-part .entry-name.ext-jav:before,
|
||||
.token.treeview-part .entry-name.ext-java:before,
|
||||
.token.treeview-part .entry-name.ext-js:before,
|
||||
.token.treeview-part .entry-name.ext-php:before,
|
||||
.token.treeview-part .entry-name.ext-rb:before,
|
||||
.token.treeview-part .entry-name.ext-xml:before {
|
||||
content: "\ea07";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-7z:before,
|
||||
.token.treeview-part .entry-name.ext-bz:before,
|
||||
.token.treeview-part .entry-name.ext-bz2:before,
|
||||
.token.treeview-part .entry-name.ext-gz:before,
|
||||
.token.treeview-part .entry-name.ext-rar:before,
|
||||
.token.treeview-part .entry-name.ext-tar:before,
|
||||
.token.treeview-part .entry-name.ext-tgz:before,
|
||||
.token.treeview-part .entry-name.ext-zip:before {
|
||||
content: "\ea08";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-aac:before,
|
||||
.token.treeview-part .entry-name.ext-au:before,
|
||||
.token.treeview-part .entry-name.ext-cda:before,
|
||||
.token.treeview-part .entry-name.ext-flac:before,
|
||||
.token.treeview-part .entry-name.ext-mp3:before,
|
||||
.token.treeview-part .entry-name.ext-oga:before,
|
||||
.token.treeview-part .entry-name.ext-ogg:before,
|
||||
.token.treeview-part .entry-name.ext-wav:before,
|
||||
.token.treeview-part .entry-name.ext-wma:before {
|
||||
content: "\ea04";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-avi:before,
|
||||
.token.treeview-part .entry-name.ext-flv:before,
|
||||
.token.treeview-part .entry-name.ext-mkv:before,
|
||||
.token.treeview-part .entry-name.ext-mov:before,
|
||||
.token.treeview-part .entry-name.ext-mp4:before,
|
||||
.token.treeview-part .entry-name.ext-mpeg:before,
|
||||
.token.treeview-part .entry-name.ext-mpg:before,
|
||||
.token.treeview-part .entry-name.ext-ogv:before,
|
||||
.token.treeview-part .entry-name.ext-webm:before {
|
||||
content: "\ea05";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-pdf:before {
|
||||
content: "\ea09";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-xls:before,
|
||||
.token.treeview-part .entry-name.ext-xlsx:before {
|
||||
content: "\ea0a";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-doc:before,
|
||||
.token.treeview-part .entry-name.ext-docm:before,
|
||||
.token.treeview-part .entry-name.ext-docx:before {
|
||||
content: "\ea0c";
|
||||
}
|
||||
.token.treeview-part .entry-name.ext-pps:before,
|
||||
.token.treeview-part .entry-name.ext-ppt:before,
|
||||
.token.treeview-part .entry-name.ext-pptx:before {
|
||||
content: "\ea0b";
|
||||
}
|
||||
|
||||
@@ -0,0 +1,144 @@
|
||||
/**
|
||||
* Lotus Docs theme
|
||||
*
|
||||
* Adapted from a theme based on:
|
||||
* https://github.com/chriskempson/tomorrow-theme
|
||||
*
|
||||
* @author Colin Wilson <github.com/colinwilson>
|
||||
* @version 1.0
|
||||
*/
|
||||
|
||||
:root {
|
||||
--prism-code-bg: #212d63;
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-400);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--prism-code-bg: var(--gray-900);
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-600);
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: #f5fbff !important;
|
||||
background: var(--prism-code-bg) !important;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
// padding: 1em;
|
||||
// margin: .5em 0;
|
||||
overflow: auto;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #32325d;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
background-color: var(--blue-400);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty::before {
|
||||
background-color: var(--gray-400);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty:hover::before {
|
||||
background-color: var(--white);
|
||||
}
|
||||
|
||||
[data-copy-state="copy-success"] span:empty::before {
|
||||
background-color: var(--emerald-200);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.token.tag,
|
||||
.token.attr-name,
|
||||
.token.namespace,
|
||||
.token.deleted {
|
||||
color: #7fd3ed;
|
||||
}
|
||||
|
||||
.token.function-name {
|
||||
color: #6196cc;
|
||||
}
|
||||
|
||||
.token.boolean,
|
||||
.token.function {
|
||||
color: #fda3f3;
|
||||
}
|
||||
|
||||
.token.number {
|
||||
color: var(--cardinal-200);
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.class-name,
|
||||
.token.constant,
|
||||
.token.symbol {
|
||||
color: #ffffff;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.important,
|
||||
.token.atrule,
|
||||
.token.keyword,
|
||||
.token.builtin {
|
||||
color: #a4cdfe;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.attr-value,
|
||||
.token.regex {
|
||||
color: #7ec699;
|
||||
}
|
||||
|
||||
.token.variable {
|
||||
color: var(--yellow-100);
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url {
|
||||
color: #67cdcc;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.token.inserted {
|
||||
color: green;
|
||||
}
|
||||
@@ -0,0 +1,149 @@
|
||||
/*
|
||||
Lucario Theme originally by Raphael Amorim [@raphamorim]
|
||||
https://github.com/raphamorim/lucario
|
||||
|
||||
Ported for PrismJS by Christopher Kapic [@christopher-kapic]
|
||||
|
||||
Adapted for Lotus Docs by Colin Wilson
|
||||
Website: https://colinwilson.uk
|
||||
Twitter Handle: https://twitter.com/colinwilsonuk
|
||||
*/
|
||||
|
||||
:root {
|
||||
--prism-code-color: #f8f8f2;
|
||||
--prism-code-bg: #263E52;
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-400);
|
||||
--prism-line-highlight-bg-color: #8c78d2;
|
||||
--prism-copy-btn-bg-hover-color: var(--white);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--prism-code-color: #dee2e6;
|
||||
--prism-code-bg: var(--gray-900);
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-600);
|
||||
--prism-line-highlight-bg-color: #8c78d2;
|
||||
--prism-copy-btn-bg-hover-color: var(--white);
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: var(--prism-code-color);
|
||||
// text-shadow: 0 1px rgba(0, 0, 0, 0.3);
|
||||
background: var(--prism-code-bg) !important;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
// padding: 1em;
|
||||
// margin: .5em 0;
|
||||
overflow: auto;
|
||||
border-radius: 0.3em;
|
||||
}
|
||||
|
||||
:not(pre)>code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #263E52;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.line-highlight.line-highlight {
|
||||
background: linear-gradient(to right, hsla(0, 0%, 54%, .1) 70%, hsla(0, 0%, 33%, 0));
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
background-color: var(--prism-line-highlight-bg-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty::before {
|
||||
background-color: var(--gray-400);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty:hover::before {
|
||||
background-color: var(--prism-copy-btn-bg-hover-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy-success"] span:empty::before {
|
||||
background-color: var(--emerald-200);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #5c98cd;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #f8f8f2;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #F05E5D;
|
||||
}
|
||||
|
||||
.token.boolean,
|
||||
.token.number {
|
||||
color: #BC94F9;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #FCFCD6;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string,
|
||||
.token.variable {
|
||||
color: #f8f8f2;
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #66D8EF;
|
||||
}
|
||||
|
||||
.token.keyword {
|
||||
color: #6EB26E;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: #F05E5D;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
@@ -0,0 +1,173 @@
|
||||
/* PrismJS 1.29.0
|
||||
https://prismjs.com/download.html#themes=prism-solarizedlight&languages=markup+css+clike+javascript */
|
||||
/*
|
||||
Solarized Color Schemes originally by Ethan Schoonover
|
||||
http://ethanschoonover.com/solarized
|
||||
|
||||
Ported for PrismJS by Hector Matos
|
||||
Website: https://krakendev.io
|
||||
Twitter Handle: https://twitter.com/allonsykraken
|
||||
|
||||
Adapted for Lotus Docs by Colin Wilson
|
||||
Website: https://colinwilson.uk
|
||||
Twitter Handle: https://twitter.com/colinwilsonuk
|
||||
*/
|
||||
|
||||
/*
|
||||
SOLARIZED HEX
|
||||
--------- -------
|
||||
base03 #002b36
|
||||
base02 #073642
|
||||
base01 #586e75
|
||||
base00 #657b83
|
||||
base0 #839496
|
||||
base1 #93a1a1
|
||||
base2 #eee8d5
|
||||
base3 #fdf6e3
|
||||
yellow #b58900
|
||||
orange #cb4b16
|
||||
red #dc322f
|
||||
magenta #d33682
|
||||
violet #6c71c4
|
||||
blue #268bd2
|
||||
cyan #2aa198
|
||||
green #859900
|
||||
*/
|
||||
|
||||
:root {
|
||||
--prism-code-color: #657b83;
|
||||
--prism-code-bg: #fdf6e3;
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-400);
|
||||
--prism-line-highlight-bg-color: #e9967a;
|
||||
--prism-copy-btn-bg-hover-color: var(--gray-700);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--prism-code-color: #dee2e6;
|
||||
--prism-code-bg: var(--gray-900);
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-600);
|
||||
--prism-line-highlight-bg-color: var(--gray-600);
|
||||
--prism-copy-btn-bg-hover-color: var(--white);
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: var(--prism-code-color); /* base00 */
|
||||
background: var(--prism-code-bg) !important;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||
background: #073642; /* base02 */
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||
background: #073642; /* base02 */
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
// padding: 1em;
|
||||
// margin: .5em 0;
|
||||
overflow: auto;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background-color: #fdf6e3; /* base3 */
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
background-color: var(--prism-line-highlight-bg-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty::before {
|
||||
background-color: var(--gray-500);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty:hover::before {
|
||||
background-color: var(--prism-copy-btn-bg-hover-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy-success"] span:empty::before {
|
||||
background-color: var(--emerald-400);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #93a1a1; /* base1 */
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #586e75; /* base01 */
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #268bd2; /* blue */
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.url,
|
||||
.token.inserted {
|
||||
color: #2aa198; /* cyan */
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
color: #657b83; /* base00 */
|
||||
background: #eee8d5; /* base2 */
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #859900; /* green */
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #b58900; /* yellow */
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #cb4b16; /* orange */
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
@@ -0,0 +1,209 @@
|
||||
/* PrismJS 1.29.0
|
||||
https://prismjs.com/download.html#themes=prism-twilight&languages=markup+css+clike+javascript */
|
||||
/*
|
||||
prism.js Twilight theme
|
||||
Based (more or less) on the Twilight theme originally of Textmate fame.
|
||||
@author Remy Bach
|
||||
|
||||
Adapted for Lotus Docs by Colin Wilson
|
||||
Website: https://colinwilson.uk
|
||||
Twitter Handle: https://twitter.com/colinwilsonuk
|
||||
*/
|
||||
|
||||
:root {
|
||||
--prism-code-color: var(--white);
|
||||
--prism-code-bg: #141414;
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-400);
|
||||
// --prism-line-highlight-bg-color: hsl(215, 15%, 59%); /* #8794A6 */
|
||||
--prism-line-highlight-bg-color: var(--gray-600);
|
||||
--prism-copy-btn-bg-hover-color: var(--white);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--prism-code-color: #dee2e6;
|
||||
--prism-code-bg: var(--gray-900);
|
||||
--prism-code-scrollbar-thumb-color: var(--gray-600);
|
||||
--prism-line-highlight-bg-color: var(--gray-600);
|
||||
--prism-copy-btn-bg-hover-color: var(--white);
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: var(--prism-code-color);
|
||||
background: var(--prism-code-bg) !important;
|
||||
}
|
||||
|
||||
pre[class*="language-"],
|
||||
:not(pre)>code[class*="language-"] {
|
||||
background: hsl(0, 0%, 8%);
|
||||
/* #141414 */
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
// padding: 1em;
|
||||
// margin: .5em 0;
|
||||
// border: .3em solid hsl(0, 0%, 33%); /* #282A2B */
|
||||
// box-shadow: 1px 1px .5em black inset;
|
||||
overflow: auto;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection {
|
||||
/* Firefox */
|
||||
background: hsl(200, 4%, 16%);
|
||||
/* #282A2B */
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection {
|
||||
/* Safari */
|
||||
background: hsl(200, 4%, 16%);
|
||||
/* #282A2B */
|
||||
}
|
||||
|
||||
/* Text Selection colour */
|
||||
pre[class*="language-"]::-moz-selection,
|
||||
pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection,
|
||||
code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: hsla(0, 0%, 93%, 0.15);
|
||||
/* #EDEDED */
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection,
|
||||
pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection,
|
||||
code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: hsla(0, 0%, 93%, 0.15);
|
||||
/* #EDEDED */
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
// border: .13em solid hsl(0, 0%, 33%); /* #545454 */
|
||||
// box-shadow: 1px 1px .3em -.1em black inset;
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.line-highlight.line-highlight {
|
||||
background: linear-gradient(to right, hsla(0, 0%, 33%, .1) 70%, hsla(0, 0%, 33%, 0));
|
||||
/* #545454 */
|
||||
border-bottom: 1px dashed hsl(0, 0%, 33%);
|
||||
/* #545454 */
|
||||
border-top: 1px dashed hsl(0, 0%, 33%);
|
||||
/* #545454 */
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
background-color: var(--prism-line-highlight-bg-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty::before {
|
||||
background-color: var(--gray-500);
|
||||
}
|
||||
|
||||
[data-copy-state="copy"] span:empty:hover::before {
|
||||
background-color: var(--prism-copy-btn-bg-hover-color);
|
||||
}
|
||||
|
||||
[data-copy-state="copy-success"] span:empty::before {
|
||||
background-color: var(--emerald-200);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: hsl(0, 0%, 47%);
|
||||
/* #777777 */
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.deleted {
|
||||
color: hsl(14, 58%, 55%);
|
||||
/* #CF6A4C */
|
||||
}
|
||||
|
||||
.token.keyword,
|
||||
.token.property,
|
||||
.token.selector,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.builtin {
|
||||
color: hsl(53, 89%, 79%);
|
||||
/* #F9EE98 */
|
||||
}
|
||||
|
||||
.token.attr-name,
|
||||
.token.attr-value,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string,
|
||||
.token.variable,
|
||||
.token.inserted {
|
||||
color: hsl(76, 21%, 52%);
|
||||
/* #8F9D6A */
|
||||
}
|
||||
|
||||
.token.atrule {
|
||||
color: hsl(218, 22%, 55%);
|
||||
/* #7587A6 */
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: var(--prism-code-color);
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: hsl(42, 75%, 65%);
|
||||
/* #E9C062 */
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
/* Markup */
|
||||
.language-markup .token.tag,
|
||||
.language-markup .token.attr-name,
|
||||
.language-markup .token.punctuation {
|
||||
color: hsl(33, 33%, 52%);
|
||||
/* #AC885B */
|
||||
}
|
||||
|
||||
/* Make the tokens sit above the line highlight so the colours don't look faded. */
|
||||
.token {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
276
themes/lotusdocs/assets/docs/scss/custom/structure/_content.scss
Normal file
276
themes/lotusdocs/assets/docs/scss/custom/structure/_content.scss
Normal file
@@ -0,0 +1,276 @@
|
||||
// Docs main content
|
||||
//
|
||||
// _content.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
|
||||
--content-icon-color: var(--primary);
|
||||
--content-icon-bg: var(--sidebar-icon-bg);
|
||||
--content-icon-border: var(--sidebar-icon-bg);
|
||||
--content-link-color: var(--primary);
|
||||
|
||||
--ordered-list-bg: var(--gray-300);
|
||||
--ordered-list-color: var(--gray-800);
|
||||
--blockquote-border-color: var(--gray-300);
|
||||
|
||||
--code-block-bg: #212d63;
|
||||
--inline-code-bg: var(--gray-100);
|
||||
--inline-code-border: 1px solid var(--gray-400);
|
||||
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
|
||||
--content-icon-color: var(--primary-200);
|
||||
--content-icon-bg: hsl(var(--primary-hsl), 0.15);
|
||||
--content-icon-border: var(--primary-800);
|
||||
--content-link-color: var(--primary-300);
|
||||
|
||||
--ordered-list-bg: var(--gray-700);
|
||||
--ordered-list-color: var(--gray-200);
|
||||
--blockquote-border-color: var(--primary-200);
|
||||
|
||||
--code-block-bg: var(--gray-900);
|
||||
--inline-code-bg: var(--gray-800);
|
||||
--inline-code-border: 1px solid var(--gray-600);
|
||||
|
||||
}
|
||||
|
||||
.docs-content {
|
||||
order: 1;
|
||||
}
|
||||
|
||||
// Links
|
||||
.docs-content .main-content a {
|
||||
font-weight: 600;
|
||||
color: var(--content-link-color);
|
||||
&:hover {
|
||||
text-decoration: underline 2px var(--primary-200);
|
||||
text-underline-offset: 2.5px !important;
|
||||
transition: 0s !important;
|
||||
}
|
||||
// &.anchor i {
|
||||
// transform: rotate(-45deg);
|
||||
// }
|
||||
code {
|
||||
color: var(--content-link-color);
|
||||
}
|
||||
}
|
||||
|
||||
.docs-content .main-content {
|
||||
#edit-this-page a,
|
||||
#list-item a {
|
||||
&:hover {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.docs-content .main-content li {
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.docs-content .main-content h1,
|
||||
.docs-content .main-content h2,
|
||||
.docs-content .main-content h3,
|
||||
.docs-content .main-content h4,
|
||||
.docs-content .main-content h5 {
|
||||
font-weight: 700;
|
||||
color: var(--body-color);
|
||||
}
|
||||
|
||||
.docs-content .content-title {
|
||||
font-weight: 700;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
i {
|
||||
&.title-icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
color: var(--content-icon-color);
|
||||
background-color: var(--content-icon-bg);
|
||||
display: inline-flex !important;
|
||||
align-self: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24px;
|
||||
// border: solid 1px var(--content-icon-border);
|
||||
border-radius: 5px;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
align-self: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.docs-content p {
|
||||
&.lead {
|
||||
color: var(--text-muted);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.docs-content {
|
||||
padding-left: calc(var(--bs-gutter-x) * 1.05);
|
||||
padding-right: calc(var(--bs-gutter-x) * 1.05);
|
||||
|
||||
h2 {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
p {
|
||||
&.lead {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Images
|
||||
.docs-content .main-content {
|
||||
img,
|
||||
svg {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
// External link icon
|
||||
a svg {
|
||||
vertical-align: middle;
|
||||
padding-bottom: 0.25rem;
|
||||
margin-left: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
// Unordered List Styling
|
||||
.docs-content .main-content ul {
|
||||
padding-left: 0;
|
||||
|
||||
> li {
|
||||
position: relative;
|
||||
padding-left: 32px;
|
||||
// margin-bottom: 5px;
|
||||
}
|
||||
|
||||
> li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
left: 8px;
|
||||
top: 10px;
|
||||
border-radius: 30%;
|
||||
background: var(--gray-500);
|
||||
}
|
||||
}
|
||||
|
||||
// Ordered List Styling
|
||||
.docs-content .main-content ol {
|
||||
counter-reset: listitem;
|
||||
> li {
|
||||
counter-increment: listitem;
|
||||
position: relative;
|
||||
padding-left: 32px;
|
||||
}
|
||||
|
||||
> li::before {
|
||||
content: counter(listitem);
|
||||
background: var(--ordered-list-bg);
|
||||
color: var(--ordered-list-color);
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
line-height: 10px;
|
||||
text-align: center;
|
||||
padding: 5px 0;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 5px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
// Universal List Styling
|
||||
.docs-content .main-content ol,
|
||||
.docs-content .main-content ul {
|
||||
list-style: none;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
// Blockquote
|
||||
.docs-content .main-content blockquote {
|
||||
margin-bottom: 1rem;
|
||||
font-size: 1.25rem;
|
||||
border-left: 3px solid var(--blockquote-border-color);
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
// Code
|
||||
.docs-content .main-content div.highlight {
|
||||
margin: 16px 0;
|
||||
padding: $code-block-padding-top;
|
||||
background: var(--code-block-bg);
|
||||
border-radius: 4px;
|
||||
pre {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.docs-content .main-content code {
|
||||
font-size: inherit;
|
||||
// color: var(--text-default);
|
||||
font-weight: 400;
|
||||
padding: 1px 2px;
|
||||
background: var(--inline-code-bg);
|
||||
border: var(--inline-code-border);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.docs-content .main-content pre {
|
||||
margin: 0;
|
||||
// background-color: var(--code-block-bg) !important;
|
||||
border-radius: 4px;
|
||||
padding: $code-block-padding-top;
|
||||
|
||||
code {
|
||||
// color: #f5fbff;
|
||||
font-size: 0.8rem;
|
||||
display: block;
|
||||
// background: var(--code-block-bg);
|
||||
border: none;
|
||||
overflow-x: auto;
|
||||
line-height: 1.5;
|
||||
padding: 0 2.5rem 1.25rem 2.5rem;
|
||||
tab-size: 4;
|
||||
scrollbar-width: thin;
|
||||
//scrollbar-color: transparent transparent;
|
||||
}
|
||||
}
|
||||
|
||||
// bold code
|
||||
.docs-content .main-content strong {
|
||||
code {
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
// Chroma Highlighter CSS
|
||||
.docs-content .main-content td pre {
|
||||
|
||||
code {
|
||||
overflow-x: unset !important;
|
||||
}
|
||||
}
|
||||
|
||||
.docs-content .main-content .alert ul {
|
||||
font-size: var(--font-size-sm);
|
||||
}
|
||||
|
||||
// <figcaption>
|
||||
|
||||
.docs-content figcaption {
|
||||
font-size: small;
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
//
|
||||
// doc-nav.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--doc-nav-title-link-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--doc-nav-title-link-color: var(--primary-300);
|
||||
}
|
||||
|
||||
#doc-nav {
|
||||
|
||||
.card-title {
|
||||
color: var(--doc-nav-title-link-color);
|
||||
}
|
||||
|
||||
.card-text {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 425px) {
|
||||
.doc-next {
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.doc-prev {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.doc-hr {
|
||||
border-top: 1px solid var(--gray-500);
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 0px;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
//
|
||||
// _footer.scss
|
||||
//
|
||||
footer {
|
||||
position: relative;
|
||||
color: var(--text-muted);
|
||||
background: var(--body-bg);
|
||||
height: 58px;
|
||||
.text-foot {
|
||||
color: var(--gray-500);
|
||||
}
|
||||
.footer-head {
|
||||
font-size: 18px !important;
|
||||
letter-spacing: 1px;
|
||||
font-weight: 500;
|
||||
}
|
||||
a {
|
||||
color: var(--content-link-color);
|
||||
}
|
||||
a:hover {
|
||||
color: var(--content-link-color);
|
||||
text-decoration: underline 1.5px var(--primary-200);
|
||||
text-underline-offset: 3px !important;
|
||||
transition: 0s !important;
|
||||
}
|
||||
}
|
||||
|
||||
.footnote-backref {
|
||||
font-size: 1.1rem;
|
||||
vertical-align: middle;
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
@@ -0,0 +1,44 @@
|
||||
html {
|
||||
scroll-padding-top: 80px;
|
||||
background-color: var(--body-bg);
|
||||
}
|
||||
body {
|
||||
font-family: $font-family-secondary;
|
||||
overflow-x: hidden !important;
|
||||
font-size: $font-size-base;
|
||||
color: var(--body-color);
|
||||
background-color: var(--body-bg);
|
||||
}
|
||||
@media (max-width: 1199px) {
|
||||
html {
|
||||
scroll-padding-top: 120px;
|
||||
}
|
||||
body {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
font-family: $font-family-base;
|
||||
line-height: 1.4;
|
||||
font-weight: 600;
|
||||
}
|
||||
::selection {
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
opacity: 0.9;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
transition: all 0.5s ease;
|
||||
color: var(--primary);
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-800);
|
||||
}
|
||||
}
|
||||
p {
|
||||
line-height: 1.6;
|
||||
}
|
||||
img {
|
||||
height: auto;
|
||||
}
|
||||
443
themes/lotusdocs/assets/docs/scss/custom/structure/_sidebar.scss
Normal file
443
themes/lotusdocs/assets/docs/scss/custom/structure/_sidebar.scss
Normal file
@@ -0,0 +1,443 @@
|
||||
//
|
||||
// sidebar.scss
|
||||
//
|
||||
.page-wrapper {
|
||||
height: 100vh;
|
||||
.sidebar-wrapper {
|
||||
// box-shadow: $shadow;
|
||||
// border-right: 1px solid var(--sidebar-border-color);
|
||||
transition: all 0.3s ease;
|
||||
width: 300px;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: -300px;
|
||||
z-index: 999;
|
||||
|
||||
@media (min-width: 1025px) {
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 425px) {
|
||||
width: 260px;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.sidebar-content {
|
||||
background: var(--sidebar-bg);
|
||||
max-height: calc(100% - 30px);
|
||||
height: calc(100% - 30px);
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
overflow-y: overlay;
|
||||
position: relative;
|
||||
&.desktop {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
border-right: 1px solid var(--sidebar-border-color);
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--sidebar-bg) var(--sidebar-bg);
|
||||
// &::-webkit-scrollbar {
|
||||
// display: none;
|
||||
// }
|
||||
}
|
||||
.sidebar-content:hover {
|
||||
scrollbar-color: var(--sidebar-scrollbar-thumb-color) var(--sidebar-bg);
|
||||
}
|
||||
.sidebar-content::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 8px;
|
||||
}
|
||||
.sidebar-content::-webkit-scrollbar-track {
|
||||
background: var(--sidebar-bg);
|
||||
display: none;
|
||||
}
|
||||
.sidebar-content:hover::-webkit-scrollbar-thumb {
|
||||
background: var(--sidebar-scrollbar-thumb-color);
|
||||
}
|
||||
.sidebar-brand {
|
||||
background: var(--sidebar-bg);
|
||||
padding: 10px 20px;
|
||||
border-bottom: 1px solid var(--sidebar-border-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 72px;
|
||||
> a {
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
flex-grow: 1;
|
||||
transition: all 0.3s ease;
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
svg {
|
||||
height: 26px;
|
||||
}
|
||||
}
|
||||
#close-sidebar {
|
||||
cursor: pointer;
|
||||
font-size: 24px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
}
|
||||
.sidebar-header {
|
||||
padding: 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar-menu {
|
||||
padding: 16px 0 16px 10px;
|
||||
.header-menu {
|
||||
span {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 15px 20px 5px 20px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
a,button {
|
||||
display: inline-block;
|
||||
color: var(--sidebar-text-color);
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
position: relative;
|
||||
padding: 4px 35px 5px 10px;
|
||||
margin: 4px 0 4px 0;
|
||||
border: none;
|
||||
letter-spacing: normal;
|
||||
transition: all 0.3s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: left;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
padding: 6px 24px 6px 24px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 425px) {
|
||||
padding: 6px 26px 6px 12px;
|
||||
}
|
||||
&:hover > i::before {
|
||||
display: inline-block;
|
||||
}
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
i {
|
||||
min-width: 36px;
|
||||
height: 36px;
|
||||
background-color: var(--sidebar-icon-bg);
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
&.sidebar-nested-link {
|
||||
align-items: normal;
|
||||
}
|
||||
}
|
||||
a:hover,
|
||||
&.sidebar-dropdown button:hover {
|
||||
background-color: var(--sidebar-dropdown-hover-bg);
|
||||
border-radius: 4px 0 0 4px;
|
||||
margin: 4px 0 4px 0;
|
||||
}
|
||||
&:hover,
|
||||
&.active {
|
||||
i {
|
||||
background-color: var(--sidebar-menu-active-bg);
|
||||
}
|
||||
}
|
||||
&.no-icon {
|
||||
> a:before {
|
||||
// content: "\e931" !important;
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
> button {
|
||||
margin: 1px 0 1px 0;
|
||||
&:hover {
|
||||
margin: 1px 0 1px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-root-link {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.sidebar-dropdown {
|
||||
&.no-icon {
|
||||
> button:after {
|
||||
top: inherit !important;
|
||||
}
|
||||
}
|
||||
> button:after {
|
||||
content: "\e5cc" !important;
|
||||
color: var(--sidebar-text-color);
|
||||
font-family: 'Material Symbols Outlined';
|
||||
font-weight: 500;
|
||||
font-size: 22px;
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 7px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
&.nested {
|
||||
&.no-icon {
|
||||
> button:after {
|
||||
top: inherit !important;
|
||||
}
|
||||
> button:before {
|
||||
// content: "\e5da" !important;
|
||||
content: none !important;
|
||||
}
|
||||
}
|
||||
button {
|
||||
font-size: 14px;
|
||||
&:before {
|
||||
content: var(--sidebar-directory-icon);
|
||||
color: var(--sidebar-text-color);
|
||||
font-family: 'Material Symbols Outlined';
|
||||
margin-right: 4px;
|
||||
font-size: 14px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
&:after {
|
||||
top: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
> button:after {
|
||||
transform: rotate(90deg);
|
||||
right: 17px;
|
||||
}
|
||||
}
|
||||
// &:hover,
|
||||
&.current {
|
||||
> button:after {
|
||||
color: var(--sidebar-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-submenu {
|
||||
display: none;
|
||||
ul {
|
||||
padding: 3px 0;
|
||||
li {
|
||||
padding-left: 15px;
|
||||
font-size: 14px;
|
||||
a {
|
||||
font-weight: 400;
|
||||
&:before {
|
||||
content: var(--sidebar-file-icon);
|
||||
color: var(--sidebar-text-color);
|
||||
font-family: 'Material Symbols Outlined';
|
||||
margin-right: 4px;
|
||||
font-size: 14px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.badge,
|
||||
.label {
|
||||
float: right;
|
||||
margin-top: 0px;
|
||||
}
|
||||
}
|
||||
&.no-icon {
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
ul {
|
||||
li {
|
||||
a {
|
||||
span {
|
||||
&.label,
|
||||
&.badge {
|
||||
float: right;
|
||||
margin-top: 8px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-header,
|
||||
.sidebar-menu {
|
||||
// border-top: 1px solid var(--sidebar-border-color);
|
||||
// border-right: 1px solid var(--sidebar-border-color);
|
||||
}
|
||||
.sidebar-header .user-info .user-role,
|
||||
.sidebar-header .user-info .user-status,
|
||||
.sidebar-brand > a,
|
||||
.sidebar-menu li a {
|
||||
color: var(--sidebar-text-color);
|
||||
font-weight: 600;
|
||||
}
|
||||
// .sidebar-menu li:hover > a,
|
||||
.sidebar-menu li.current > a,
|
||||
.sidebar-menu li:active > a,
|
||||
.sidebar-menu li:active > a:before,
|
||||
// .sidebar-menu li:hover > a:before,
|
||||
.sidebar-menu li.current > a:before,
|
||||
.sidebar-menu li.current > button:before,
|
||||
// .sidebar-menu .sidebar-dropdown.active > a,
|
||||
.sidebar-header .user-info,
|
||||
.sidebar-brand > a:hover {
|
||||
color: var(--sidebar-primary) !important;
|
||||
}
|
||||
|
||||
.sidebar-menu li.current > a {
|
||||
font-weight: 600 !important;
|
||||
background-color: var(--sidebar-menu-active-bg);
|
||||
border-right: 3px solid var(--primary);
|
||||
border-radius: 4px 0 0 4px;
|
||||
margin: 4px 0 4px 0;
|
||||
}
|
||||
|
||||
// .sidebar-menu li:hover > button,
|
||||
.sidebar-menu .sidebar-dropdown.current > button {
|
||||
color: var(--sidebar-primary) !important;
|
||||
}
|
||||
|
||||
.sidebar-brand {
|
||||
.sidebar-colored {
|
||||
display: none;
|
||||
}
|
||||
.logo-dark-mode {
|
||||
display: none;
|
||||
}
|
||||
.logo-light-mode {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page-content {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding-left: 0px;
|
||||
// overflow-x: hidden;
|
||||
transition: all 0.3s ease;
|
||||
.top-header {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
max-height: 70px;
|
||||
left: 0px;
|
||||
transition: all 0.3s;
|
||||
.header-bar {
|
||||
background: var(--top-header-bg);
|
||||
backdrop-filter: saturate(180%) blur(5px);
|
||||
height: 72px;
|
||||
// box-shadow: $shadow;
|
||||
border-bottom: 1px solid var(--sidebar-border-color);
|
||||
position: relative;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24px;
|
||||
|
||||
@media (max-width: 425px) {
|
||||
padding: 24px 12px;
|
||||
}
|
||||
|
||||
.logo-icon {
|
||||
display: none;
|
||||
@media (max-width: 1024px) {
|
||||
display: block;
|
||||
}
|
||||
.small {
|
||||
display: none;
|
||||
@media (max-width: 767px) {
|
||||
display: block;
|
||||
}
|
||||
svg {
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
.big {
|
||||
display: none;
|
||||
.logo-dark-mode {
|
||||
display: none;
|
||||
}
|
||||
.logo-light-mode {
|
||||
display: inline-block;
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 1024px) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.layout-spacing {
|
||||
padding: 94px 14px 24px !important;
|
||||
min-height: calc(100vh - 66px) !important;
|
||||
position: relative;
|
||||
|
||||
@media (max-width: 425px) {
|
||||
padding: 84px 0 24px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
@media screen and (min-width: 1025px) {
|
||||
.page-content {
|
||||
padding-left: 300px;
|
||||
}
|
||||
}
|
||||
.top-header {
|
||||
left: 300px;
|
||||
@media (max-width: 1024px) {
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
.sidebar-wrapper {
|
||||
left: 0px;
|
||||
@media (max-width: 1024px) {
|
||||
left: -300px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-footer {
|
||||
position: absolute;
|
||||
background: var(--sidebar-bg);
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 9px 24px 9px 20px !important;
|
||||
border-right: 1px solid var(--sidebar-border-color);
|
||||
height: 60px;
|
||||
@media(max-width: 425px) {
|
||||
padding: 9px 12px !important;
|
||||
}
|
||||
}
|
||||
164
themes/lotusdocs/assets/docs/scss/custom/structure/_toc.scss
Normal file
164
themes/lotusdocs/assets/docs/scss/custom/structure/_toc.scss
Normal file
@@ -0,0 +1,164 @@
|
||||
//
|
||||
// toc-layouts.scss
|
||||
//
|
||||
|
||||
:root {
|
||||
--toc-link-hover-bg-color: var(--gray-300);
|
||||
--toc-mobile-btn-bg-color: var(--gray-100);
|
||||
--toc-mobile-menu-bg-color: var(--white);
|
||||
--toc-mobile-link-hover-color: var(--primary);
|
||||
}
|
||||
|
||||
[data-dark-mode] {
|
||||
--toc-link-hover-bg-color: var(--gray-700);
|
||||
--toc-mobile-btn-bg-color: var(--gray-900);
|
||||
--toc-mobile-menu-bg-color: var(--body-bg);
|
||||
--toc-mobile-link-hover-color: var(--primary-300);
|
||||
}
|
||||
|
||||
.docs-toc-mobile {
|
||||
position: sticky;
|
||||
// top: 71px; // important (must be set)
|
||||
top: 85px; // important (must be set)
|
||||
padding-left: calc(var(--bs-gutter-x) * 1.05);
|
||||
padding-right: calc(var(--bs-gutter-x) * 1.05);
|
||||
z-index: 20;
|
||||
|
||||
// &.toc-pinned {
|
||||
// padding: 0;
|
||||
|
||||
// .dropdown-toggle {
|
||||
// border-left: 0;
|
||||
// border-right: 0;
|
||||
// border-top: 0;
|
||||
// border-radius: 0;
|
||||
// }
|
||||
// }
|
||||
|
||||
a {
|
||||
color: var(--text-default);
|
||||
}
|
||||
a:hover {
|
||||
color: var(--toc-mobile-link-hover-color);
|
||||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
margin-bottom: 16px;
|
||||
background: var(--toc-mobile-btn-bg-color);
|
||||
color: var(--text-default);
|
||||
padding: 4px;
|
||||
border: 1px solid var(--alert-border-color);
|
||||
border-radius: 4px;
|
||||
width: calc(100% + 2px);
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
transform: translateY(-16.5px) !important;
|
||||
background: var(--toc-mobile-menu-bg-color);
|
||||
inset: -1px auto none (var(--bs-gutter-x)) !important;
|
||||
border: 1px solid var(--alert-border-color);
|
||||
border-top: none;
|
||||
border-radius: 0 0 4px 4px;
|
||||
width: calc(100% - (var(--bs-gutter-x)*2));
|
||||
max-height: 40vh;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: thin;
|
||||
li {
|
||||
list-style: none;
|
||||
padding: 0 0 4px 0;
|
||||
ul {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.docs-toc {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 6rem;
|
||||
height: calc(100vh - 11.1rem);
|
||||
overflow-y: auto;
|
||||
order: 2;
|
||||
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--simplebar-color) rgba(var(--bs-light-rgb), var(--bs-bg-opacity));
|
||||
|
||||
// visually-hidden
|
||||
@media (max-width: 1199px) {
|
||||
position: absolute !important;
|
||||
width: 1px !important;
|
||||
height: 1px !important;
|
||||
padding: 0 !important;
|
||||
margin: -1px !important;
|
||||
overflow: hidden !important;
|
||||
clip: rect(0, 0, 0, 0) !important;
|
||||
white-space: nowrap !important;
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.docs-toc::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.docs-toc::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.docs-toc::-webkit-scrollbar-thumb {
|
||||
background-color: var(--simplebar-color);
|
||||
border-radius: 4px;
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
#TableOfContents ul,
|
||||
#toc ul {
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
padding-bottom: 5px;
|
||||
|
||||
ul {
|
||||
li {
|
||||
border-top: none;
|
||||
padding-left: 1rem;
|
||||
margin-top: 0.125rem;
|
||||
padding-top: 0.125rem;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#TableOfContents a,
|
||||
#toc a {
|
||||
display: block;
|
||||
color: var(--text-default);
|
||||
padding: 0 10px 0 10px;
|
||||
padding-block: 0px 0.05rem;
|
||||
margin: 0 0 0 -10px;
|
||||
border-radius: 4px;
|
||||
width: fit-content;
|
||||
font-size: 15px;
|
||||
letter-spacing: 0.02em;
|
||||
transition: all 0.1s;
|
||||
-webkit-transition: all 0.1s;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--toc-link-hover-bg-color);
|
||||
transition: all 0.1s;
|
||||
-webkit-transition: all 0.2s;
|
||||
}
|
||||
}
|
||||
|
||||
#toc a.active {
|
||||
color: var(--white);
|
||||
background-color: var(--primary);
|
||||
// font-weight: 600;
|
||||
opacity: 0.9;
|
||||
}
|
||||
2
themes/lotusdocs/assets/docs/scss/katex.scss
Normal file
2
themes/lotusdocs/assets/docs/scss/katex.scss
Normal file
@@ -0,0 +1,2 @@
|
||||
// Katex
|
||||
@import "custom/plugins/katex/katex";
|
||||
74
themes/lotusdocs/assets/docs/scss/style.scss
Normal file
74
themes/lotusdocs/assets/docs/scss/style.scss
Normal file
@@ -0,0 +1,74 @@
|
||||
/* Template Name: Lotus Docs
|
||||
Author: Colin Wilson
|
||||
E-mail: colin@aigis.uk
|
||||
Created: October 2022
|
||||
Version: 1.2.0
|
||||
File Description: Main CSS file for Lotus Docs
|
||||
*/
|
||||
|
||||
// Custom Font Variables
|
||||
$font-family-secondary: {{ .Site.Params.secondary_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }};
|
||||
$font-family-sans-serif: {{ .Site.Params.sans_serif_font | default "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Ubuntu'" }};
|
||||
$font-family-monospace: {{ .Site.Params.mono_font | default "SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace" }};
|
||||
|
||||
// Code Padding Variables
|
||||
$code-block-padding-top: {{ if eq .Site.Params.docs.prism true -}}0{{ else }}1.25rem 0 0 0{{ end }};
|
||||
|
||||
// Icon Fonts
|
||||
@import "custom/plugins/icons/google-material";
|
||||
|
||||
// Core files
|
||||
@import "../../scss/bootstrap/functions";
|
||||
@import "../../scss/bootstrap/variables";
|
||||
@import {{ printf "'%s%s'" "custom/colors/" (.Site.Params.docs.themeColor | default "blue") }}; // current theme color
|
||||
@import "../../scss/bootstrap/mixins";
|
||||
@import "../../scss/bootstrap/bootstrap";
|
||||
@import "variables";
|
||||
|
||||
{{ if and (.Site.Params.docsearch.appID) (.Site.Params.docsearch.apiKey) -}}
|
||||
@import "custom/plugins/docsearch/style";
|
||||
{{ end }}
|
||||
|
||||
// Structure
|
||||
@import "custom/structure/general";
|
||||
@import "custom/structure/content";
|
||||
@import "custom/structure/sidebar";
|
||||
@import "custom/structure/doc-nav";
|
||||
@import "custom/structure/toc";
|
||||
@import "custom/structure/footer";
|
||||
|
||||
// Components
|
||||
@import "custom/components/buttons";
|
||||
@import "custom/components/breadcrumb";
|
||||
@import "custom/components/badge";
|
||||
@import "custom/components/backgrounds";
|
||||
@import "custom/components/dropdown";
|
||||
@import "custom/components/alerts";
|
||||
@import "custom/components/card";
|
||||
@import "custom/components/forms";
|
||||
@import "custom/components/table";
|
||||
@import "custom/components/tabs";
|
||||
@import "custom/components/tooltip";
|
||||
|
||||
// Pages
|
||||
@import "custom/pages/features";
|
||||
@import "custom/pages/helper";
|
||||
|
||||
// Plugins
|
||||
|
||||
// Prism / Chroma
|
||||
{{- if eq .Site.Params.docs.prism true }}
|
||||
@import {{ printf "'%s%s'" "custom/plugins/prism/themes/" (.Site.Params.docs.prismTheme | default "lotusdocs") }}; // current prism theme
|
||||
@import "custom/plugins/prism/prism";
|
||||
{{- else }}
|
||||
@import "custom/plugins/chroma/default";
|
||||
{{- end -}}
|
||||
|
||||
// FlexSearch
|
||||
{{ if or (not (isset .Site.Params.flexsearch "enabled")) (eq .Site.Params.flexsearch.enabled true) -}}@import "custom/plugins/flexsearch/flexsearch";{{ end }}
|
||||
|
||||
// Feedback Widget
|
||||
{{ if .Site.Params.feedback.enabled | default false -}}@import "custom/plugins/feedback/feedback";{{ end}}
|
||||
|
||||
// Mermaid
|
||||
@import "custom/plugins/mermaid/mermaid";
|
||||
Reference in New Issue
Block a user