Initial Release of disrespect the disrespectful

weiyiwong99 · Jun 6, 2024 · e903cff · e903cff
1 parent 8e8c9e3
commit e903cff
Show file tree

Hide file tree

Showing 6 changed files with 81 additions and 5 deletions.
diff --git a/disrespect_the_disrespectful.html b/disrespect_the_disrespectful.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>Respect From Me</title>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
+<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inconsolata">
+<style>
+body, html {
+  height: 100%;
+  font-family: "Inconsolata", sans-serif;
+}
+
+.bgimg {
+  background-position: center;
+  background-size: cover;
+  background-image: url("./images/disrespect_the_disrespectful_girl.jpg");
+  min-height: 75%;
+}
+
+.menu {
+  display: none;
+}
+</style>
+</head>
+<body>
+
+<!-- Header with image -->
+<header class="bgimg w3-display-container w3-grayscale-min" id="home">
+  <div class="w3-display-bottomleft w3-center w3-padding-large w3-hide-small">
+    <span class="w3-tag">Treat others how you want to be treated</span>
+  </div>
+  <div class="w3-display-middle w3-center">
+    <span class="w3-text-white" style="font-size:90px">Disrespect<br>the<br>Disrespectful</span>
+  </div>
+  <div class="w3-display-bottomright w3-center w3-padding-large">
+    <span class="w3-text-white">June 6, 2024</span>
+  </div>
+</header>
+
+<!-- Add a background color and large text to the whole page -->
+<div class="w3-sand w3-grayscale w3-large">
+
+<!-- About Container -->
+<div class="w3-container" id="about">
+  <div class="w3-content" style="max-width:700px">
+    <h5 class="w3-center w3-padding-64"><span class="w3-tag w3-wide">ABOUT THE WHY</span></h5>
+    <p>Recently I have been treated rude by a person at workplace.</p>
+    <p>I became a victim of his discourtecy during a random day at work. I suffered a lot from getting rid of my anger during the time. I even went to a counsellor for the incident.</p>
+    <p>People around me, especially my boyfriend, is worried of my mental conditions. He advised me not to take someone's word seriously, and get emotionally affect.</p>
+    <p>The counsellor gave me a practical advice, which is to see the rude person as a mirror, to always remind myself never become a rude colleague at work.</p>
+    <p>I received their advices and tried to make improvement on the way I thought. However, sometimes the aggresive feeling came back again when I interect with the rude guy.</p>
+    <img src="./images/disrespect_the_disrespectful_anger.png" style="width:100%;max-width:1000px" class="w3-margin-top">
+    <p>I feel like wanting to treat him rude, or even more rude, like how I got treated. However, I know I have to suppress my anger. Sometimes suppressing the aggressive feeling can be exhausting.</p>
+    <p>Someone may think that the proper way should be telling him how I think about him. However, I cannot agree on that as for me, it is none of my reponsibilities to "educate" a "true" adult.</p>
+    <p>Since then, I know that this person has lost all my respects. I feel disgusting and wanting to run away everytime when dealing with this person at work.</p>
+    <div class="w3-panel w3-leftbar w3-light-grey">
+      <p><i>"Treat others how you want to be treated."</i></p>
+    </div>
+    <img src="./images/disrespect_the_disrespectful_quote.jpg" style="width:100%;max-width:1000px" class="w3-margin-top">
+  </div>
+</div>
+
+<!-- End page content -->
+</div>
+
+<!-- Footer -->
+<footer class="w3-center w3-light-grey w3-padding-48 w3-large">
+  <p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" title="W3.CSS" target="_blank" class="w3-hover-text-green">w3.css</a></p>
+</footer>
+
+</body>
+</html>
diff --git a/images/disrespect_the_disrespectful_anger.png b/images/disrespect_the_disrespectful_anger.png
diff --git a/images/disrespect_the_disrespectful_girl.jpg b/images/disrespect_the_disrespectful_girl.jpg
diff --git a/images/disrespect_the_disrespectful_midfinger.jpeg b/images/disrespect_the_disrespectful_midfinger.jpeg
diff --git a/images/disrespect_the_disrespectful_quote.jpg b/images/disrespect_the_disrespectful_quote.jpg
diff --git a/index.html b/index.html
@@ -83,11 +83,13 @@ <h4><b>Wei Yi Wong</b></h4>
       <h4>Popular Posts</h4>
     </div>
     <ul class="w3-ul w3-hoverable w3-white">
-      <li class="w3-padding-16">
-        <img src="/w3images/workshop.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
-        <span class="w3-large">Lorem</span><br>
-        <span>Sed mattis nunc</span>
-      </li>
+      <a href="/blog/disrespect_the_disrespectful.html" style="text-decoration:none;">
+        <li class="w3-padding-16">
+            <img src="./images/disrespect_the_disrespectful_midfinger.jpeg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
+            <span class="w3-large">Disrespect the Disrespectful</span><br>
+            <span>Treat others how you want to be treated. And I am not responsible for your silliness.</span>
+        </li>
+      </a>
       <li class="w3-padding-16">
         <img src="/w3images/gondol.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
         <span class="w3-large">Ipsum</span><br>