joeac/joeac.net-symfony
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

whitespace

Browse Source
This commit is contained in:
Joe Carstairs
2025-05-25 06:46:35 +01:00
parent b1133e0ace
commit 3a3cc28aee
6 changed files with 116 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
public/css/base.css
View File

@@ -110,7 +110,7 @@ img {
[content-start] [content-start]
minmax(var(--grid-max-content-width), auto) minmax(var(--grid-max-content-width), auto)
[content-end]; [content-end];
column-gap: var(--spacing-block-sm); column-gap: var(--spacing-block-sm);
max-width: var(--grid-total-width); max-width: var(--grid-total-width);
--body-margin-inline-end: 6rem; --body-margin-inline-end: 6rem;
@@ -235,8 +235,8 @@ strong {
/** Blog feed */ /** Blog feed */
.h-feed ul { .h-feed ul {
list-style: none; list-style: none;
margin-inline: 0; margin-inline: 0;
} }
/** Block quotes */ /** Block quotes */

102
public/css/cv.css
View File

@@ -1,86 +1,86 @@
div:has(img) { div:has(img) {
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
margin-inline: auto; margin-inline: auto;
} }
div img { div img {
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
border-radius: 1rem; border-radius: 1rem;
filter: contrast(1.25); filter: contrast(1.25);
} }
div:has(img)::after { div:has(img)::after {
/* Colour overlay */ /* Colour overlay */
background-color: var(--colour-primary-80); background-color: var(--colour-primary-80);
opacity: 0.3; opacity: 0.3;
/* Same size and shape as the img */ /* Same size and shape as the img */
border-radius: 1rem; border-radius: 1rem;
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
/* Positioned on top of the img */ /* Positioned on top of the img */
display: block; display: block;
position: relative; position: relative;
top: -6rem; top: -6rem;
/* A content value is needed to get the ::after to render */ /* A content value is needed to get the ::after to render */
content: ''; content: '';
} }
header { header {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
text-align: center; text-align: center;
border-block-end: 1px solid var(--colour-primary-fg); border-block-end: 1px solid var(--colour-primary-fg);
} }
header h1 { header h1 {
grid-column: 1 / 3; grid-column: 1 / 3;
text-align: center; text-align: center;
} }
.technical-skills h3 { .technical-skills h3 {
text-align: start; text-align: start;
} }
.technical-skills ul { .technical-skills ul {
color: var(--colour-primary-fg-accent); color: var(--colour-primary-fg-accent);
margin-inline-start: var(--spacing-inline-md); margin-inline-start: var(--spacing-inline-md);
} }
@media (min-width: 46rem) { @media (min-width: 46rem) {
.technical-skills section { .technical-skills section {
display: flex; display: flex;
gap: var(--spacing-inline-sm); gap: var(--spacing-inline-sm);
align-items: baseline; align-items: baseline;
} }
.technical-skills section h3::after { .technical-skills section h3::after {
content: '/'; content: '/';
margin-inline: var(--spacing-inline-sm); margin-inline: var(--spacing-inline-sm);
} }
.technical-skills section ul { .technical-skills section ul {
display: flex; display: flex;
gap: var(--spacing-inline-sm); gap: var(--spacing-inline-sm);
list-style: none; list-style: none;
margin-inline-start: 0; margin-inline-start: 0;
} }
.technical-skills section ul li + li::before { .technical-skills section ul li + li::before {
content: '•'; content: '•';
margin-inline-end: var(--spacing-inline-sm); margin-inline-end: var(--spacing-inline-sm);
} }
} }
:is(.experience, .passions) :is(ol, ul) { :is(.experience, .passions) :is(ol, ul) {
list-style: none; list-style: none;
margin-inline: 0; margin-inline: 0;
} }
:is(.experience, .passions) :is(ol, ul) li { :is(.experience, .passions) :is(ol, ul) li {
margin-block-start: var(--spacing-block-sm); margin-block-start: var(--spacing-block-sm);
} }

78
public/css/hcard.css
View File

@@ -1,57 +1,57 @@
.h-card div:has(img) { .h-card div:has(img) {
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
margin-inline: auto; margin-inline: auto;
} }
.h-card img { .h-card img {
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
border-radius: 1rem; border-radius: 1rem;
filter: contrast(1.25); filter: contrast(1.25);
} }
.h-card div:has(img)::after { .h-card div:has(img)::after {
/* Colour overlay */ /* Colour overlay */
background-color: var(--colour-primary-80); background-color: var(--colour-primary-80);
opacity: 0.3; opacity: 0.3;
/* Same size and shape as the img */ /* Same size and shape as the img */
border-radius: 1rem; border-radius: 1rem;
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
/* Positioned on top of the img */ /* Positioned on top of the img */
display: block; display: block;
position: relative; position: relative;
top: -6rem; top: -6rem;
/* A content value is needed to get the ::after to render */ /* A content value is needed to get the ::after to render */
content: ''; content: '';
} }
@media (min-width: 36rem) { @media (min-width: 36rem) {
.h-card { .h-card {
grid-column: media-start / content-end; grid-column: media-start / content-end;
display: grid; display: grid;
grid-template-columns: subgrid; /** Subgrid of main column layout */ grid-template-columns: subgrid; /** Subgrid of main column layout */
grid-template-rows: min-content 1fr; grid-template-rows: min-content 1fr;
grid-template-areas: grid-template-areas:
"empty heading" "empty heading"
"photo text"; "photo text";
} }
.h-card div:has(img) { .h-card div:has(img) {
grid-area: photo; grid-area: photo;
margin-block-start: var(--spacing-block-sm); margin-block-start: var(--spacing-block-sm);
} }
.h-card header { .h-card header {
grid-area: heading; grid-area: heading;
} }
.h-card__text { .h-card__text {
grid-area: text; grid-area: text;
} }
} }

12
templates/base.html.twig
View File

@@ -1,19 +1,19 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-GB"> <html lang="en-GB">
<head> <head>
{{ include('components/head/_meta.html.twig') }} {{ include('components/head/_meta.html.twig') }}
{{ include('components/head/_indie_web.html.twig') }} {{ include('components/head/_indie_web.html.twig') }}
{{ include('components/head/_stylesheets.html.twig') }} {{ include('components/head/_stylesheets.html.twig') }}
{{ include('components/head/_feeds.html.twig') }} {{ include('components/head/_feeds.html.twig') }}
{{ include('components/head/_open_graph.html.twig') }} {{ include('components/head/_open_graph.html.twig') }}
{{ include('components/head/_twitter.html.twig') }} {{ include('components/head/_twitter.html.twig') }}
</head> </head>
<body> <body>
{{ include('components/_navbar.html.twig') }} {{ include('components/_navbar.html.twig') }}
<main> <main>
{% block content %}{% endblock %} {% block content %}{% endblock %}
</main> </main>
</body> </body>
</html> </html>

22
templates/components/_navbar.html.twig
View File

@@ -1,13 +1,13 @@
<nav class="navbar"> <nav class="navbar">
<ul> <ul>
<li> <li>
<a href="/">Home</a> <a href="/">Home</a>
</li> </li>
<li> <li>
<a href="/blog">Blog</a> <a href="/blog">Blog</a>
</li> </li>
<li> <li>
<a href="{{ path('notes') }}">Notes</a> <a href="{{ path('notes') }}">Notes</a>
</li> </li>
</ul> </ul>
</nav> </nav>

12
templates/notes.html.twig
View File

@@ -4,15 +4,15 @@
<section class="h-feed"> <section class="h-feed">
<h1 class="p-name">Joe Carstairs' notes</h1> <h1 class="p-name">Joe Carstairs' notes</h1>
<p hidden> <p hidden>
These links are collected by These links are collected by
<a class="p-author h-card" href="{{ url('index') }}"> <a class="p-author h-card" href="{{ url('index') }}">
Joe Carstairs Joe Carstairs
</a>. </a>.
</p> </p>
<p hidden> <p hidden>
<a class="u-url" href="{{ url('notes') }}">Permalink</a> <a class="u-url" href="{{ url('notes') }}">Permalink</a>
</p> </p>
<nav class="skip-to"> <nav class="skip-to">
Skip to: Skip to: