feat: finish layout
This commit is contained in:
parent
37fb4eec16
commit
2d61115617
12
Makefile
12
Makefile
|
@ -11,13 +11,15 @@ STATIC_DIR=static
|
||||||
OUTPUT_DIR=output
|
OUTPUT_DIR=output
|
||||||
|
|
||||||
# The pandoc template to use
|
# The pandoc template to use
|
||||||
TEMPLATE=template.html
|
TEMPLATE=utils/template.html
|
||||||
|
|
||||||
## You should not need to change anything beyond this line
|
|
||||||
|
|
||||||
# The pandoc lua filter to use
|
# The pandoc lua filter to use
|
||||||
# The language code and file extension will be appended later
|
# The language code and file extension will be appended later
|
||||||
FILTER=filters/link-filter.
|
FILTER=utils/link-filter.
|
||||||
|
|
||||||
|
## You should not need to change anything beyond this line
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
STATIC=$(patsubst $(STATIC_DIR)/%,$(OUTPUT_DIR)/%,$(shell find $(STATIC_DIR) -type f))
|
STATIC=$(patsubst $(STATIC_DIR)/%,$(OUTPUT_DIR)/%,$(shell find $(STATIC_DIR) -type f))
|
||||||
OUTPUT=$(patsubst $(INPUT_DIR)/%.md,$(OUTPUT_DIR)/%/index.html,$(shell find $(INPUT_DIR) -type f))
|
OUTPUT=$(patsubst $(INPUT_DIR)/%.md,$(OUTPUT_DIR)/%/index.html,$(shell find $(INPUT_DIR) -type f))
|
||||||
|
@ -53,7 +55,7 @@ test:
|
||||||
cd $(OUTPUT_DIR); python3 -m http.server 9000
|
cd $(OUTPUT_DIR); python3 -m http.server 9000
|
||||||
|
|
||||||
mon:
|
mon:
|
||||||
@echo "find $(INPUT_DIR)/ $(STATIC_DIR)/ $(dir $(TEMPLATE))/ -type f | entr make"
|
@echo "find $(INPUT_DIR)/ $(STATIC_DIR)/ $(dir $(TEMPLATE)) -type f | entr make"
|
||||||
|
|
||||||
.PHONY: clean test
|
.PHONY: clean test
|
||||||
|
|
||||||
|
|
|
@ -12,7 +12,7 @@ Anyways, this tutorial will focus on how to use Mastodon and some basic Fedivers
|
||||||
|
|
||||||
If you haven't already then go register an account over at ~vern, there is also a guide for doing that [here](/guides/register) (Make sure to enable Mastodon as a service or [contact the ~vern administrators](/admins/) to have them create it for you)
|
If you haven't already then go register an account over at ~vern, there is also a guide for doing that [here](/guides/register) (Make sure to enable Mastodon as a service or [contact the ~vern administrators](/admins/) to have them create it for you)
|
||||||
|
|
||||||
===== Logging in =====
|
## Logging in
|
||||||
|
|
||||||
Open up your web browser and go to [fedi.vern.cc](https://fedi.vern.cc), you will see a login screen here. Simply input the email address and password you used for registration, if you are having issues logging in then [contact the ~vern administrators](/admins/) who will help you out.
|
Open up your web browser and go to [fedi.vern.cc](https://fedi.vern.cc), you will see a login screen here. Simply input the email address and password you used for registration, if you are having issues logging in then [contact the ~vern administrators](/admins/) who will help you out.
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>A redirect to the english homepage</title>
|
<title>A redirect to the english homepage</title>
|
||||||
<meta http-equiv = "refresh" content = "2; url = https://wiki.vern.cc/en/" />
|
<meta http-equiv = "refresh" content = "0; url = ./en/" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<main>
|
<main>
|
||||||
|
|
|
@ -0,0 +1,95 @@
|
||||||
|
/* This stylesheet was specifically made for the ~vern wiki */
|
||||||
|
/* And it will only suit the layout of the ~vern wiki */
|
||||||
|
/* Copyright © Leo Gavilieau, licensed under CC-BY-SA 4.0 International */
|
||||||
|
|
||||||
|
:root {
|
||||||
|
/* Font stacks */
|
||||||
|
--casualFonts: DejaVu Sans Mono, monospace;
|
||||||
|
--bgColor: #282c34;
|
||||||
|
--txtColor: #bbc2cf;
|
||||||
|
--linkColor: #ff6c6b;
|
||||||
|
--headerColor: #51afef;
|
||||||
|
}
|
||||||
|
/* responsiveness */
|
||||||
|
@media screen and (min-width: 820px) {
|
||||||
|
:root { --mainSize: 65vw; }
|
||||||
|
header {
|
||||||
|
display:flex;
|
||||||
|
justify-content:space-between;
|
||||||
|
align-items:center;
|
||||||
|
white-space:nowrap;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 820px) { :root { --mainSize: 85vw; } }
|
||||||
|
@media screen and (max-width: 620px) { :root { --mainSize: 95vw; } }
|
||||||
|
@media screen and (max-width: 560px) {
|
||||||
|
:root { --mainSize: 100vw; }
|
||||||
|
header { display: initial; text-align:center; }
|
||||||
|
#logo { background-position: center; }
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: var(--casualFonts);
|
||||||
|
background: var(--bgColor);
|
||||||
|
color: var(--txtColor);
|
||||||
|
line-height: 1.5rem;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
header,main,footer {
|
||||||
|
margin: auto;
|
||||||
|
width: var(--mainSize);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header styling (logo, nav etc.) */
|
||||||
|
|
||||||
|
header {
|
||||||
|
border-bottom: 4px solid var(--linkColor);
|
||||||
|
border-radius: 1rem;
|
||||||
|
padding-bottom:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logo {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background: url(/verntrans.svg);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
border-top: 4px solid var(--linkColor);
|
||||||
|
border-radius: 1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
footer p { margin: 0.2em 0 0.2em 0; }
|
||||||
|
|
||||||
|
/* text styling */
|
||||||
|
h1,h2,h3,h4,h5.h6 {
|
||||||
|
color: var(--headerColor);
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
h1 { font-size: 1.95rem}
|
||||||
|
h2 { font-size:1.45rem; }
|
||||||
|
h3 { font-size:1.3rem; }
|
||||||
|
h4 { font-size: 1.1rem;}
|
||||||
|
h5 { font-size: 0.9rem; }
|
||||||
|
h6 { font-size: 0.7rem; }
|
||||||
|
|
||||||
|
pre,code { font-size: 0.85rem; }
|
||||||
|
|
||||||
|
/* link styling */
|
||||||
|
a {
|
||||||
|
color: var(--linkColor);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover { text-decoration: underline; }
|
|
@ -0,0 +1 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="50" height="50" viewBox="0 0 50" version="1.1" id="svg5" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"> <defs id="defs2"> <linearGradient id="linearGradient8482-1"> <stop style="stop-color:#865aff;stop-opacity:1;" offset="0" id="stop8495" /> <stop style="stop-color:#865aff;stop-opacity:0;" offset="1" id="stop8497" /> </linearGradient> <linearGradient id="linearGradient8482"> <stop style="stop-color:#1aff00;stop-opacity:1;" offset="0" id="stop8490" /> <stop style="stop-color:#865aff;stop-opacity:0;" offset="1" id="stop8492" /> </linearGradient> <linearGradient id="linearGradient8482-2"> <stop style="stop-color:#ff0050;stop-opacity:1;" offset="0" id="stop8478" /> <stop style="stop-color:#865aff;stop-opacity:0;" offset="1" id="stop8480" /> </linearGradient> </defs> <g id="layer1"> <text xml:space="preserve" style="font-size:32.0001px;fill:#e6e6e6;stroke-width:1" x="4.995791" y="36.298496" id="text113"><tspan id="tspan111" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:32.0001px;font-family:'Fira Code', 'FiraCode Nerd Font', 'DejaVu Sans Mono', 'JetBrains Mono', monospace;-inkscape-font-specification:'\'Fira Code\', \'FiraCode Nerd Font\', \'DejaVu Sans Mono\', \'JetBrains Mono\', monospace';fill:#ff6c6b;stroke-width:3.97086" x="4.995791" y="36.298496">~V</tspan></text> </g> </svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -10,10 +10,12 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
|
<div id="logo"></div>
|
||||||
<nav>
|
<nav>
|
||||||
<a href="/">Homepage</a>
|
<a href="/">Language list</a>
|
||||||
<a href="http://git.vern.cc/vern/wiki/commits/branch/master">Recent changes</a>
|
<a href="http://git.vern.cc/vern/wiki/commits/branch/master">Recent changes</a>
|
||||||
<a href="http://git.vern.cc/vern/wiki">Source</a>
|
<a href="http://git.vern.cc/vern/wiki">Source</a>
|
||||||
|
<a href="/authors/">Wiki Authors</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
Loading…
Reference in New Issue