fix: organize css

This commit is contained in:
mostafaei2002 2024-06-01 16:13:36 +03:30
parent 3504aa1485
commit 7236e2e8f8
4 changed files with 164 additions and 165 deletions

View File

@ -11,7 +11,7 @@ import "../../node_modules/bootstrap/js/dist//modal";
// import "../../node_modules/bootstrap/js/dist/toast"; // import "../../node_modules/bootstrap/js/dist/toast";
// import "../../node_modules/bootstrap/js/dist/tooltip"; // import "../../node_modules/bootstrap/js/dist/tooltip";
import "../scss/styles.scss"; import "../scss/main.scss";
function setupPrettify() { function setupPrettify() {
const codeBlocks = document.querySelectorAll("pre code"); const codeBlocks = document.querySelectorAll("pre code");

View File

@ -0,0 +1,72 @@
a {
text-decoration: none;
&:hover,
&:active {
text-decoration: underline;
}
}
pre.prettyprint {
margin-bottom: 20px;
}
code {
@extend .rounded;
}
pre {
@extend .bg-body-tertiary;
@extend .rounded;
}
pre code {
border: none;
}
img {
@extend .img-fluid;
}
.nav-link {
padding: 2px 15px 3px;
}
.body-content {
padding-top: 70px;
padding-bottom: 70px;
}
.badges {
display: flex;
align-items: center;
justify-content: end;
gap: 8px;
}
.toclink {
color: #333;
}
#table-of-contents {
@extend .rounded;
padding: 0.5rem;
margin-bottom: 1rem;
}
.headerlink {
display: none;
}
.promo {
@extend .d-none;
@extend .d-md-block;
}
[data-bs-theme="dark"] .promo li a {
color: white !important;
}
[data-bs-theme="dark"] [src="img/logo.png"] {
filter: invert(1) brightness(1.5) contrast(1.2);
}

View File

@ -57,167 +57,5 @@ $code-color: #d14;
// Utilities // Utilities
@import "../../node_modules/bootstrap/scss/utilities/api"; @import "../../node_modules/bootstrap/scss/utilities/api";
// Custom Classes @import "./prettify.scss";
a { @import "./custom.scss";
text-decoration: none;
&:hover,
&:active {
text-decoration: underline;
}
}
pre.prettyprint {
margin-bottom: 20px;
}
code {
@extend .rounded;
}
pre {
@extend .bg-body-tertiary;
@extend .rounded;
}
pre code {
border: none;
}
img {
@extend .img-fluid;
}
.nav-link {
padding: 2px 15px 3px;
}
.body-content {
padding-top: 70px;
padding-bottom: 70px;
}
.badges {
display: flex;
align-items: center;
justify-content: end;
gap: 8px;
}
.toclink {
color: #333;
}
// Prettify Code
.com {
color: #93a1a1;
}
.lit {
color: #195f91;
}
.pun,
.opn,
.clo {
color: #93a1a1;
}
.fun {
color: #dc322f;
}
.str,
.atv {
color: #d14;
}
.kwd,
.prettyprint .tag {
color: #1e347b;
}
.typ,
.atn,
.dec,
.var {
color: teal;
}
.pln {
color: #48484c;
}
.prettyprint {
padding: 20px;
}
.prettyprint.linenums {
box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
}
[data-bs-theme="dark"] {
.com {
color: #9ea0a0;
}
.lit {
color: #4d90fe;
}
.pun,
.opn,
.clo {
color: #9ea0a0;
}
.fun {
color: #fe6160;
}
.str,
.atv {
color: #fea832;
}
.kwd,
.prettyprint .tag {
color: #4d69a8;
}
.typ,
.atn,
.dec,
.var {
color: #38a1a1;
}
.pln {
color: #c8c8cc;
}
}
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
margin: 0 0 0 33px; /* IE indents via margin-left */
}
ol.linenums li {
padding-left: 12px;
color: #bebec5;
line-height: 20px;
text-shadow: 0 1px 0 #fff;
}
#table-of-contents {
@extend .rounded;
padding: 0.5rem;
margin-bottom: 1rem;
}
.headerlink {
display: none;
}
.promo {
@extend .d-none;
@extend .d-md-block;
}
[data-bs-theme="dark"] .promo li a {
color: white !important;
}
[data-bs-theme="dark"] [src="img/logo.png"] {
filter: invert(1) brightness(1.5) contrast(1.2);
}

View File

@ -0,0 +1,89 @@
.com {
color: #93a1a1;
}
.lit {
color: #195f91;
}
.pun,
.opn,
.clo {
color: #93a1a1;
}
.fun {
color: #dc322f;
}
.str,
.atv {
color: #d14;
}
.kwd,
.prettyprint .tag {
color: #1e347b;
}
.typ,
.atn,
.dec,
.var {
color: teal;
}
.pln {
color: #48484c;
}
.prettyprint {
padding: 20px;
}
.prettyprint.linenums {
box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
}
[data-bs-theme="dark"] {
.com {
color: #9ea0a0;
}
.lit {
color: #4d90fe;
}
.pun,
.opn,
.clo {
color: #9ea0a0;
}
.fun {
color: #fe6160;
}
.str,
.atv {
color: #fea832;
}
.kwd,
.prettyprint .tag {
color: #4d69a8;
}
.typ,
.atn,
.dec,
.var {
color: #38a1a1;
}
.pln {
color: #c8c8cc;
}
}
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
margin: 0 0 0 33px; /* IE indents via margin-left */
}
ol.linenums li {
padding-left: 12px;
color: #bebec5;
line-height: 20px;
text-shadow: 0 1px 0 #fff;
}