gaiety/pronoun-monster
gaiety/pronoun-monster
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'monsterize' into 'main'

Browse source 
Monsterize

See merge request gaiety/pronoun-monster!3
This commit is contained in:
Ava Gaiety W 2023-09-01 18:00:11 +00:00
commit d5c7862294
No known key found for this signature in database
15 changed files with 65 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
.DS_Store vendored
View file

Binary file not shown.

2
package.json
View file

@ -10,8 +10,10 @@
"serve:handlebars": "node app.js",
"serve:css": "tailwindcss -i ./src/app.css -o ./dist/app.css --watch",
"serve:svg": "nodemon --watch 'src/svgs/*' -e svg --exec 'npm run build:svg'",
"serve:svg": "nodemon --watch 'src/images/*' --exec 'npm run build:images'",
"build:css": "tailwindcss -i ./src/app.css -o ./dist/app.css",
"build:svg": "svgdir2sprite ./src/svgs ./dist/spritesheet.svg",
"build:images": "mkdir -p ./dist ./dist/images && cp ./src/images/* ./dist/images/",
"test": "ava",
"lint": "prettier --check .",
"prepare": "husky install"

BIN
src/.DS_Store vendored
View file

Binary file not shown.

32
src/app.css
View file

@ -30,6 +30,25 @@ body {
font-weight: 500;
}
body::after {
content: "";
background-image: url("images/bg.jpeg");
filter: grayscale(50%);
position: fixed;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: -1;
opacity: 0.05;
}
header h2 {
font-family: "Special Elite", cursive;
font-size: 1.5em;
line-height: 2em;
}
h1,
h2,
h3,
@ -44,7 +63,14 @@ h4 {
}
h1 {
font-family: "Redaction", Georgia, "Times New Roman", Times, serif;
font-family: "Special Elite", cursive;
color: var(--background);
background-color: var(--text-shout);
display: inline-block;
padding: 0.35em 0.4em 0.15em;
border-radius: 0 1.2rem;
margin-left: -0.4em;
transform: skewY(-3deg);
}
h2 {
@ -110,4 +136,8 @@ footer {
@apply border-r;
border-color: var(--stroke);
}
header h2 {
font-size: 2em;
}
}

BIN
src/images/.DS_Store vendored Normal file
View file

Binary file not shown.

BIN
src/images/bg.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 350 KiB

BIN
src/svgs/.DS_Store vendored
View file

Binary file not shown.

7
src/svgs/claw.svg Normal file
View file

