From a911b324b5e034b6f56bea77978a08664764ac73 Mon Sep 17 00:00:00 2001
From: "Edgar P. Burkhart" <git@edgarpierre.fr>
Date: Tue, 24 May 2022 20:15:38 +0200
Subject: [PATCH] Add logo

---
 nummi/main/static/main/css/index.css      |  6 ++++++
 nummi/main/static/main/css/main.css       |  2 +-
 nummi/main/static/main/css/nav.css        |  5 +++++
 nummi/main/static/main/svg/logo-white.svg | 22 ++++++++++++++++++++++
 nummi/main/static/main/svg/logo.svg       | 22 ++++++++++++++++++++++
 nummi/main/templates/main/base.html       |  3 ++-
 nummi/main/templates/main/index.html      |  2 +-
 7 files changed, 59 insertions(+), 3 deletions(-)
 create mode 100644 nummi/main/static/main/svg/logo-white.svg
 create mode 100644 nummi/main/static/main/svg/logo.svg

diff --git a/nummi/main/static/main/css/index.css b/nummi/main/static/main/css/index.css
index 340a2e4..d254083 100644
--- a/nummi/main/static/main/css/index.css
+++ b/nummi/main/static/main/css/index.css
@@ -4,6 +4,12 @@ h1 {
 	font-weight: 850;
 	letter-spacing: -.05em;
 	margin: 0;
+	line-height: 1.2em;
+}
+h1 img {
+	height: 1.2em;
+	vertical-align: top;
+	margin-right: var(--gap);
 }
 
 #categories > a {
diff --git a/nummi/main/static/main/css/main.css b/nummi/main/static/main/css/main.css
index 1cb4894..72d7151 100644
--- a/nummi/main/static/main/css/main.css
+++ b/nummi/main/static/main/css/main.css
@@ -24,7 +24,7 @@
 
 	--text-link: #0a35ccde;
 
-	--gap: 1em;
+	--gap: 1rem;
 
 	--red: #bf1500;
 	--green: var(--theme-2);
diff --git a/nummi/main/static/main/css/nav.css b/nummi/main/static/main/css/nav.css
index 7523faa..ecf6343 100644
--- a/nummi/main/static/main/css/nav.css
+++ b/nummi/main/static/main/css/nav.css
@@ -35,3 +35,8 @@ nav > a.home {
 nav > a.logout {
 	float: right;
 }
+nav > a img {
+	height: var(--nav-lh);
+	vertical-align: top;
+	margin-right: .5rem;
+}
diff --git a/nummi/main/static/main/svg/logo-white.svg b/nummi/main/static/main/svg/logo-white.svg
new file mode 100644
index 0000000..26abbda
--- /dev/null
+++ b/nummi/main/static/main/svg/logo-white.svg
@@ -0,0 +1,22 @@
+<svg version="1.1"
+	width="100"
+	height="100"
+	xmlns="http://www.w3.org/2000/svg">
+	
+	<defs>
+		<rect id="basemask" x="-10" y="-10" width="110" height="110" />
+		<rect id="line" x="45" y="-10" width="10" height="120" />
+	</defs>
+
+	<mask id="mask">
+		<use href="#basemask" fill="white" />
+		<use href="#line" fill="black" />
+		<use href="#line" transform="translate(20)" fill="black" />
+	</mask>
+
+	<polygon points="25,0 75,0 100,25 100,75 75,100 25,100 0,75 0,25"
+		fill="white"
+		mask="url(#mask)"
+		transform-origin="center center" transform="rotate(10) scale(.8)" />
+</svg>
+
diff --git a/nummi/main/static/main/svg/logo.svg b/nummi/main/static/main/svg/logo.svg
new file mode 100644
index 0000000..795f303
--- /dev/null
+++ b/nummi/main/static/main/svg/logo.svg
@@ -0,0 +1,22 @@
+<svg version="1.1"
+	width="100"
+	height="100"
+	xmlns="http://www.w3.org/2000/svg">
+	
+	<defs>
+		<rect id="basemask" x="-10" y="-10" width="110" height="110" />
+		<rect id="line" x="45" y="-10" width="10" height="120" />
+	</defs>
+
+	<mask id="mask">
+		<use href="#basemask" fill="white" />
+		<use href="#line" fill="black" />
+		<use href="#line" transform="translate(20)" fill="black" />
+	</mask>
+
+	<polygon points="25,0 75,0 100,25 100,75 75,100 25,100 0,75 0,25"
+		fill="#006633"
+		mask="url(#mask)"
+		transform-origin="center center" transform="rotate(10) scale(.8)" />
+</svg>
+
diff --git a/nummi/main/templates/main/base.html b/nummi/main/templates/main/base.html
index bb65d32..b39d20b 100644
--- a/nummi/main/templates/main/base.html
+++ b/nummi/main/templates/main/base.html
@@ -8,6 +8,7 @@
 		<title>{% block title %}Nummi{% endblock %}</title>
 	
 		{% block link %}
+		<link rel="icon" href="{% static 'main/svg/logo.svg' %}" type="image/svg+xml" />
 		<link rel="stylesheet" href="{% static 'main/css/main.css' %}" type="text/css" />
 		<link rel="stylesheet" href="{% static 'main/css/nav.css' %}" type="text/css" />
 		<link rel="stylesheet" href="{% static 'main/fontawesome/css/all.min.css' %}" type="text/css" />
@@ -19,7 +20,7 @@
 		<nav>
 			<a href="{% url 'index' %}"
 				class="home{% if request.resolver_match.url_name == 'index' %} cur{% endif %}">
-				Nummi
+				<img src="{% static 'main/svg/logo-white.svg' %}" />Nummi
 			</a>
 			<a href="{% url 'transactions' %}"
 				class="{% if request.resolver_match.url_name == 'transactions' %}cur{% endif %}">
diff --git a/nummi/main/templates/main/index.html b/nummi/main/templates/main/index.html
index 06a0205..c10b878 100644
--- a/nummi/main/templates/main/index.html
+++ b/nummi/main/templates/main/index.html
@@ -9,7 +9,7 @@
 {% endblock %}
 
 {% block body %}
-<h1>Nummi</h1>
+<h1><img src="{% static 'main/svg/logo.svg' %}" />Nummi</h1>
 
 {% if transactions %}
 <h2>Transactions</h2>