colin/uninsane
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

style: mess with the colors/headings

Browse Source
This commit is contained in:
Colin 2022-04-04 05:03:05 +00:00
parent 756e7b2f9b
commit 44b15d6a45
3 changed files with 59 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
sass/static/style.scss
View File

@ -36,11 +36,62 @@
}
}
@function hsb($h-hsb, $s-hsb, $b-hsb, $a: 1) {
@if $b-hsb == 0 {
@return hsla(0, 0, 0, $a)
} @else {
$l-hsl: ($b-hsb/2) * (2 - ($s-hsb/100));
$s-hsl: ($b-hsb * $s-hsb) / if($l-hsl < 50, $l-hsl * 2, 200 - $l-hsl * 2);
@return hsla($h-hsb, $s-hsl, $l-hsl, $a);
}
}
$color_cream: hsb(23, 11%, 100%);
$color_teal: hsb(191, 15%, 91%);
$color_purple: hsb(252, 15%, 95%);
$color_bg: $color_cream;
$color_title: $color_teal;
$color_header: $color_purple;
body
{
background-color: $color_bg;
font-family: "Gentium Basic","serif";
}
.body-text
{
text-align: justify;
max-width: 40em;
// center this within its container
margin-left: auto;
margin-right: auto;
h1
{
background-color: $color_title;
}
h2
{
background-color: $color_purple;
display: flex;
}
h2::after
{
content: "";
background: -moz-element(#tile-slash) center;
flex: 1 0 0;
margin-left: 0.1em;
margin-right: 0.1em;
}
}
/* font: Gentium Basic
* upstream: https://www.fontsquirrel.com/fonts/Gentium-Basic
* https://fonts.google.com/specimen/Gentium+Basic

2
templates/base.html
View File

@ -9,7 +9,7 @@
<body>
<section class="section">
<div class="container">
<div class="body-text">
{% block content %} {% endblock %}
</div>
</section>

9
templates/blog-page.html
View File

@ -1,9 +1,14 @@
{% extends "base.html" %}
{% block content %}
<h1 class="title">
<div>
<span id="tile-slash" style="font-size: 1.6em; opacity: 55%;">/</span>
</div>
<h1>
{{ page.title }}
</h1>
<p class="subtitle"><strong>{{ page.date }}</strong></p>
<p><strong>{{ page.date }}</strong></p>
{{ page.content | safe }}
{% endblock content %}