٩(•̤̀ᵕ•̤́๑)ᵒᵏᵎᵎᵎᵎ
|
@ -27,14 +27,32 @@ body {
|
|||
|
||||
/* Header */
|
||||
header {
|
||||
padding: 5vh 5vw;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
display: grid;
|
||||
}
|
||||
|
||||
header a { color: #0E0051; }
|
||||
header a:visited { color: #0E0051; }
|
||||
.header-video-box video {
|
||||
background-image: url('../images/bg-header.png');
|
||||
background-size: cover;
|
||||
height: auto;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.header-text-box {
|
||||
color: #ddd;
|
||||
z-index: 20;
|
||||
width: 80vw;
|
||||
padding: 5vh 0;
|
||||
background: rgba(2, 0, 36, .6);
|
||||
background: radial-gradient(circle, rgba(2, 0, 36, .6) 0%, rgba(14, 0, 81, .6) 75%, rgba(19, 0, 112, .6) 100%);
|
||||
}
|
||||
header a { color: #ddd; }
|
||||
header a:visited { color: #ddd; }
|
||||
|
||||
header h1, h2, h3, h4 {
|
||||
margin: 2rem 0;
|
||||
|
@ -70,23 +88,23 @@ footer {
|
|||
bottom: 0;
|
||||
}
|
||||
|
||||
menu {
|
||||
nav {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
menu ul {
|
||||
nav ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
menu ul li {
|
||||
nav ul li {
|
||||
list-style-position: inside;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
menu ul li a {
|
||||
nav ul li a {
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
|
|
Before Width: | Height: | Size: 189 KiB After Width: | Height: | Size: 131 KiB |
Before Width: | Height: | Size: 198 KiB After Width: | Height: | Size: 144 KiB |
Before Width: | Height: | Size: 268 KiB After Width: | Height: | Size: 198 KiB |
Before Width: | Height: | Size: 374 KiB After Width: | Height: | Size: 177 KiB |
After Width: | Height: | Size: 854 KiB |
Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 33 KiB |
|
@ -1,46 +1,53 @@
|
|||
<!DOCTYPE html>
|
||||
<html 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" />
|
||||
<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>Casa Wakale - Wakale House</title>
|
||||
<link href="assets/css/style.css" rel="stylesheet" />
|
||||
<link href="assets/css/style.css" rel="stylesheet">
|
||||
|
||||
|
||||
<meta property="og:title" content="Wakale House" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://wakale.casa" />
|
||||
<meta property="og:locale" content="en_US" />
|
||||
<meta property="og:site_name" content="Wakale House" />
|
||||
<meta property="og:description" content="In wakale veritas, lux ex voluptas." />
|
||||
<meta property="og:image" content="https://wakale.casa/assets/images/opengraph.png" />
|
||||
<meta property="og:image:type" content="image/png" />
|
||||
<meta property="og:image:alt" content="The three rules of the Wakale House." />
|
||||
<meta property="og:image:width" content="640" />
|
||||
<meta property="og:image:height" content="480" />
|
||||
<meta property="og:title" content="Wakale House">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://wakale.casa">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta property="og:site_name" content="Wakale House">
|
||||
<meta property="og:description" content="In wakale veritas, lux ex voluptas.">
|
||||
<meta property="og:image" content="https://wakale.casa/assets/images/opengraph.png">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
<meta property="og:image:alt" content="The three rules of the Wakale House.">
|
||||
<meta property="og:image:width" content="640">
|
||||
<meta property="og:image:height" content="480">
|
||||
</head>
|
||||
<body>
|
||||
<header id="rules">
|
||||
<h3>Casa Wakale Rules:</h3>
|
||||
<header id="rules" class="header-video-box">
|
||||
<video autoplay muted playsinline loop preload="auto">
|
||||
<source src="assets/videos/2024-12-01.mp4" type="video/mp4">
|
||||
</video>
|
||||
|
||||
<h1 id="rule-1"><a href="#rule-1">1</a> - Do Your Best</h1>
|
||||
<div class="header-text-box">
|
||||
<h3>Casa Wakale Rules:</h3>
|
||||
|
||||
<h1 id="rule-2"><a href="#rule-2">2</a> - Use Common Sense</h1>
|
||||
<h1 id="rule-1"><a href="#rule-1">1</a> - Do Your Best</h1>
|
||||
|
||||
<h1 id="rule-3"><a href="#rule-3">3</a> - Shut The Fuck Up</h1>
|
||||
<h1 id="rule-2"><a href="#rule-2">2</a> - Use Common Sense</h1>
|
||||
|
||||
<h4>So be the rules of this house.</h4>
|
||||
<h1 id="rule-3"><a href="#rule-3">3</a> - Shut The Fuck Up</h1>
|
||||
|
||||
<h4>So be the rules of this house.</h4>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section id="photos">
|
||||
<h1>Photos</h1>
|
||||
<h2>Photos</h2>
|
||||
|
||||
<article id="photo-la-patata">
|
||||
<h2><a href="#photo-la-patata">La Patata!</a></h2>
|
||||
<h3><a href="#photo-la-patata">La Patata!</a></h3>
|
||||
<figure>
|
||||
<a href="assets/images/2024/30-nov/leo-01.jpg">
|
||||
<img src="assets/images/2024/30-nov/leo-01.jpg" alt="La Patata!" />
|
||||
<img src="assets/images/2024/30-nov/leo-01.jpg" alt="La Patata!">
|
||||
</a>
|
||||
<figcaption>
|
||||
<p><em>Leonardo the cat is crazy and gray,
|
||||
|
@ -49,52 +56,52 @@
|
|||
<br>Then wiggles and purrs and does it once more.
|
||||
<br>With a purr and a meow and paws that misstep,
|
||||
<br>Leonardo's the best friend and pet.</em></p>
|
||||
<time datetime="2024-11-30T19:51:00">November 30th, 2024, 19:51</time>
|
||||
</figcaption>
|
||||
<time datetime="2024-11-30T19:51:00">November 30th, 2024, 19:51</time>
|
||||
</figure>
|
||||
</article>
|
||||
|
||||
<article id="photo-the-original-rules">
|
||||
<h2><a href="#photo-the-original-rules">The original rules</a></h2>
|
||||
<h3><a href="#photo-the-original-rules">The original rules</a></h3>
|
||||
|
||||
<figure>
|
||||
<a href="assets/images/2024/11-may/rules-01.jpg">
|
||||
<img src="assets/images/2024/11-may/rules-01.jpg" alt="The original rules paper" />
|
||||
<img src="assets/images/2024/11-may/rules-01.jpg" alt="The original rules paper">
|
||||
</a>
|
||||
<figcaption>
|
||||
<p>1, 2, 3. Simple rules for simple people.</p>
|
||||
<time datetime="2024-11-05T15:59:00">May 11th, 2024, 15:59</time>
|
||||
</figcaption>
|
||||
<time datetime="2024-11-05T15:59:00">May 11th, 2024, 15:59</time>
|
||||
</figure>
|
||||
|
||||
<figure>
|
||||
<a href="assets/images/2024/11-may/rules-02.jpg">
|
||||
<img src="assets/images/2024/11-may/rules-02.jpg" alt="The original cleaning paper" />
|
||||
<img src="assets/images/2024/11-may/rules-02.jpg" alt="The original cleaning paper">
|
||||
</a>
|
||||
<figcaption>
|
||||
<p>Original cleaning conventions.</p>
|
||||
<time datetime="2024-11-05T15:58:00">May 11th, 2024, 15:58</time>
|
||||
</figcaption>
|
||||
<time datetime="2024-11-05T15:58:00">May 11th, 2024, 15:58</time>
|
||||
</figure>
|
||||
|
||||
<figure>
|
||||
<a href="assets/images/2024/11-may/rules-03.jpg">
|
||||
<img src="assets/images/2024/11-may/rules-03.jpg" alt="The original guests paper" />
|
||||
<img src="assets/images/2024/11-may/rules-03.jpg" alt="The original guests paper">
|
||||
</a>
|
||||
<figcaption>
|
||||
<p>Original guests agreements.</p>
|
||||
<time datetime="2024-11-05T15:58:00">May 11th, 2024, 15:58</time>
|
||||
</figcaption>
|
||||
<time datetime="2024-11-05T15:58:00">May 11th, 2024, 15:58</time>
|
||||
</figure>
|
||||
</article>
|
||||
|
||||
</section>
|
||||
|
||||
<section id="conventions">
|
||||
<h1>Conventions</h1>
|
||||
<h2>Conventions</h1>
|
||||
|
||||
<article id="article-cleaning">
|
||||
<h2><a href="#1">1</a> — Cleaning: 1 x Week</h2>
|
||||
<h3><a href="#1">1</a> — Cleaning: 1 x Week</h3>
|
||||
<ul>
|
||||
<li><a href="#1.1">1.1</a> — Davide does his bathroom</li>
|
||||
<li><a href="#1.2">1.2</a> — Solomon + Pxi: Do our bathrooms</li>
|
||||
|
@ -109,7 +116,7 @@
|
|||
</article>
|
||||
|
||||
<article id="article-guests">
|
||||
<h2><a href="#2">2</a> — Guests:</h2>
|
||||
<h3><a href="#2">2</a> — Guests:</h3>
|
||||
<ul>
|
||||
<li><a href="#2.1">2.1</a> — Emergency — <b>OK</b></li>
|
||||
<li><a href="#2.2">2.2</a> — 3 days - 1 x month — <b>OK</b></li>
|
||||
|
@ -120,7 +127,7 @@
|
|||
</article>
|
||||
|
||||
<article id="article-expenses">
|
||||
<h2><a href="#3">3</a> — Expenses:</h2>
|
||||
<h3><a href="#3">3</a> — Expenses:</h3>
|
||||
<ol>
|
||||
<li><a href="#3.1">3.1</a> — There are comunal spaces + private spaces</li>
|
||||
<li><a href="#3.2">3.2</a> — Use tricount app</li>
|
||||
|
@ -144,14 +151,14 @@
|
|||
</main>
|
||||
|
||||
<footer>
|
||||
<menu>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#rules">Rules</a></li>
|
||||
<li><a href="#photos">Photos</a></li>
|
||||
<li><a href="#conventions">Conventions</a></p></li>
|
||||
<li><a href="#links">Links</a></p></li>
|
||||
<li><a href="#conventions">Conventions</a></li>
|
||||
<li><a href="#links">Links</a></li>
|
||||
</ul>
|
||||
</menu>
|
||||
</nav>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|