@ -0,0 +1,7 @@
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g>
<g transform="rotate(-98.4103, 13.3507, 12.3419)" id="svgg">
<path id="path0" d="m9.73959,0.74372c0.02531,0.06154 0.18636,0.21856 0.35778,0.34897c0.62715,0.47719 2.93009,2.61072 3.60682,3.34156c0.37192,0.4016 1.6607,1.84269 2.06178,2.30539c0.14926,0.1723 0.49805,0.64705 0.77501,1.05511c0.27696,0.40806 0.76366,1.01758 1.08147,1.35441c0.35656,0.37786 0.88429,1.11499 1.37772,1.92421c0.43983,0.7215 1.09256,1.70277 1.45043,2.18066c0.35787,0.47789 0.88176,1.26014 1.16413,1.7383c0.40893,0.69244 0.51952,0.82773 0.543,0.66451c0.10797,-0.75136 -2.27161,-5.51864 -3.6372,-7.28679c-0.22415,-0.29014 -0.55793,-0.78383 -0.74184,-1.09692c-0.18391,-0.31318 -0.55095,-0.76244 -0.81551,-0.99829c-0.26465,-0.23585 -0.74839,-0.78575 -1.07501,-1.222c-0.99593,-1.32997 -1.79861,-1.94176 -4.67066,-3.56004c-0.38406,-0.21638 -0.88412,-0.49866 -1.11115,-0.62715c-0.22712,-0.12857 -0.39217,-0.18339 -0.36677,-0.12194m-3.09393,0.84746c0.11417,0.14062 0.69855,0.85069 1.29864,1.57795c0.60009,0.72735 1.36113,1.72197 1.69125,2.21025c0.8115,1.20044 1.73952,2.37513 2.67906,3.39114c0.54266,0.58682 0.85723,1.01339 1.02988,1.39657c0.25871,0.57425 0.71731,1.28511 1.59488,2.47202c0.28394,0.38406 0.85339,1.16963 1.26547,1.74571c0.7332,1.02508 1.39797,1.83064 2.23259,2.70586c0.22895,0.24004 0.79666,1.01539 1.26154,1.72302c0.46497,0.70763 0.85889,1.27297 0.87548,1.25639c0.05307,-0.05298 -0.66241,-1.84435 -1.34691,-3.3722c-0.0968,-0.21603 -0.22555,-0.5499 -0.28604,-0.74193c-0.19421,-0.61571 -0.43748,-1.02543 -1.21833,-2.05121c-0.92663,-1.21737 -1.39317,-1.96506 -1.90073,-3.04636c-0.6199,-1.32055 -1.09613,-1.96122 -2.47184,-3.3255c-0.70186,-0.6961 -1.46902,-1.50009 -1.7046,-1.78665c-0.40326,-0.49037 -0.66232,-0.78618 -1.47705,-1.68645c-0.18636,-0.20591 -0.6158,-0.55653 -0.95438,-0.7792c-0.33858,-0.22267 -1.08042,-0.75136 -1.64857,-1.17487c-1.12537,-0.83899 -1.23256,-0.89896 -0.92034,-0.51455m-2.10551,3.28255c0,0.0467 0.41461,0.59538 0.9213,1.21929c0.7469,0.91956 1.95913,2.70516 1.95913,2.88567c0,0.14446 0.99436,1.60082 1.51484,2.21863c0.98999,1.1753 1.19197,1.44615 2.1811,2.92564c0.51359,0.76811 1.09989,1.59777 1.30291,1.84365c1.30833,1.58432 2.63812,3.23909 3.08127,3.83437c0.28412,0.38161 0.53873,0.71347 0.56587,0.73748c0.06328,0.05604 1.44667,2.24429 1.83483,2.90225c0.34207,0.57984 0.55296,0.71548 0.34556,0.22232c-0.04635,-0.11024 -0.36241,-0.90751 -0.70221,-1.77164c-0.33989,-0.86413 -0.67027,-1.68898 -0.73425,-1.833c-0.06398,-0.14402 -0.24196,-0.59232 -0.3954,-0.9961c-0.27015,-0.71077 -0.35944,-0.84178 -1.53317,-2.24813c-0.60882,-0.72945 -2.22421,-3.22512 -2.22421,-3.43626c0,-0.09471 -0.55112,-0.64609 -1.06942,-1.06995c-0.57198,-0.46776 -1.53824,-1.62299 -2.20527,-2.63655c-0.64426,-0.979 -1.34516,-1.71944 -3.05352,-3.22573c-0.43206,-0.381 -1.01147,-0.9096 -1.28746,-1.17478c-0.276,-0.26509 -0.50189,-0.44385 -0.50189,-0.39715m5.14506,13.7008" fill="currentColor" fill-rule="evenodd"/>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.9 KiB

2
src/views/home.handlebars
View file

@ -1,5 +1,7 @@
<div class="flex flex-col gap-8">
<div>
<h1 class="text-3xl">Howl your pronouns loud and proud</h1>
</div>
<p class="md:w-1/2">Because while we are silly, your gender identity is important. Be your genuine self. Share how you are to be referred to by newer users of neopronouns or English language learners.</p>
<div>
<a href="/list" class="button-cta">View full database</a>

4
src/views/individual.handlebars
View file

