Apply Domine and Figtree typography
This commit is contained in:
@@ -6,6 +6,9 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<base href="/" />
|
<base href="/" />
|
||||||
<ResourcePreloader />
|
<ResourcePreloader />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Domine:wght@400&family=Figtree:wght@400;500&display=swap" />
|
||||||
<link rel="stylesheet" href="@Assets["lib/bootstrap/dist/css/bootstrap.min.css"]" />
|
<link rel="stylesheet" href="@Assets["lib/bootstrap/dist/css/bootstrap.min.css"]" />
|
||||||
<link rel="stylesheet" href="@Assets["app.css"]" />
|
<link rel="stylesheet" href="@Assets["app.css"]" />
|
||||||
<link rel="stylesheet" href="@Assets["RolemasterDb.App.styles.css"]" />
|
<link rel="stylesheet" href="@Assets["RolemasterDb.App.styles.css"]" />
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
<div class="top-row">
|
<div class="top-row">
|
||||||
<div>
|
<div>
|
||||||
<span class="eyebrow">Starter stack</span>
|
<span class="eyebrow">Starter stack</span>
|
||||||
<strong>.NET 10 + Blazor + Minimal API + EF Core + SQLite</strong>
|
<span class="top-row-title">.NET 10 + Blazor + Minimal API + EF Core + SQLite</span>
|
||||||
</div>
|
</div>
|
||||||
<span class="status-pill">Seeded for attack and critical lookups</span>
|
<span class="status-pill">Seeded for attack and critical lookups</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -22,7 +22,7 @@
|
|||||||
|
|
||||||
.navbar-brand {
|
.navbar-brand {
|
||||||
font-size: 1.45rem;
|
font-size: 1.45rem;
|
||||||
font-family: Cambria, Georgia, serif;
|
font-family: "Figtree", "Segoe UI", sans-serif;
|
||||||
letter-spacing: 0.04em;
|
letter-spacing: 0.04em;
|
||||||
color: #fff1d2;
|
color: #fff1d2;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
@@ -71,6 +71,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.nav-item ::deep .nav-link {
|
.nav-item ::deep .nav-link {
|
||||||
|
font-family: "Figtree", "Segoe UI", sans-serif;
|
||||||
color: #f3ddbc;
|
color: #f3ddbc;
|
||||||
background: none;
|
background: none;
|
||||||
border: none;
|
border: none;
|
||||||
|
|||||||
@@ -187,7 +187,7 @@ else
|
|||||||
@foreach (var attackTable in referenceData.AttackTables)
|
@foreach (var attackTable in referenceData.AttackTables)
|
||||||
{
|
{
|
||||||
<div class="table-list-item">
|
<div class="table-list-item">
|
||||||
<strong>@attackTable.Label</strong>
|
<span class="table-list-title">@attackTable.Label</span>
|
||||||
<span class="muted">Attack table key: <code>@attackTable.Key</code></span>
|
<span class="muted">Attack table key: <code>@attackTable.Key</code></span>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<div class="table-list-item">
|
<div class="table-list-item">
|
||||||
<strong>@Table.Label</strong>
|
<span class="table-list-title">@Table.Label</span>
|
||||||
<div class="detail-grid">
|
<div class="detail-grid">
|
||||||
<div class="detail-item">
|
<div class="detail-item">
|
||||||
<span class="detail-label">Key</span>
|
<span class="detail-label">Key</span>
|
||||||
|
|||||||
@@ -8,6 +8,8 @@
|
|||||||
--panel: rgba(255, 250, 240, 0.82);
|
--panel: rgba(255, 250, 240, 0.82);
|
||||||
--line: rgba(111, 87, 59, 0.18);
|
--line: rgba(111, 87, 59, 0.18);
|
||||||
--shadow: 0 18px 40px rgba(41, 22, 11, 0.12);
|
--shadow: 0 18px 40px rgba(41, 22, 11, 0.12);
|
||||||
|
--font-body: "Domine", Georgia, serif;
|
||||||
|
--font-heading: "Figtree", "Segoe UI", sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
html, body {
|
html, body {
|
||||||
@@ -16,13 +18,48 @@ html, body {
|
|||||||
radial-gradient(circle at top, rgba(240, 223, 185, 0.55), transparent 28%),
|
radial-gradient(circle at top, rgba(240, 223, 185, 0.55), transparent 28%),
|
||||||
linear-gradient(180deg, #eadbc0 0%, #f4ecda 38%, #e2d3b7 100%);
|
linear-gradient(180deg, #eadbc0 0%, #f4ecda 38%, #e2d3b7 100%);
|
||||||
color: var(--ink);
|
color: var(--ink);
|
||||||
font-family: Georgia, "Palatino Linotype", serif;
|
font-family: var(--font-body);
|
||||||
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6,
|
||||||
|
label,
|
||||||
|
button,
|
||||||
|
summary,
|
||||||
|
th,
|
||||||
|
.eyebrow,
|
||||||
|
.panel-title,
|
||||||
|
.page-title,
|
||||||
|
.detail-label,
|
||||||
|
.branch-condition,
|
||||||
|
.critical-branch-condition,
|
||||||
|
.effect-stack h5,
|
||||||
|
.tag,
|
||||||
|
.stat-pill,
|
||||||
|
.status-pill,
|
||||||
|
.chip,
|
||||||
|
.affix-badge,
|
||||||
|
.table-list-title,
|
||||||
|
.top-row-title,
|
||||||
|
.legend-label {
|
||||||
|
font-family: var(--font-heading);
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong,
|
||||||
|
b {
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
a, .btn-link {
|
a, .btn-link {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
}
|
}
|
||||||
@@ -42,7 +79,7 @@ textarea {
|
|||||||
font-size: clamp(2.2rem, 4vw, 3.5rem);
|
font-size: clamp(2.2rem, 4vw, 3.5rem);
|
||||||
line-height: 0.95;
|
line-height: 0.95;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-family: Cambria, Georgia, serif;
|
font-family: var(--font-heading);
|
||||||
}
|
}
|
||||||
|
|
||||||
.lede {
|
.lede {
|
||||||
@@ -243,7 +280,6 @@ textarea {
|
|||||||
|
|
||||||
.branch-condition {
|
.branch-condition {
|
||||||
font-size: 0.82rem;
|
font-size: 0.82rem;
|
||||||
font-weight: 700;
|
|
||||||
letter-spacing: 0.06em;
|
letter-spacing: 0.06em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
color: #75562f;
|
color: #75562f;
|
||||||
@@ -263,7 +299,6 @@ textarea {
|
|||||||
|
|
||||||
.critical-cell-description {
|
.critical-cell-description {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-weight: 600;
|
|
||||||
color: #2c1a10;
|
color: #2c1a10;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -286,7 +321,6 @@ textarea {
|
|||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
letter-spacing: 0.05em;
|
letter-spacing: 0.05em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-weight: 700;
|
|
||||||
color: #6b4c29;
|
color: #6b4c29;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -365,7 +399,7 @@ textarea {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.affix-badge-value {
|
.affix-badge-value {
|
||||||
font-weight: 700;
|
letter-spacing: 0.04em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.affix-badge-fallback {
|
.affix-badge-fallback {
|
||||||
@@ -388,9 +422,10 @@ textarea {
|
|||||||
border: 1px solid rgba(127, 96, 55, 0.12);
|
border: 1px solid rgba(127, 96, 55, 0.12);
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-list-item strong {
|
.table-list-title {
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 0.6rem;
|
margin-bottom: 0.6rem;
|
||||||
|
color: var(--ink);
|
||||||
}
|
}
|
||||||
|
|
||||||
.chip-row {
|
.chip-row {
|
||||||
@@ -420,7 +455,6 @@ textarea {
|
|||||||
.details-block summary {
|
.details-block summary {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
font-weight: 600;
|
|
||||||
margin-bottom: 0.6rem;
|
margin-bottom: 0.6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -496,7 +530,6 @@ textarea {
|
|||||||
|
|
||||||
.critical-table th {
|
.critical-table th {
|
||||||
background: rgba(238, 223, 193, 0.45);
|
background: rgba(238, 223, 193, 0.45);
|
||||||
font-weight: 600;
|
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: 0.04em;
|
letter-spacing: 0.04em;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user