stepan/MSPPPPaM
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[ui] CSS – Montserrat 300/500, IBM Plex Serif 200/0.875rem, h1 větší, h2 barevnější, h3 světlejší pozadí, inline tlačítka stejně široká, odstraněna tmavá čára pod h1

Browse Source
This commit is contained in:
stepan
2026-03-18 23:23:52 +01:00
parent 78be7ec1c2
commit af6df61128
1 changed files with 44 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/auth-styl.css
+44 -40
View File
@@ -13,20 +13,20 @@
/* ------------------------------------------------------------
GOOGLE FONTS
Montserrat 100 – tři velikosti (viz níže)
IBM Plex Serif 300 – jedna velikost pro veškerý text
Montserrat 300/500 – tři velikosti (viz níže)
IBM Plex Serif 200 – jedna velikost pro veškerý text
------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100&family=IBM+Plex+Serif:ital,wght@0,300;1,300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500&family=IBM+Plex+Serif:ital,wght@0,200;1,200&display=swap');
/* ------------------------------------------------------------
TYPOGRAFICKÁ STUPNICE MONTSERRAT
============================================================
Velikost A – 2.2rem ... hlavní nadpis stránky (h1), jednou
Velikost B – 0.88rem ... nadpisy sekcí (h2, h3)
Velikost C – 0.78rem ... nejmenší = IBMPlexSerif velikost
(th, button, label, span#heslo-sila)
IBM Plex Serif ... 0.78rem pro veškerý ostatní text
Velikost A – 2.6rem ... hlavní nadpis stránky (h1), jednou, weight 300
Velikost B – 1.05rem ... nadpisy sekcí (h2, h3), weight 300
Velikost C – 0.78rem ... nejmenší (th weight 500, button/label weight 300)
= shodná s IBM Plex Serif optickou velikostí
IBM Plex Serif 200 ... 0.875rem pro veškerý ostatní text
------------------------------------------------------------ */
@@ -91,8 +91,8 @@ body {
background-color: var(--bg-hlavni);
color: var(--text-hlavni);
font-family: 'IBM Plex Serif', Georgia, serif;
font-size: 0.78rem; /* jedna velikost pro všechen IBM Plex Serif text */
font-weight: 300;
font-size: 0.875rem; /* IBM Plex Serif – trochu větší než dřív */
font-weight: 200;
line-height: 1.75;
min-height: 100vh;
display: flex;
@@ -173,15 +173,18 @@ body > h1 + h2 {
padding-top: 0;
}
/* h1 když za ním následuje h2 – zaoblení jen nahoře */
/* h1 když za ním následuje h2 – zaoblení jen nahoře, bez čáry dole */
body > h1:has(+ h2) {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
padding-bottom: 0.3rem;
box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.45); /* stín jen nahoře */
box-shadow: var(--stin-blok); /* stejný stín jako ostatní bloky, bez čáry */
}
/* Spodní mezera za posledním blokem */
/* h3 blok má o trochu světlejší pozadí než ostatní bloky */
body > h3 {
background-color: #292929;
}
body > *:last-child {
margin-bottom: var(--sekce-mezera);
}
@@ -205,26 +208,26 @@ section > * {
/* === VELIKOST A: hlavní nadpis stránky, jednou === */
h1 {
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-size: 2.2rem;
font-weight: 300;
font-size: 2.6rem;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--akcent-svetly);
line-height: 1.2;
line-height: 1.15;
}
/* === VELIKOST B: nadpisy sekcí === */
h2,
h3 {
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-size: 0.88rem;
letter-spacing: 0.18em;
font-weight: 300;
font-size: 1.05rem;
letter-spacing: 0.14em;
text-transform: uppercase;
}
h2 {
color: var(--ocel-svetly);
color: #9ab0c8; /* světlejší modrošedá – čitelná na tmavém i světlém */
}
h3 {
@@ -235,12 +238,12 @@ h3 {
(shodná s IBM Plex Serif = 0.78rem, aby text vypadal stejně velký) */
p {
font-size: 0.78rem; /* IBM Plex Serif velikost */
font-size: 0.875rem; /* IBM Plex Serif velikost */
}
strong {
color: var(--text-nadpis);
font-weight: 400; /* IBM Plex Serif nemá bold 300→400 */
font-weight: 300;
}
p > strong:first-child {
@@ -291,7 +294,7 @@ form p {
label {
display: block;
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-weight: 300;
font-size: 0.78rem;
letter-spacing: 0.1em;
text-transform: uppercase;
@@ -306,8 +309,8 @@ label:has(input[type="checkbox"]) {
align-items: center;
gap: 0.5rem;
font-family: 'IBM Plex Serif', Georgia, serif;
font-weight: 300;
font-size: 0.78rem;
font-weight: 200;
font-size: 0.875rem;
text-transform: none;
letter-spacing: normal;
color: var(--text-hlavni);
@@ -328,9 +331,9 @@ input[type="password"] {
border: 1px solid var(--ocel);
border-radius: var(--polomer-prvek);
padding: 0.45rem 0.7rem;
font-size: 0.78rem;
font-size: 0.875rem;
font-family: 'IBM Plex Serif', Georgia, serif;
font-weight: 300;
font-weight: 200;
box-shadow: var(--stin-input);
transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s;
outline: none;
@@ -406,10 +409,9 @@ button[type="button"] {
border-radius: var(--polomer-prvek);
padding: 0.48rem 1.1rem;
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-weight: 300;
font-size: 0.78rem;
letter-spacing: 0.12em;
text-transform: uppercase;
letter-spacing: 0.1em;
cursor: pointer;
transition: background-color 0.15s, border-color 0.15s, box-shadow 0.15s;
margin-top: 0.3rem;
@@ -458,8 +460,10 @@ form[style*="display: inline"] {
form[style*="display:inline"] button,
form[style*="display: inline"] button {
margin-top: 0;
padding: 0.2rem 0.55rem;
padding: 0.2rem 0;
font-size: 0.78rem;
min-width: 7rem; /* stejná šířka pro Smazat i Změnit heslo */
text-align: center;
}
@@ -470,7 +474,7 @@ form[style*="display: inline"] button {
#novy-heslo-sila {
display: inline-block;
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-weight: 300;
font-size: 0.78rem;
letter-spacing: 0.06em;
color: var(--text-jemny);
@@ -480,7 +484,7 @@ form[style*="display: inline"] button {
#tlacitko-duvod,
#novy-tlacitko-duvod {
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-weight: 300;
font-size: 0.78rem;
letter-spacing: 0.04em;
color: var(--text-jemny);
@@ -497,10 +501,10 @@ table {
font-size: 0.78rem;
}
/* === VELIKOST C: záhlaví tabulky === */
/* === VELIKOST C: záhlaví tabulky – weight 500 pro lepší čitelnost === */
table th {
font-family: 'Montserrat', sans-serif;
font-weight: 100;
font-weight: 500;
font-size: 0.78rem;
letter-spacing: 0.1em;
text-transform: uppercase;
@@ -518,8 +522,8 @@ table td {
border: 1px solid var(--ocel);
vertical-align: middle;
font-family: 'IBM Plex Serif', Georgia, serif;
font-weight: 300;
font-size: 0.78rem;
font-weight: 200;
font-size: 0.875rem;
}
table tr:nth-child(even) td {
@@ -557,8 +561,8 @@ code {
ol, ul {
padding-left: 1.4rem;
font-family: 'IBM Plex Serif', Georgia, serif;
font-weight: 300;
font-size: 0.78rem;
font-weight: 200;
font-size: 0.875rem;
}
ol li, ul li {
@@ -583,7 +587,7 @@ ol li, ul li {
}
h2, h3 {
font-size: 0.82rem;
font-size: 0.95rem;
}
table td form[style*="display:inline"],