Merge branch 'env-and-templates' into 'main'
Env and templates See merge request gaiety/pronoun-monster!1
This commit is contained in:
commit
e1c8dcce36
8 changed files with 79 additions and 13 deletions
1
.tool-versions
Normal file
1
.tool-versions
Normal file
|
@ -0,0 +1 @@
|
|||
nodejs 19.7.0
|
10
app.js
10
app.js
|
@ -14,8 +14,11 @@ app.set('views', './src/views')
|
|||
|
||||
app.use(express.static('dist'))
|
||||
|
||||
const siteName = "Pronoun Site"
|
||||
|
||||
app.get('/', () => {
|
||||
res.render('home')
|
||||
const pageTitle = siteName;
|
||||
res.render('home', { siteName, pageTitle } )
|
||||
})
|
||||
|
||||
app.get('/:nominative/:accusative/:predicative_possessive/:reflexive', (req, res) => {
|
||||
|
@ -38,8 +41,11 @@ app.get('/:nominative/:accusative/:pronominal_possessive/:predicative_possessive
|
|||
predicative_possessive: predicativePossessive,
|
||||
reflexive,
|
||||
} = req.params
|
||||
|
||||
const pageTitle = [nominative, accusative, pronominalPossessive, predicativePossessive, reflexive].join("/") + " - " + siteName;
|
||||
|
||||
res.render('individual', {
|
||||
nominative, accusative, pronominalPossessive, predicativePossessive, reflexive
|
||||
siteName, pageTitle, nominative, accusative, pronominalPossessive, predicativePossessive, reflexive
|
||||
})
|
||||
})
|
||||
|
||||
|
|
32
src/app.css
32
src/app.css
|
@ -1,3 +1,35 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
--background: #F8FAF9; /* Sage/Light/2 */
|
||||
--callout: #ECEFED; /* Sage/Light/4 */
|
||||
--stroke: #D7DCDA; /* Sage/Light/7 */
|
||||
--text-shout: #164430; /* Green/Dark/6 */
|
||||
--text-murmur: #113123; /* Green/Dark/4 */
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--background);
|
||||
color: var(--text-murmur);
|
||||
font-family: Manrope, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4 {
|
||||
color: var(--text-shout);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: "Redaction", Georgia, 'Times New Roman', Times, serif;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: "Redaction 10", Georgia, 'Times New Roman', Times, serif;
|
||||
}
|
||||
|
||||
footer {
|
||||
border-color: var(--stroke);
|
||||
}
|
|
@ -1,4 +1,3 @@
|
|||
<div class="container mx-auto my-8">
|
||||
<h1 class="text-3xl">This is going to be such a cool site!</h1>
|
||||
<p>Check the readme!</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,4 +1 @@
|
|||
<div class="container mx-auto my-8">
|
||||
<h1 class="text-3xl">Individual</h1>
|
||||
{{nominative}}/{{accusative}}/{{pronominalPossessive}}/{{predicativePossessive}}/{{reflexive}}
|
||||
</div>
|
||||
<h1 class="text-5xl lg:text-6xl">{{nominative}}/​{{accusative}}/​{{pronominalPossessive}}/​{{predicativePossessive}}/​{{reflexive}}</h1>
|
||||
|
|
|
@ -2,10 +2,20 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Example App</title>
|
||||
<title>{{{pageTitle}}}</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@500;800&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://fonts.cdnfonts.com/css/redaction">
|
||||
<link rel="stylesheet" href="/app.css">
|
||||
</head>
|
||||
<body>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
{{> header siteName=siteName }}
|
||||
<div class="mx-10 mt-10 mb-[60px] lg:mx-[90px] lg:mt-[90px] xl:mx-[120px] xl:mt-[120px] grow flex flex-col">
|
||||
<div class="grow flex flex-col">
|
||||
{{{body}}}
|
||||
</div>
|
||||
{{> footer }}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
18
src/views/partials/footer.handlebars
Normal file
18
src/views/partials/footer.handlebars
Normal file
|
@ -0,0 +1,18 @@
|
|||
<footer class="flex-end border-t mt-10 pt-10 lg:flex lg:flex-row lg:justify-between lg:gap-6">
|
||||
|
||||
<div>
|
||||
<h3 class="leading-9 mb-2">Made by monsters</h3>
|
||||
|
||||
<ul class="mb-10">
|
||||
<li><a href="#" class="font-bold">Gaiety</a> who uses fae/faer, she/her</li>
|
||||
<li><a href="#" class="font-bold">Angela</a> who uses it/its, she/her</li>
|
||||
<li><a href="#" class="font-bold">Rizzo</a> who uses he/him, they/them, xier/xies</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="space-y-2 lg:text-right">
|
||||
<p>This site has a license of some sort, and that's linked <a href="#" class="font-bold">here.</a></p>
|
||||
|
||||
<p>Thanks for visiting!</p>
|
||||
</div>
|
||||
</footer>
|
3
src/views/partials/header.handlebars
Normal file
3
src/views/partials/header.handlebars
Normal file
|
@ -0,0 +1,3 @@
|
|||
<div class="p-10 lg:px-[60px]">
|
||||
<h2 class="text-xl"><a href="/">{{{siteName}}}</a></h2>
|
||||
</div>
|
Loading…
Add table
Reference in a new issue