@ -1,6 +1,8 @@
<h1 class="pronoun-list-title text-5xl lg:text-6xl flex flex-wrap">
<div>
<h1 class="pronoun-list-title text-5xl lg:text-6xl inline-flex flex-wrap">
{{#each lexicon}}<span>{{this.value}}</span>{{/each}}
</h1>
</div>
{{> exampleSentences lexicon=lexicon}}
{{> exampleTable lexicon=lexicon}}

7
src/views/layouts/main.handlebars
View file

@ -1,11 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{{pageTitle}}}</title>
<meta property="og:site_name" content="Pronoun Monster" />
<meta property="og:title" content={{pageTitle}} />
<meta property="og:description" content="Howl your pronouns loud and proud. Share how you are to be referred to by newer users of neopronouns or English language learners." />
<meta property="og:description"
content="Howl your pronouns loud and proud. Share how you are to be referred to by newer users of neopronouns or English language learners." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://pronoun.monster/" />
<meta property="og:image" content="https://pronoun.monster/og-image.jpg" />
@ -14,9 +16,11 @@
<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 href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.cdnfonts.com/css/redaction">
<link rel="stylesheet" href="/app.css">
</head>
<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">
@ -26,4 +30,5 @@
{{> footer }}
</div>
</body>
</html>

2
src/views/list.handlebars
View file

@ -1,4 +1,4 @@
<div class="flex flex-col gap-8">
<h1 class="text-3xl">List of Popular Pronouns</h1>
<div><h1 class="text-3xl">List of Popular Pronouns</h1></div>
{{> pronounList}}
</div>

1
src/views/partials/footer.handlebars
View file

@ -12,5 +12,6 @@
<div class="space-y-2 lg:text-right">
<p>This site uses <a href="https://gitlab.com/gaiety/pronoun-monster/-/blob/main/UNLICENSE" class="font-bold">the Unlicense</a> and icons from <a href="https://pronouns.design/" class="font-bold">pronouns.design</a></p>
<p>Inspired by <a href="https://twitter.com/morganastra" class="font-bold">@morganastra</a>'s <a href="https://github.com/witch-house/pronoun.is" class="font-bold">pronoun.is</a> project</p>
<p>Background Photo by <a href="https://unsplash.com/@jazminantoinette?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" class="font-bold">Jazmin Quaynor</a> on <a href="https://unsplash.com/photos/bm9zWKi_c9Y?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" class="font-bold">Unsplash</a></p>
</div>
</footer>

10
src/views/partials/header.handlebars
View file

@ -1,7 +1,7 @@
<div class="p-10 lg:px-[60px] flex justify-between">
<h2 class="text-xl">
<a href="/" class="flex flex-row gap-2 align-center">
<svg class="w-8 h-8 -mt-0.5" viewBox="0 0 151 143" fill="none" xmlns="http://www.w3.org/2000/svg">
<header class="p-10 lg:px-[60px] flex justify-between">
<h2>
<a href="/" class="flex flex-row gap-4 align-center">
<svg class="w-12 h-12 -mt-0.5" viewBox="0 0 151 143" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="45.1768" cy="97.8" r="40" stroke="currentColor" stroke-width="10" stroke-dasharray="2 5"/>
<circle cx="105.177" cy="97.8" r="40" stroke="currentColor" stroke-width="10" stroke-dasharray="2 5"/>
<circle cx="75.1768" cy="45" r="40" stroke="currentColor" stroke-width="10" stroke-dasharray="2 5"/>
@ -22,4 +22,4 @@
<path d="M9 6C9 10.9706 13.0294 15 18 15C18.9093 15 19.787 14.8655 20.6144 14.6147C19.4943 18.3103 16.0613 20.9999 12 20.9999C7.02944 20.9999 3 16.9707 3 12.0001C3 7.93883 5.69007 4.50583 9.38561 3.38574C9.13484 4.21311 9 5.09074 9 6Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</button>
</div>
</header>

2
src/views/partials/pronounList.handlebars
View file

@ -2,7 +2,7 @@
{{#each pronounList}}
<li class="mb-2 flex flex-row gap-1 items-center">
<svg viewBox="0 0 24 24" class="w-8 h-8 pronoun-list-icon">
<use xlink:href="spritesheet.svg#leaf"></use>
<use xlink:href="spritesheet.svg#claw"></use>
</svg>
<a href="/{{this}}" class="pronoun-list-link -mt-1">{{this}}</a>
</li>