jalil/achat-maison-albi-fr
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Update CSS styles for Starlight Docs

Browse source 
Header style adjustments were made to further enhance user interface and align with the main website.
This commit is contained in:
Emil Gulamov 2024-06-25 01:44:45 +04:00
parent 85d13e8714
commit a766a2f462
2 changed files with 56 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/assets/styles/starlight.css
View file

@ -1,5 +1,6 @@
/* Dark mode colors. */ /* Dark mode colors. */
:root { :root {
--border: hsla(var(--border-neutral), .4);
--backdrop-color: #272727cc; --backdrop-color: #272727cc;
--sl-color-accent: #ff801f; --sl-color-accent: #ff801f;
--sl-color-accent-high: #ffa057; --sl-color-accent-high: #ffa057;
@ -13,10 +14,12 @@
--sl-color-gray-6: #272727; --sl-color-gray-6: #272727;
--sl-color-white: #fff; --sl-color-white: #fff;
--list-marker-color: #fb923c; --list-marker-color: #fb923c;
--border-neutral: 0, 0%, 25.1%;
} }
/* Light mode colors. */ /* Light mode colors. */
:root[data-theme="light"] { :root[data-theme="light"] {
--border: hsla(var(--border-yellow), .4);
--backdrop-color: #f6f6f699; --backdrop-color: #f6f6f699;
--sl-color-accent: #b73d00; --sl-color-accent: #b73d00;
--sl-color-accent-high: #562800; --sl-color-accent-high: #562800;
@ -31,11 +34,43 @@
--sl-color-gray-7: #f6f6f6; --sl-color-gray-7: #f6f6f6;
--sl-color-white: #181818; --sl-color-white: #181818;
--list-marker-color: #fb923c; --list-marker-color: #fb923c;
--border-yellow: 54.9, 96.7%, 88%;
} }
header { header {
background-color: transparent !important;
height: 4.5rem !important;
margin-inline: auto !important;
padding-block: 0 !important;
padding-inline: 1.5rem !important;
padding-inline-end: 0 !important;
}
header > div:first-of-type {
backdrop-filter: blur(12px) !important; backdrop-filter: blur(12px) !important;
background-color: var(--backdrop-color) !important; background-color: var(--backdrop-color) !important;
border: 1px var(--border) solid;
border-radius: 36px;
height: 100% !important;
margin-inline: auto !important;
margin-top: 1rem !important;
max-width: 1536px;
padding-inline: 2rem !important;
width: auto !important;
}
#starlight__sidebar {
border-radius: 1rem;
margin-top: 2rem !important;
}
.content-panel:first-of-type {
margin-top: 2rem !important;
}
.right-sidebar {
top: 2rem !important;
} }
select { select {

21
src/assets/styles/starlight_main.css
View file

@ -15,6 +15,8 @@
--sl-color-white: #fff; --sl-color-white: #fff;
--yellow-hsl: 43.3, 96.4%, 56.3%; --yellow-hsl: 43.3, 96.4%, 56.3%;
--overlay-yellow: hsla(var(--yellow-hsl), .2); --overlay-yellow: hsla(var(--yellow-hsl), .2);
--border: hsla(var(--border-neutral), .4);
--border-neutral: 0, 0%, 25.1%;
} }
/* Light mode colors. */ /* Light mode colors. */
@ -34,6 +36,8 @@
--sl-color-gray-7: #f6f6f6; --sl-color-gray-7: #f6f6f6;
--sl-color-white: #181818; --sl-color-white: #181818;
--yellow-hsl: 47.9, 95.8%, 53.1%; --yellow-hsl: 47.9, 95.8%, 53.1%;
--border-yellow: 54.9, 96.7%, 88%;
--border: hsla(var(--border-yellow), .4);
} }
.page { .page {
@ -42,8 +46,25 @@
} }
header { header {
background-color: transparent !important;
height: 4.5rem !important;
margin-inline: auto !important;
padding-block: 0 !important;
padding-inline: 1.5rem !important;
padding-inline-end: 0 !important;
}
header > div:first-of-type {
backdrop-filter: blur(12px) !important; backdrop-filter: blur(12px) !important;
background-color: var(--backdrop-color) !important; background-color: var(--backdrop-color) !important;
border: 1px var(--border) solid;
border-radius: 36px;
height: 100% !important;
margin-inline: auto !important;
margin-top: 1rem !important;
max-width: 1536px;
padding-inline: 2rem !important;
width: auto !important;
} }
select { select {