jutty/blog
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add responsive margins

Browse source
This commit is contained in:
jultty 2024-05-20 16:14:12 -03:00
commit 02908c3f75
4 changed files with 39 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

28
assets/css/style.css
View file

@ -75,3 +75,31 @@ footer {
.footer-back {
float: right;
}
/* tablet */
@media (min-width: 401px) {
.article { margin: 0 45px; }
.article p {
margin: 25px 0px;
}
}
/* widescreen */
@media (min-width: 1000px) {
.article {
display: grid;
grid-template-columns: 1fr 700px 1fr;
}
.article p {
grid-column-start: 2;
margin: 15px;
}
}
/* phone */
@media (max-width: 400px) {
.article { margin: 0 20px; }
.article p {
margin: 25px 0px;
}
}

8
posts/meeting-the-bsd-family.html generated
View file

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<meta name="author" content="Juno Takano" />
<meta name="dcterms.date" content="2024-05-20" />
<title>Meeting the BSD Family • jutty.dev</title>
<title>Meeting the BSD family • jutty.dev</title>
<style>
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
@ -23,8 +23,9 @@
</head>
<body>
<header id="title-block-header">
<h1 class="title">Meeting the BSD Family</h1>
<h1 class="title">Meeting the BSD family</h1>
</header>
<main class="article">
<p>During this year I have been delving deeper and deeper in the BSD
realm. Switching my home server to FreeBSD, trying NetBSD and OpenBSD on
my backup machine, getting a cheap SSD to see how they’d all run on my
@ -103,6 +104,8 @@ better has been a joy. It opened up whole new avenues and perspectives
to understanding operating systems as a whole, and how beyond
Linux-based OSs there are numerous other free and open source operating
systems that strengthen the diversity in this field.</p>
</main class="article">
</body>
<footer>
<hr/>
<div class="footer-text">
@ -115,5 +118,4 @@ systems that strengthen the diversity in this field.</p>
</span>
</div>
</footer>
</body>
</html>

4
posts/scripts-em-ocaml.html generated
View file

@ -86,6 +86,7 @@
<header id="title-block-header">
<h1 class="title">Scripts em OCaml</h1>
</header>
<main class="article">
<p>Este blog gera suas postagens com o Pandoc, mas quem faz o trabalho
lógico de identificar os arquivos e montar os comandos é um pequeno
script em OCaml.</p>
@ -127,6 +128,8 @@ a directory/Non-recursively - Rosetta Code</a></li>
<li><a href="https://jez.io/pandoc-markdown-css-theme/">Pandoc Markdown
CSS Theme</a></li>
</ul>
</main class="article">
</body>
<footer>
<hr/>
<div class="footer-text">
@ -139,5 +142,4 @@ CSS Theme</a></li>
</span>
</div>
</footer>
</body>
</html>

4
posts/template.html generated
View file

@ -59,10 +59,13 @@ $endif$
$table-of-contents$
</nav>
$endif$
<main class="article">
$body$
</main class="article">
$for(include-after)$
$include-after$
$endfor$
</body>
<footer>
<hr/>
<div class="footer-text">
@ -79,5 +82,4 @@ $if(date)$
$endif$
</div>
</footer>
</body>
</html>