-
Notifications
You must be signed in to change notification settings - Fork 1
/
Low-Fuel-Light.html
102 lines (92 loc) · 5.4 KB
/
Low-Fuel-Light.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html lang="en">
<head>
<title>Low Fuel Light</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta charset="utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
/>
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Goudy+Bookletter+1911&display=swap"
rel="stylesheet"
/>
<link href="./styles.css" rel="stylesheet" />
<link
rel="icon"
type="image/png"
href="https://github.com/yujason93/yujason92.github.io/blob/main/favicon.png?raw=true"
/>
<!-- Load an icon library to show a hamburger menu (bars) on small screens -->
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
</head>
<body>
<script>
/* Toggle between showing and hiding the navigation menu links when the user clicks on the hamburger menu / bar icon */
function nav() {
var navLinks = document.getElementById("nav-links");
if (navLinks.style.display === "block") {
navLinks.style.display = "none";
} else {
navLinks.style.display = "block";
}
}
</script>
<nav class="navbar">
<!-- Top Navigation Menu -->
<div class="topnav">
<a href="./index.html" class="logo-container">
<img src="./favicon.png" class="logo" />
</a>
<!-- "Hamburger menu" / "Bar icon" to toggle the navigation links -->
<a href="javascript:void(0);" class="icon" onclick="nav()">
<i class="fa fa-bars"></i>
</a>
</div>
<!-- Navigation links (hidden by default) -->
<div class="bottomnav">
<div id="nav-links">
<a href="./Counselling.html">Counselling</a>
<a href="./Low-Fuel-Light.html">Low Fuel Light</a>
<a href="./About.html">About</a>
<a href="https://www.instagram.com/fidgetpodcast/" target="_blank" rel="noopener noreferrer"><svg class="igicon" xmlns="http://www.w3.org/2000/svg" width="25" height= "25" viewBox="0 0 16 16">
<path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z"/>
</svg></a>
</div>
</div>
</nav>
<main class="main-content-container">
<h1>Low Fuel Light</h1>
<section class="description-section">
<div class="video-container">
<iframe
width="100%"
height="315"
src="https://www.youtube.com/embed/U0oe1k_Url4"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen
></iframe>
</div>
<br>
<div class="description-container">
<p>
A person is filled with shame and anger by their own Body Focused Repetitive Behavior (BFRB), and does their best to run away from it. After many years of escaping, they give up and meet it head on. When they do, they come to realize how it’s been trying to communicate an important message this whole time. They learn to sit and listen to the discomfort, eventually befriending their former enemy.
</p>
<p>
An animated short film made in collaboration with <a href="https://www.cheyennegoudswaard.com/" target="_blank" rel="noopener noreferrer">Cheyenne Goudswaard</a> and <a href="https://thomaspowell13.wixsite.com/taapmusic" target="_blank" rel="noopener noreferrer">Thomas Powell</a>.
</p>
</div>
</section>
</main>
</body>
</html>