More styles improvements

This commit is contained in:
Hazem Krimi
2023-11-22 14:31:52 +01:00
parent 40ec57c634
commit b790da4c73
6 changed files with 38 additions and 24 deletions
+4 -1
View File
@@ -19,6 +19,8 @@
--light-gray: #e7e7e7;
--dark-background: #1d1b1b;
--light-background: #fbfbfb;
--partial-dark-background: var(--black);
--partial-light-background: #ececec;
--card-radius: 1.875rem;
--form-radius: 0.563rem;
--shadow: 0px 4px 8px rgba(0, 0, 0, 0.04);
@@ -147,7 +149,8 @@ a {
color: var(--text);
}
a, button {
a,
button {
cursor: pointer;
}
+3 -3
View File
@@ -1,8 +1,8 @@
:root {
--first-action-dark-background: #353535;
--first-action-light-background: var(--black);
--second-action-dark-background: #F3F3F3;
--second-action-light-background: #ECECEC;
--first-action-light-background: var(--partial-dark-background);
--second-action-dark-background: #f3f3f3;
--second-action-light-background: var(--partial-light-background);
}
main h1 {
+1 -1
View File
@@ -7,7 +7,7 @@ main #tags {
main #tags a {
border-radius: 0.5625rem;
background-color: #5A5A5A;
background-color: #5a5a5a;
color: var(--white);
padding: 0.5rem 1rem;
text-decoration: none;
+26 -15
View File
@@ -1,20 +1,20 @@
:root {
--about-card-light-background: #ececec;
--about-card-dark-background: var(--black);
--button-light-background: var(--black);
--about-card-light-background: var(--partial-light-background);
--about-card-dark-background: var(--partial-dark-background);
--button-light-background: var(--partial-dark-background);
--button-dark-background: #353535;
--card-light-background: #ececec;
--card-dark-background: var(--black);
--input-light-background: #ececec;
--card-light-background: var(--partial-light-background);
--card-dark-background: var(--partial-dark-background);
--input-light-background: var(--partial-light-background);
--input-dark-background: #2d2d2d;
--footer-light-background: #ececec;
--footer-dark-background: var(--black);
--header-light-background: #ececec;
--footer-light-background: var(--partial-light-background);
--footer-dark-background: var(--partial-dark-background);
--header-light-background: var(--partial-light-background);
--header-dark-background: #676666;
--nav-light-background: #ececec;
--nav-dark-background: var(--black);
--toc-light-background: #f2f2f2;
--toc-dark-background: var(--black);
--nav-light-background: var(--partial-light-background);
--nav-dark-background: var(--partial-dark-background);
--toc-light-background: var(--partial-light-background);
--toc-dark-background: var(--partial-dark-background);
}
#about-card {
@@ -328,14 +328,25 @@ header #nav-toggler {
}
#table-of-contents {
position: sticky;
top: 3rem;
margin-top: 3rem;
height: 30rem;
max-height: 20rem;
height: 25rem;
max-height: 25rem;
padding: 1.2rem 1.6rem;
border-radius: 0.75rem;
background-color: var(--toc-background);
}
#table-of-contents span {
font-weight: bold;
font-size: 1.5rem;
}
#table-of-contents nav {
margin-top: 0.5rem;
}
#table-of-contents nav ul {
list-style-type: none;
padding-inline-start: 2rem;
+1 -1
View File
@@ -1,6 +1,6 @@
main #container {
display: grid;
grid-template-columns: auto 15rem;
grid-template-columns: auto minmax(15rem, 20rem);
column-gap: 2rem;
}
+1 -1
View File
@@ -1,6 +1,6 @@
{{ with .TableOfContents }}
<aside id="table-of-contents">
<h3>Table of contents</h3>
<span>Table of contents</span>
{{ . }}
</aside>
{{ end }}