First Commit
This commit is contained in:
Executable
+41
@@ -0,0 +1,41 @@
|
||||
aside .main-links a {
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
aside .main-links a:hover,
|
||||
aside .main-links a.active {
|
||||
background-color: var(--main-color-dark-lighter-2);
|
||||
}
|
||||
|
||||
aside .main-links a img {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
section {
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
border: 1px solid var(--slate-200);
|
||||
}
|
||||
|
||||
@media (max-width: 990px) {
|
||||
aside {
|
||||
min-width: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Executable
+381
@@ -0,0 +1,381 @@
|
||||
@import url("https://fonts.googleapis.com/css?family=Comme:300,400,500,600,700,800,900");
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
:root {
|
||||
--main-color: #9049ca;
|
||||
--main-color-lighter: #c48ff0;
|
||||
--main-color-darker: #7534aa;
|
||||
--main-color-darker-2: #562081;
|
||||
--main-color-dark: #2c2235;
|
||||
--main-color-dark-lighter: #3b2a4b;
|
||||
--main-color-dark-lighter-2: #4b286b;
|
||||
--main-color-dark-lighter-3: #5a278a;
|
||||
|
||||
--sec-color: #34cea0;
|
||||
--sec-color-lighter: #76d8bb;
|
||||
--sec-color-light: #ddf9f0;
|
||||
--sec-color-darker: #0b8862;
|
||||
|
||||
--sec-color-2: #66ced6;
|
||||
--sec-color-2-darker: #169286;
|
||||
|
||||
--text-color: #242527;
|
||||
--light-color: #d3dae4;
|
||||
--dark-color: #120e16;
|
||||
|
||||
--slate-100: rgb(241 245 249);
|
||||
--slate-200: rgb(226 232 240);
|
||||
--slate-300: rgb(203 213 225);
|
||||
--slate-400: rgb(148 163 184);
|
||||
--slate-500: rgb(100 116 139);
|
||||
--slate-600: rgb(71 85 105);
|
||||
--slate-700: rgb(51 65 85);
|
||||
--slate-800: rgb(30 41 59);
|
||||
--slate-900: rgb(15 23 42);
|
||||
|
||||
--warning-color: rgb(236, 145, 118);
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
.swiper-wrapper {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
.tox .tox-sidebar-wrap {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tox .tox-edit-area {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tox-tinymce {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.tox-collection__group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.tox .tox-edit-area,
|
||||
.tox .tox-edit-area iframe,
|
||||
.tox .tox-editor-container,
|
||||
.tox .tox-editor-container > * {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tox:not(.tox-tinymce-inline) .tox-editor-header {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
nav a {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
header.dark-content {
|
||||
background-color: var(--dark-color);
|
||||
color: white;
|
||||
}
|
||||
|
||||
header.dark-content.hero-overlay {
|
||||
background-color: transparent;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
header.dark-content #main-header-logo-link-block * {
|
||||
color: white;
|
||||
}
|
||||
|
||||
header.dark-content nav a {
|
||||
color: white;
|
||||
}
|
||||
|
||||
header.dark-content nav a:hover {
|
||||
color: var(--slate-400);
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
ul,
|
||||
ol {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
li a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
footer {
|
||||
border-top: 1px solid var(--slate-200);
|
||||
}
|
||||
|
||||
html.dark footer {
|
||||
border-top: 1px solid var(--slate-700);
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: var(--main-color);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
footer a:hover {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
#theme-selector-wrapper {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#theme-selector-graphic-wrapper {
|
||||
outline-color: transparent;
|
||||
outline-style: solid;
|
||||
outline-width: 2px;
|
||||
background-color: var(--slate-200);
|
||||
}
|
||||
|
||||
html.dark #theme-selector-graphic-wrapper {
|
||||
background-color: var(--slate-700);
|
||||
}
|
||||
|
||||
#theme-selector-wrapper:hover #theme-selector-graphic-wrapper {
|
||||
outline-color: var(--slate-300);
|
||||
}
|
||||
|
||||
html.dark #theme-selector-wrapper:hover #theme-selector-graphic-wrapper {
|
||||
outline-color: var(--slate-500);
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
aside a.active {
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
html.dark aside a.active {
|
||||
color: white;
|
||||
}
|
||||
|
||||
code,
|
||||
pre {
|
||||
background-color: #1b112b;
|
||||
color: white;
|
||||
/* padding: 20px; */
|
||||
border-radius: 3px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
.tox-editor-header::-webkit-scrollbar {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
.gray-bordered {
|
||||
border: 1px solid var(--slate-200);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.ace-editor-wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#ace-editor-wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#ace-editor-wrapper div,
|
||||
.ace_editor div {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* .ace_gutter,
|
||||
.ace_scroller,
|
||||
.ace_content {
|
||||
top: 20px;
|
||||
bottom: 20px;
|
||||
} */
|
||||
|
||||
.copy-code {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.code-block:hover .copy-code {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* ###############################################################################################
|
||||
##################################################################################################
|
||||
##################################################################################################
|
||||
##################################################################################################
|
||||
##################################### -- Mobile Styles -- ########################################
|
||||
##################################################################################################
|
||||
##################################################################################################
|
||||
##################################################################################################
|
||||
############################################################################################### */
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
#main-nav-content-wrapper {
|
||||
max-width: 350px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
html.dark #main-nav-content-wrapper {
|
||||
background-color: var(--slate-800);
|
||||
box-shadow: 0 0 50px black;
|
||||
}
|
||||
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
/* * */
|
||||
|
||||
nav a {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
header.dark-content {
|
||||
color: var(--dark-color);
|
||||
}
|
||||
|
||||
header.dark-content nav a {
|
||||
color: var(--dark-color);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 990px) {
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
#main-nav-content-wrapper {
|
||||
max-width: none;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
h2 {
|
||||
font-size: 28px;
|
||||
}
|
||||
section {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
}
|
||||
Executable
+3
@@ -0,0 +1,3 @@
|
||||
header {
|
||||
background-color: red !important;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user