Merge branch 'monsterize' into 'main'
Monsterize See merge request gaiety/pronoun-monster!3
This commit is contained in:
Ava Gaiety W
commit
d5c7862294
15 changed files with 65 additions and 16 deletions
BIN
.DS_Store
vendored
BIN
.DS_Store
vendored
Binary file not shown.
|
|
@ -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
BIN
src/.DS_Store
vendored
Binary file not shown.
32
src/app.css
32
src/app.css
|
|
@ -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
BIN
src/images/.DS_Store
vendored
Normal file
Binary file not shown.
BIN
src/images/bg.jpeg
Normal file
BIN
src/images/bg.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 350 KiB |
BIN
src/svgs/.DS_Store
vendored
BIN
src/svgs/.DS_Store
vendored
Binary file not shown.
7
src/svgs/claw.svg
Normal file
7
src/svgs/claw.svg
Normal 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>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -1,5 +1,7 @@
|
|||
<div class="flex flex-col gap-8">
|
||||
<h1 class="text-3xl">Howl your pronouns loud and proud</h1>
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
<h1 class="pronoun-list-title text-5xl lg:text-6xl flex flex-wrap">
|
||||
{{#each lexicon}}<span>{{this.value}}</span>{{/each}}
|
||||
</h1>
|
||||
<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}}
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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,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>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue