flambyte/RUX
1
0
Fork 0
mirror of https://old.git.ood.ovh/flambyte/RUX.git synced 2025-04-28 22:37:51 +02:00
Code Issues 11 Projects Releases Packages Wiki Activity Actions

feat(font): Define font size

Browse source
This commit is contained in:
Hactarus 2023-03-16 13:04:56 +01:00
parent 3dc405f213
commit 6780fbd95f
3 changed files with 26 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/assets/css/1024_default.css Normal file
View file

@ -0,0 +1,5 @@
:root {
--text-h2: 25pt
--text-guide: 20pt;
--text-default: 16pt;
}

18
src/assets/css/style_hactarus.css
View file

@ -2,6 +2,7 @@
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
font-size: var(--text-default);
} }
menu { menu {
@ -40,11 +41,24 @@ header {
section { section {
padding-top: 5vh; padding-top: 5vh;
text-align: justify;
}
section > figure {
margin: auto;
text-align: center;
} }
h2 { h2 {
padding: 1vh 2vw;
background-color: var(--color-bg); background-color: var(--color-bg);
color: var(--color-txt); color: var(--color-txt);
font-size: var(--text-h2);
}
p {
padding: 1vh 2vw;
color: var(--color-bg);
} }
/* Decorations */ /* Decorations */
@ -98,4 +112,8 @@ h2 {
img { img {
max-width: 100vw; max-width: 100vw;
}
.guide__el {
font-size: var(--text-guide);
} }

4
src/index.html
View file

@ -34,10 +34,12 @@
<link rel="stylesheet" href="assets/css/style_hactarus.css"> <link rel="stylesheet" href="assets/css/style_hactarus.css">
<link rel="stylesheet" media='(prefers-color-scheme: dark)' href="assets/css/dark_theme.css" /> <link rel="stylesheet" media='(prefers-color-scheme: dark)' href="assets/css/dark_theme.css" />
<link rel="stylesheet" media='(prefers-color-scheme: light)' href="assets/css/light_theme.css" /> <link rel="stylesheet" media='(prefers-color-scheme: light)' href="assets/css/light_theme.css" />
<link rel="stylesheet" media='screen and (min-width: 1024px)' href="assets/css/1024_default.css" />
<!-- <!--
<link rel="stylesheet" media='screen and (min-width: 750px)' href="assets/css/750_phone.css" /> <link rel="stylesheet" media='screen and (min-width: 750px)' href="assets/css/750_phone.css" />
<link rel="stylesheet" media='screen and (min-width: 800px)' href="assets/css/800_tablet.css" /> <link rel="stylesheet" media='screen and (min-width: 800px)' href="assets/css/800_tablet.css" />
<link rel="stylesheet" media='screen and (max-width: 1024px)' href="assets/css/1024_pc.css" /> --> <link rel="stylesheet" media='screen and (max-width: 1024px)' href="assets/css/1024_pc.css" />
//-->
<script src="assets/js/app.js" defer></script> <script src="assets/js/app.js" defer></script>
<script src="assets/js/theme.js" defer></script> <script src="assets/js/theme.js" defer></script>