v2 #4
10
_data/navigationItems.yml
Normal file
|
@ -0,0 +1,10 @@
|
|||
- text: Das MiOM
|
||||
link: '#'
|
||||
- text: Zusammenarbeiten
|
||||
link: '#'
|
||||
- text: Projekte
|
||||
link: '#'
|
||||
- text: Der Raum
|
||||
link: '#'
|
||||
- text: Das Kollektiv
|
||||
link: '#'
|
|
@ -1,4 +1,4 @@
|
|||
<footer class="mi-footer mi-content">
|
||||
<footer class="mi-footer">
|
||||
<nav>
|
||||
<ul class="mi-footer--links">
|
||||
<li><a href="/imprint" class="mi-footer--link">Imprint</a></li>
|
||||
|
|
|
@ -21,24 +21,13 @@
|
|||
{% endif %}
|
||||
</head>
|
||||
<body class="mi-page">
|
||||
{% block header %}
|
||||
<div class="mi-page--we-are mi-page--title mi-page--title_side">
|
||||
<span class="mi-logo">MiOM Kreativraum</span>
|
||||
<br>
|
||||
<br>
|
||||
<a href="/">Back home</a>
|
||||
</div>
|
||||
|
||||
<header class="mi-page--title mi-content">
|
||||
<h1>{{ title }}</h1>
|
||||
</header>
|
||||
{% endblock %}
|
||||
{% include "navigation.njk" %}
|
||||
|
||||
<main class="mi-main mi-content">
|
||||
{% block main %}
|
||||
{% block main %}
|
||||
<main class="mi-main mi-content">
|
||||
{{ article | md | safe }}
|
||||
{% endblock %}
|
||||
</main>
|
||||
</main>
|
||||
{% endblock %}
|
||||
|
||||
{% include "footer.njk" %}
|
||||
</body>
|
||||
|
|
|
@ -1,20 +1,27 @@
|
|||
{% extends 'layouts/default.njk' %}
|
||||
|
||||
{% block header %}
|
||||
<div class="mi-page--we-are mi-page--title mi-page--title_side"><span class="mi-logo">MiOM 202</span> is</div>
|
||||
<p class="mi-things-we-are mi-page--title mi-content">
|
||||
{% for thingWeAre in thingsWeAre %}
|
||||
<span class="mi-things-we-are--thing">
|
||||
{{ thingWeAre }}<span class="mi-things-we-are--space">space</span>
|
||||
</span>
|
||||
{% endfor %}
|
||||
</p>
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
{{ introduction | md | safe }}
|
||||
<main class="mi-main mi-cards">
|
||||
<div class="mi-logo">
|
||||
<img src="/img/logo.jpg" class="mi-logo--img" />
|
||||
</div>
|
||||
|
||||
{% include "people.njk" %}
|
||||
<div class="mi-tagline">
|
||||
<p>Wir schaffen bezahlbaren Raum in dem wir gemeinsam und interdisziplinär arbeiten und experimentieren.</p>
|
||||
</div>
|
||||
|
||||
{{ cta | md | safe }}
|
||||
{% for card in cards %}
|
||||
<a
|
||||
class="mi-card"
|
||||
href="{{ card.link }}"
|
||||
>
|
||||
<img
|
||||
class="mi-card--background"
|
||||
src="{{ card.image.url }}"
|
||||
alt="{{ card.image.alt }}"
|
||||
/>
|
||||
<div class="mi-card--text">{{ card.text }}</div>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</main>
|
||||
{% endblock %}
|
||||
|
|
22
_includes/navigation.njk
Normal file
|
@ -0,0 +1,22 @@
|
|||
<nav class="mi-nav" id="nav">
|
||||
<label
|
||||
class="mi-nav--toggle"
|
||||
aria-role="button"
|
||||
aria-roledescription="toggles the menu"
|
||||
for="nav-toggle-checky"
|
||||
tabindex="0"
|
||||
onkeypress="document.getElementById('nav-toggle-checky').checked = !document.getElementById('nav-toggle-checky').checked"
|
||||
>_MiOM</label>
|
||||
<input
|
||||
class="mi-nav--toggle-checky"
|
||||
type="checkbox"
|
||||
id="nav-toggle-checky"
|
||||
/>
|
||||
<ul class="mi-nav--list">
|
||||
{% for item in navigationItems %}
|
||||
<li class="mi-nav--item">
|
||||
<a class="mi-nav--link" href="{{ item.link }}">{{ item.text }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</nav>
|
3
build.sh
|
@ -6,5 +6,6 @@ rm -rf ./_site
|
|||
# Build, results are in ./_site
|
||||
deno task build
|
||||
|
||||
# Put fonts in place
|
||||
# Put binary assets in place
|
||||
cp -r ./fonts ./_site/
|
||||
cp -r ./img ./_site/
|
||||
|
|
72
flake.lock
|
@ -2,17 +2,17 @@
|
|||
"nodes": {
|
||||
"devshell": {
|
||||
"inputs": {
|
||||
"flake-utils": "flake-utils",
|
||||
"nixpkgs": [
|
||||
"nixpkgs"
|
||||
],
|
||||
"systems": "systems"
|
||||
]
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1687944744,
|
||||
"narHash": "sha256-4ZtRVG/5yWHPZpkit1Ak5Mo1DDnkx1AG1HpNu/P+n5U=",
|
||||
"lastModified": 1705332421,
|
||||
"narHash": "sha256-USpGLPme1IuqG78JNqSaRabilwkCyHmVWY0M9vYyqEA=",
|
||||
"owner": "numtide",
|
||||
"repo": "devshell",
|
||||
"rev": "3864857b2754ab0e16c7c7c626f0e5a1d4e42f38",
|
||||
"rev": "83cb93d6d063ad290beee669f4badf9914cc16ec",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
|
@ -22,15 +22,33 @@
|
|||
}
|
||||
},
|
||||
"flake-utils": {
|
||||
"inputs": {
|
||||
"systems": "systems"
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1701680307,
|
||||
"narHash": "sha256-kAuep2h5ajznlPMD9rnQyffWG8EM/C73lejGofXvdM8=",
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"rev": "4022d587cbbfd70fe950c1e2083a02621806a725",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"flake-utils_2": {
|
||||
"inputs": {
|
||||
"systems": "systems_2"
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1687709756,
|
||||
"narHash": "sha256-Y5wKlQSkgEK2weWdOu4J3riRd+kV/VCgHsqLNTTWQ/0=",
|
||||
"lastModified": 1705309234,
|
||||
"narHash": "sha256-uNRRNRKmJyCRC/8y1RqBkqWBLM034y4qN7EprSdmgyA=",
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"rev": "dbabf0ca0c0c4bce6ea5eaf65af5cb694d2082c7",
|
||||
"rev": "1ef2e671c3b0c19053962c07dbda38332dcebf26",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
|
@ -41,11 +59,11 @@
|
|||
},
|
||||
"nixpkgs": {
|
||||
"locked": {
|
||||
"lastModified": 1688231357,
|
||||
"narHash": "sha256-ZOn16X5jZ6X5ror58gOJAxPfFLAQhZJ6nOUeS4tfFwo=",
|
||||
"lastModified": 1707956935,
|
||||
"narHash": "sha256-ZL2TrjVsiFNKOYwYQozpbvQSwvtV/3Me7Zwhmdsfyu4=",
|
||||
"owner": "nixos",
|
||||
"repo": "nixpkgs",
|
||||
"rev": "645ff62e09d294a30de823cb568e9c6d68e92606",
|
||||
"rev": "a4d4fe8c5002202493e87ec8dbc91335ff55552c",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
|
@ -58,9 +76,8 @@
|
|||
"root": {
|
||||
"inputs": {
|
||||
"devshell": "devshell",
|
||||
"flake-utils": "flake-utils",
|
||||
"nixpkgs": "nixpkgs",
|
||||
"tritonshell-module": "tritonshell-module"
|
||||
"flake-utils": "flake-utils_2",
|
||||
"nixpkgs": "nixpkgs"
|
||||
}
|
||||
},
|
||||
"systems": {
|
||||
|
@ -92,33 +109,6 @@
|
|||
"repo": "default",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"tritonshell-module": {
|
||||
"inputs": {
|
||||
"devshell": [
|
||||
"devshell"
|
||||
],
|
||||
"flake-utils": [
|
||||
"flake-utils"
|
||||
],
|
||||
"nixpkgs": [
|
||||
"nixpkgs"
|
||||
]
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1686817625,
|
||||
"narHash": "sha256-UUt00+BuPiqBv5it8eG99KLWVa7F392PPt52TPO20Zs=",
|
||||
"ref": "main",
|
||||
"rev": "c2280bb09683372f2f482bea3a8bd1112cf990e7",
|
||||
"revCount": 62,
|
||||
"type": "git",
|
||||
"url": "https://git.greenbaum.cloud/dev/tritonshell"
|
||||
},
|
||||
"original": {
|
||||
"ref": "main",
|
||||
"type": "git",
|
||||
"url": "https://git.greenbaum.cloud/dev/tritonshell"
|
||||
}
|
||||
}
|
||||
},
|
||||
"root": "root",
|
||||
|
|
22
flake.nix
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
description = "devs & ops environment for nix'ing with triton";
|
||||
description = "MiOM homepage live at @ miom.space";
|
||||
|
||||
inputs = {
|
||||
nixpkgs.url = "github:nixos/nixpkgs/nixos-unstable";
|
||||
|
@ -8,14 +8,9 @@
|
|||
|
||||
devshell.url = "github:numtide/devshell";
|
||||
devshell.inputs.nixpkgs.follows = "nixpkgs";
|
||||
|
||||
tritonshell-module.url = "git+https://git.greenbaum.cloud/dev/tritonshell?ref=main";
|
||||
tritonshell-module.inputs.devshell.follows = "devshell";
|
||||
tritonshell-module.inputs.flake-utils.follows = "flake-utils";
|
||||
tritonshell-module.inputs.nixpkgs.follows = "nixpkgs";
|
||||
};
|
||||
|
||||
outputs = { self, flake-utils, devshell, tritonshell-module, nixpkgs }:
|
||||
outputs = { self, flake-utils, devshell, nixpkgs }:
|
||||
flake-utils.lib.simpleFlake {
|
||||
inherit self nixpkgs;
|
||||
name = "miom.space";
|
||||
|
@ -33,19 +28,6 @@
|
|||
'';
|
||||
in
|
||||
pkgs.devshell.mkShell {
|
||||
imports = [ tritonshell-module.devshellModules.x86_64-linux.tritonshell ];
|
||||
# Now the tritonshell environment nix module options are available
|
||||
environment = {
|
||||
enable = true;
|
||||
# CUSTOMIZE if desired, default options are:
|
||||
#cnsBaseDomain = "greenbaum.zone";
|
||||
#dataCenters = [ "cgn-1" "lev-1" ];
|
||||
#mantaDomain = "eu-central.manta.greenbaum.cloud";
|
||||
#tritonApiDomain = "api.greenbaum.cloud";
|
||||
};
|
||||
|
||||
# Add additional packages you'd like to be available in your devshell
|
||||
# PATH here
|
||||
devshell.packages = with pkgs; [
|
||||
deno
|
||||
google-font-downloader
|
||||
|
|
BIN
img/IMG_0199.jpg
Normal file
After Width: | Height: | Size: 2.7 MiB |
BIN
img/IMG_0200.jpg
Normal file
After Width: | Height: | Size: 2.6 MiB |
BIN
img/IMG_0746.jpg
Normal file
After Width: | Height: | Size: 2.5 MiB |
BIN
img/IMG_0817.jpg
Normal file
After Width: | Height: | Size: 1.9 MiB |
BIN
img/aussenchill.jpg
Normal file
After Width: | Height: | Size: 2.7 MiB |
BIN
img/crowd-top.jpg
Normal file
After Width: | Height: | Size: 2 MiB |
BIN
img/crowd.jpg
Normal file
After Width: | Height: | Size: 2.2 MiB |
BIN
img/hakken.jpeg
Normal file
After Width: | Height: | Size: 574 KiB |
BIN
img/logo.jpg
Normal file
After Width: | Height: | Size: 35 MiB |
BIN
img/poledance.jpg
Normal file
After Width: | Height: | Size: 2 MiB |
BIN
img/signal-2023-03-02-144400_020.jpeg
Normal file
After Width: | Height: | Size: 419 KiB |
BIN
img/werkstatt.jpg
Normal file
After Width: | Height: | Size: 1.7 MiB |
|
@ -1,8 +1,8 @@
|
|||
layout: layouts/default.njk
|
||||
|
||||
title: 'Imprint'
|
||||
title: Imprint
|
||||
|
||||
article: '
|
||||
text: '
|
||||
Responsible for contents:
|
||||
|
||||
|
||||
|
|
33
index.yml
|
@ -1,17 +1,28 @@
|
|||
layout: layouts/homepage.njk
|
||||
|
||||
introduction: "
|
||||
We are an interdisciplinary creative space. We offer affordable room to work and exchange ideas in. Our community is composed of people from a variety of backgrounds.
|
||||
tagline: Wir schaffen bezahlbaren Raum in dem wir gemeinsam und interdisziplinär arbeiten und experimentieren.
|
||||
|
||||
cards:
|
||||
- text: Zusammenarbeiten
|
||||
link: ./collaborate
|
||||
image:
|
||||
alt: "Eine Gruppe Menschen sitzt an einem Tisch und arbeitet"
|
||||
url: /img/hakken.jpeg
|
||||
|
||||
Each one teach one.
|
||||
"
|
||||
|
||||
cta: "
|
||||
Interested?
|
||||
|
||||
|
||||
Come see us! We are currently located at [Wilhelm-Mauser-Straße 47](https://www.openstreetmap.org/node/9627028359), Halle 5 in 50827 Cologne. Contact one of us and we'll make sure someone is there to welcome you.
|
||||
"
|
||||
- text: Projekte
|
||||
link: ./projects
|
||||
image:
|
||||
alt: "Eine Gruppe Menschen sitzt an einem Tisch und arbeitet"
|
||||
url: /img/poledance.jpg
|
||||
|
||||
- text: Der Raum
|
||||
link: ./the-room
|
||||
image:
|
||||
alt: "Die Werkstatt vom MiOM. Es stehen einige Geräte wie Bohrmaschinen und Sägen rum."
|
||||
url: /img/werkstatt.jpg
|
||||
|
||||
- text: Das Kollektiv
|
||||
link: ./the-collective
|
||||
image:
|
||||
alt: "Eine Gruppe Menschen sitzt an einem Tisch und arbeitet"
|
||||
url: /img/crowd.jpg
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
layout: layouts/default.njk
|
||||
|
||||
title: 'Privacy policy'
|
||||
title: Privacy policy
|
||||
|
||||
article: '
|
||||
text: '
|
||||
We run on a no-logging policy. We do not track or keep any personal data.
|
||||
|
||||
See [our imprint](/imprint) for contact information.
|
||||
|
|
30
raleway.css
|
@ -4,7 +4,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
|
@ -13,7 +13,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* vietnamese */
|
||||
|
@ -22,7 +22,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
|
@ -31,7 +31,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
|
@ -40,7 +40,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* cyrillic-ext */
|
||||
|
@ -49,7 +49,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
|
@ -58,7 +58,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* vietnamese */
|
||||
|
@ -67,7 +67,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
|
@ -76,7 +76,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
|
@ -85,7 +85,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* cyrillic-ext */
|
||||
|
@ -94,7 +94,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCAIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
/* cyrillic */
|
||||
|
@ -103,7 +103,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCkIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
/* vietnamese */
|
||||
|
@ -112,7 +112,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCIIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
|
@ -121,7 +121,7 @@
|
|||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyCMIT4ttDfCmxA.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
|
@ -130,6 +130,6 @@
|
|||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: swap;
|
||||
src: url(/fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
src: url(./fonts/raleway/v22/1Ptug8zYS_SKggPNyC0IT4ttDfA.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
|
346
styles.css
|
@ -3,227 +3,201 @@
|
|||
}
|
||||
|
||||
html {
|
||||
--primary: #fd0ebf;
|
||||
--background: #fff;
|
||||
--foreground: #000;
|
||||
--box-padding: 1rem 2rem;
|
||||
|
||||
font-family: 'Raleway', sans-serif;
|
||||
|
||||
font-size: 7.3vw;
|
||||
line-height: 150%;
|
||||
background: white;
|
||||
font-size: 24px;
|
||||
line-height: 175%;
|
||||
}
|
||||
|
||||
body {
|
||||
background: white;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #ff006c;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.2rem;
|
||||
*:focus {
|
||||
outline: 1px dashed var(--primary);
|
||||
}
|
||||
|
||||
.mi-page {
|
||||
margin: 0;
|
||||
column-gap: 0.666rem;
|
||||
padding: 0;
|
||||
padding-left: 0.666rem;
|
||||
display: grid;
|
||||
grid-template-columns: 14vw 1fr;
|
||||
grid-template-rows: auto auto auto auto;
|
||||
}
|
||||
|
||||
.mi-page--title {
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
.mi-logo {
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
.mi-page--title_side {
|
||||
position: sticky;
|
||||
margin-top: 2rem;
|
||||
top: 2rem;
|
||||
font-size: 0.7rem;
|
||||
line-height: 120%;
|
||||
align-self: start;
|
||||
}
|
||||
|
||||
.mi-page--we-are {
|
||||
grid-row-start: 1;
|
||||
grid-row-end: 2;
|
||||
grid-column-start: 1;
|
||||
grid-column-end: 2;
|
||||
}
|
||||
|
||||
.mi-content {
|
||||
grid-column-start: 2;
|
||||
grid-column-end: 3;
|
||||
background: black;
|
||||
color: white;
|
||||
padding: 0.666rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mi-things-we-are {
|
||||
padding: 1rem 0;
|
||||
grid-row-start: 1;
|
||||
grid-row-end: 2;
|
||||
background: var(--background);
|
||||
display: flex;
|
||||
font-size: 0.7rem;
|
||||
flex-direction: column;
|
||||
font-weight: 100;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.mi-things-we-are::before {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
content: 'space';
|
||||
.mi-nav {
|
||||
border-bottom: 1px solid var(--foreground);
|
||||
position: sticky;
|
||||
top: 1.5rem;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
background: var(--background);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.mi-nav--toggle {
|
||||
padding: 0.25rem 1rem;
|
||||
}
|
||||
|
||||
.mi-nav--toggle-checky {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.mi-nav--list {
|
||||
list-style: none;
|
||||
display: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
background: var(--background);
|
||||
border-bottom: 1px solid var(--foreground);
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0.5em 0.666rem;
|
||||
padding-right: 3.75rem;
|
||||
background: white;
|
||||
color: black;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.mi-things-we-are--space {
|
||||
opacity: 0;
|
||||
.mi-nav--toggle-checky:checked+.mi-nav--list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mi-things-we-are--thing {
|
||||
padding: 0.5em 0.666rem;
|
||||
white-space: nowrap;
|
||||
mix-blend-mode: difference;
|
||||
z-index: 1;
|
||||
transition-property: background, color;
|
||||
transition-duration: 0.2s;
|
||||
transition-timing-function: ease;
|
||||
.mi-nav--link {
|
||||
display: flex;
|
||||
padding: 0.25rem 1rem;
|
||||
color: var(--foreground);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.mi-things-we-are--thing:first-child {
|
||||
margin-top: -1.7rem;
|
||||
.mi-nav--link:before {
|
||||
display: inline-block;
|
||||
content: '__';
|
||||
}
|
||||
|
||||
.mi-nav--link:hover {
|
||||
color: var(--primary);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 800px) {
|
||||
.mi-nav--toggle, .mi-nav--toggle-checky {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mi-nav--list {
|
||||
display: flex;
|
||||
position: static;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.mi-nav--item {
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.mi-main {
|
||||
grid-row-start: 2;
|
||||
grid-row-end: 3;
|
||||
background: var(--background);
|
||||
margin: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
font-size: 3vw;
|
||||
line-height: 150%;
|
||||
.mi-cards {
|
||||
display: grid;
|
||||
background: var(--foreground);
|
||||
grid-gap: 1px;
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 800px) {
|
||||
.mi-cards {
|
||||
grid-template-columns: repeat(8, 1fr);
|
||||
}
|
||||
|
||||
.mi-card {
|
||||
grid-column: auto / span 4;
|
||||
}
|
||||
|
||||
.mi-logo {
|
||||
grid-column: 1 / span 3;
|
||||
}
|
||||
|
||||
.mi-tagline {
|
||||
grid-column: 4 / span 5;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1600px) {
|
||||
.mi-card {
|
||||
grid-column: auto / span 2;
|
||||
}
|
||||
}
|
||||
|
||||
.mi-logo {
|
||||
background: var(--background);
|
||||
}
|
||||
|
||||
.mi-logo--img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.mi-tagline {
|
||||
background: var(--background);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.25rem 1rem;
|
||||
}
|
||||
|
||||
.mi-card {
|
||||
background: var(--background);
|
||||
position: relative;
|
||||
height: 600px;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.mi-card--background {
|
||||
width: calc(100% - 2rem);
|
||||
height: calc(100% - 2rem);
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
left: 1rem;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.mi-card--text {
|
||||
color: var(--background);
|
||||
background: var(--primary);
|
||||
display: flex;
|
||||
z-index: 1;
|
||||
padding: 0.25rem 1rem;
|
||||
position: absolute;
|
||||
bottom: 2rem;
|
||||
left: 2rem;
|
||||
right: 2rem;
|
||||
}
|
||||
|
||||
.mi-footer {
|
||||
grid-row-start: 3;
|
||||
grid-row-end: 4;
|
||||
grid-column-start: 2;
|
||||
grid-column-end: 3;
|
||||
}
|
||||
|
||||
.mi-people {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1rem 0;
|
||||
font-size: 0.6rem;
|
||||
line-height: 120%;
|
||||
}
|
||||
|
||||
.mi-person {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.mi-person--name {
|
||||
margin: 0;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.mi-person--pronoun {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.mi-person--role {
|
||||
font-size: 0.4rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mi-person--contact-toggle {
|
||||
font-size: 0.4rem;
|
||||
font-weight: 400;
|
||||
color: #ff006c;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mi-person--contact-options {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.mi-person--contact-option-name {
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
.mi-footer {
|
||||
font-size: 0.5rem;
|
||||
border-top: 1px solid var(--foreground);
|
||||
background: var(--background);
|
||||
}
|
||||
|
||||
.mi-footer--links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: 140%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1400px) {
|
||||
html {
|
||||
font-size: 5vw;
|
||||
}
|
||||
|
||||
.mi-page {
|
||||
grid-template-columns: auto 1fr;
|
||||
grid-template-rows: auto auto auto auto;
|
||||
}
|
||||
|
||||
.mi-page--title {
|
||||
white-space: nowrap;
|
||||
line-height: 200%;
|
||||
}
|
||||
|
||||
.mi-things-we-are {
|
||||
padding: 1.15rem 0;
|
||||
}
|
||||
|
||||
.mi-things-we-are::before {
|
||||
padding-right: 8.05rem;
|
||||
top: 1.65rem;
|
||||
}
|
||||
|
||||
.mi-things-we-are--thing:first-child {
|
||||
margin-top: -1.6rem;
|
||||
}
|
||||
|
||||
.mi-person--contact-options {
|
||||
font-size: 0.3rem;
|
||||
}
|
||||
|
||||
.mi-footer--links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.mi-footer--link {
|
||||
text-decoration: none;
|
||||
color: var(--foreground);
|
||||
padding: 0.25rem 1rem;
|
||||
}
|
||||
|
||||
.mi-footer--link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
|