mirror of
https://github.com/fooflington/selfdefined.git
synced 2025-10-31 14:18:32 +00:00
files upload
This commit is contained in:
tatianamac
2226
config.codekit3
Normal file
2226
config.codekit3
Normal file
File diff suppressed because it is too large
Load Diff
48
css/base.css
Normal file
48
css/base.css
Normal file
@@ -0,0 +1,48 @@
|
||||
@import url("https://fonts.googleapis.com/css?family=Inconsolata|Noto+Serif+KR");
|
||||
@import url("https://use.typekit.net/qlo3dpu.css");
|
||||
body {
|
||||
font-family: Inconsolata, Helvetica, sans-serif;
|
||||
font-size: 20px;
|
||||
padding: 4em;
|
||||
background: #e5ffe5; }
|
||||
|
||||
h1 {
|
||||
font-family: "Noto Serif KR", Georgia, serif;
|
||||
font-weight: 200;
|
||||
border-bottom: 20px #ffffff solid; }
|
||||
|
||||
h2 {
|
||||
font-family: "Noto Serif KR", Georgia, serif;
|
||||
font-weight: 700; }
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
padding-bottom: .5em;
|
||||
text-transform: capitalize; }
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, [col] 1fr [col]);
|
||||
grid-row-gap: 2em;
|
||||
grid-column-gap: 1em;
|
||||
grid-gap: .5em; }
|
||||
|
||||
@media screen and (min-width: 200px) {
|
||||
.item {
|
||||
grid-column: span 4; }
|
||||
h1 {
|
||||
font-size: 2em; }
|
||||
h2 {
|
||||
font-size: 1em; } }
|
||||
|
||||
@media screen and (min-width: 600px) {
|
||||
.item {
|
||||
grid-column: span 2; }
|
||||
h1 {
|
||||
font-size: 4em; }
|
||||
h2 {
|
||||
font-size: 1.5em; } }
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
.item {
|
||||
grid-column: span 1; } }
|
||||
130
index.html
Normal file
130
index.html
Normal file
@@ -0,0 +1,130 @@
|
||||
<!doctype html>
|
||||
<html class="no-js" lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Self-Defined · A modern dictionary to reflect today's world</title>
|
||||
<link rel="stylesheet" href="css/base.css">
|
||||
<link href="https://afeld.github.io/emoji-css/emoji.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div class="grid">
|
||||
<div class="item">
|
||||
<h1>Self-Defined</h1>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h2>A modern dictionary to reflect today's entire world</h2>
|
||||
</div>
|
||||
<div class="item">
|
||||
<ul>
|
||||
<li>Ablelism</li>
|
||||
<li>AIDS</li>
|
||||
<li>Ambulatory Wheelchair</li>
|
||||
<li>Anxiety disorders</li>
|
||||
<li>aromantic</li>
|
||||
<li>asexual</li>
|
||||
<li>assigned at birth</li>
|
||||
<li>Autism</li>
|
||||
<li>Bias</li>
|
||||
<li>BIPOC</li>
|
||||
<li>Black men (BM)</li>
|
||||
<li>Black women (BW)</li>
|
||||
<li>Black people (BP)</li>
|
||||
<li>bipolar</li>
|
||||
<li>cisgender</li>
|
||||
<li>colorism</li>
|
||||
<li>Complex PTSD</li>
|
||||
<li>cultural appropriation</li>
|
||||
<li>demiboy</li>
|
||||
<li>demigirl</li>
|
||||
<li>demiromantic</li>
|
||||
<li>demisexual</li>
|
||||
<li>Disability</li>
|
||||
<li>disabled</li>
|
||||
<li>discordant couples</li>
|
||||
<li>Discrimination</li>
|
||||
<li>Dominant culture</li>
|
||||
<li>Dominant culture habits</li>
|
||||
<li>EDS</li>
|
||||
<li>Egalitarian</li>
|
||||
<li>Empathy</li>
|
||||
<li>Entitlement</li>
|
||||
<li>Equality</li>
|
||||
<li>Equity</li>
|
||||
<li>Ethnicity</li>
|
||||
<li>Gender</li>
|
||||
<li>Gender confirmation surgery (GCS)</li>
|
||||
<li>genderqueer</li>
|
||||
<li>gray asexuality / gray ace</li>
|
||||
<li>hegemonic</li>
|
||||
<li>HIV</li>
|
||||
<li>Homophobia</li>
|
||||
<li>hormone Replacement therapy (HRT)</li>
|
||||
<li>Implicit bias</li>
|
||||
<li>Indigenous</li>
|
||||
<li>Inherent</li>
|
||||
<li>Intent/impact</li>
|
||||
<li>internalized oppression</li>
|
||||
<li>Intersectionality</li>
|
||||
<li>intersex</li>
|
||||
<li>invisible disabilities</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item">
|
||||
<ul>
|
||||
<li>Marginalized</li>
|
||||
<li>Minority</li>
|
||||
<li>Misogynoir</li>
|
||||
<li>Neurodivergent</li>
|
||||
<li>Neurotypical</li>
|
||||
<li>non binary</li>
|
||||
<li>Panic attacks</li>
|
||||
<li>Pansexual OSFED</li>
|
||||
<li>passing</li>
|
||||
<li>PEP</li>
|
||||
<li>Performative allyship</li>
|
||||
<li>POC</li>
|
||||
<li>power</li>
|
||||
<li>Poz</li>
|
||||
<li>Prejudice</li>
|
||||
<li>PrEP</li>
|
||||
<li>Privilege</li>
|
||||
<li>Race</li>
|
||||
<li>racial/gender equity</li>
|
||||
<li>Racism</li>
|
||||
<li>Racist</li>
|
||||
<li>Semitic</li>
|
||||
<li>Serodiscordant</li>
|
||||
<li>settler</li>
|
||||
<li>Sexual assault of a minor</li>
|
||||
<li>Sexual orientation</li>
|
||||
<li>Socially constructed</li>
|
||||
<li>Spectrum</li>
|
||||
<li>Systematic</li>
|
||||
<li>Systemic</li>
|
||||
<li>TERF</li>
|
||||
<li>transgender</li>
|
||||
<li>Transphobia</li>
|
||||
<li>Triggers</li>
|
||||
<li>Twospirited</li>
|
||||
<li>U=U</li>
|
||||
<li>Undetectable</li>
|
||||
<li>Unqueer</li>
|
||||
<li>Indigenous</li>
|
||||
<li>VAWG</li>
|
||||
<li>Viral Load</li>
|
||||
<li>White</li>
|
||||
<li>white feminism</li>
|
||||
<li>white fragility</li>
|
||||
<li>white supremacy</li>
|
||||
<li>White woman tears</li>
|
||||
<li>White people (WP)</li>
|
||||
<li>White women (WW)</li>
|
||||
<li>Whiteness</li>
|
||||
<li>womanism</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
scss/.DS_Store
vendored
Normal file
BIN
scss/.DS_Store
vendored
Normal file
Binary file not shown.
97
scss/base.scss
Normal file
97
scss/base.scss
Normal file
@@ -0,0 +1,97 @@
|
||||
@charset 'utf-8';
|
||||
@import url('https://fonts.googleapis.com/css?family=Inconsolata|Noto+Serif+KR');
|
||||
@import url("https://use.typekit.net/qlo3dpu.css");
|
||||
|
||||
// COLORS //
|
||||
$primary-color: #0e4bff; //cobalt blue is so pretty//
|
||||
$secondary-color: #F3F315; //
|
||||
|
||||
$black: #222222;
|
||||
$white: #ffffff;
|
||||
$pistachio: #e5ffe5;
|
||||
|
||||
$dark-grey: #4F4F4F;
|
||||
$mid-grey: #767676; // the lightest shade of grey you can get away with, #a11y
|
||||
$light-grey: #eeeeee; // for backgrounds only
|
||||
|
||||
|
||||
// TYPOGRAPHY //
|
||||
$sans-serif: Inconsolata, Helvetica, sans-serif;
|
||||
$serif: 'Noto Serif KR', Georgia, serif;
|
||||
$mono: Courier, mono;
|
||||
|
||||
$thin: 200;
|
||||
$light: 300;
|
||||
$regular: 400;
|
||||
$medium: 500;
|
||||
$bold: 700;
|
||||
|
||||
body {
|
||||
font-family: $sans-serif;
|
||||
font-size: 20px;
|
||||
padding: 4em;
|
||||
background: #e5ffe5;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: $serif;
|
||||
font-weight: $thin;
|
||||
border-bottom: 20px $white solid;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: $serif;
|
||||
font-weight: $bold;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
padding-bottom: .5em;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
// GRID //
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, [col] 1fr [col]);
|
||||
grid-row-gap: 2em;
|
||||
grid-column-gap: 1em;
|
||||
grid-gap: .5em;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (min-width: 200px) {
|
||||
.item {
|
||||
grid-column: span 4;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 600px) {
|
||||
.item {
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
.item {
|
||||
grid-column: span 1;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user