feat: new

6 files changed, 298 insertions, 0 deletions

diff --git a/components/ui/contacts/ContactsHero.vue b/components/ui/contacts/ContactsHero.vue
new file mode 100644
index 0000000..7167b5c
--- /dev/null
+++ b/components/ui/contacts/ContactsHero.vue
@@ -0,0 +1,37 @@
+<template>
+  <div class="container">
+    <div class="hero-content">
+      <br><br><br><br>
+
+      <div class="row">
+        <div class="col-lg-8">
+          <h3 class="wow fadeInUp" data-wow-delay="1s">
+            contacts
+          </h3>
+
+          <p class="wow fadeInUp" data-wow-delay="1.2s">
+            <code>
+              n/a<br>
+            </code>
+
+            {{ description }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ContactsHero',
+  props: {
+    description: {
+      type: String,
+      default: () => {
+        return 'a few ways to get a hold of me'
+      }
+    }
+  }
+}
+</script>
diff --git a/components/ui/home/HomeHero.vue b/components/ui/home/HomeHero.vue
new file mode 100644
index 0000000..6d950a8
--- /dev/null
+++ b/components/ui/home/HomeHero.vue
@@ -0,0 +1,32 @@
+<template>
+  <div class="hero">
+    <div class="header">
+      <!-- <img
+        class="wow fadeInUp"
+        data-wow-delay="1s"
+        src="../../../assets/images/underconstruction-flash.gif"
+        alt="1990s era under constriction gif"
+      > -->
+      <h1>yucky! aiming</h1>
+      <br>
+
+      <div style="text-align: center;">
+        <small class="wow fadeInUp" data-wow-delay="1.2s">nasty, even.</small>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Hero',
+  props: {
+    updated: {
+      type: String,
+      default: () => {
+        return '1991. 01. 11.'
+      }
+    }
+  }
+}
+</script>
diff --git a/components/ui/interests/InterestsHero.vue b/components/ui/interests/InterestsHero.vue
new file mode 100644
index 0000000..525864c
--- /dev/null
+++ b/components/ui/interests/InterestsHero.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="container">
+    <div class="hero-content">
+      <br><br><br><br>
+
+      <div class="row">
+        <div class="col-lg-8">
+          <h3 class="wow fadeInUp" data-wow-delay="1s">
+            interests
+          </h3>
+
+          <p class="wow fadeInUp" data-wow-delay="1.2s">
+            <code>
+              handle <- openFile "interests_description.txt" ReadMode <br>
+              contents <- hGetContents handle <br>
+              putStr contents <br>
+              hClose handle <br>
+            </code>
+
+            {{ description }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'InterestsHero',
+  props: {
+    description: {
+      type: String,
+      default: () => {
+        return 'just a few things that i think are pretty cool and am ' +
+          'considering picking up sometime in the future.'
+      }
+    }
+  }
+}
+</script>
diff --git a/components/ui/interests/InterestsListing.vue b/components/ui/interests/InterestsListing.vue
new file mode 100644
index 0000000..8c9e561
--- /dev/null
+++ b/components/ui/interests/InterestsListing.vue
@@ -0,0 +1,72 @@
+<template>
+  <div class="container">
+    <div class="hero-content">
+      <br>
+
+      <div class="row">
+        <div class="col-lg-8">
+          <div v-for="(category, heading) in interests" :key="category">
+            <!-- Main categories -->
+            <h5 :id="heading" class="wow fadeInUp" data-wow-delay="1.2s">
+              # {{ heading }}
+            </h5>
+
+            <!-- If category is an array... -->
+            <ul v-if="Array.isArray(category)">
+              <li v-for="item in category" :key="item">
+                {{ item }}
+              </li>
+            </ul>
+            <!-- If the category is an object... -->
+            <ul v-for="(sub_category, sub_heading) in category" v-else :key="sub_category">
+              <!-- Sub categories -->
+              <h6 :id="sub_heading">
+                ## {{ sub_heading }}
+              </h6>
+
+              <!-- If category is an array... -->
+              <ul v-if="Array.isArray(sub_category)">
+                <li v-for="item in sub_category" :key="item">
+                  {{ item }}
+                </li>
+              </ul>
+              <!-- If the category is an object... -->
+              <ul v-for="(subsub_category, subsub_heading) in sub_category" v-else :key="subsub_category">
+                <h6 :id="subsub_heading">
+                  ### {{ subsub_heading }}
+                </h6>
+
+                <!-- If category is an array... -->
+                <ul v-if="Array.isArray(subsub_category)">
+                  <li v-for="item in subsub_category" :key="item">
+                    {{ item }}
+                  </li>
+                </ul>
+
+                <!-- If the current iterated item is the last of the currently
+                     iterated object, add a line-break... -->
+                <br
+                  v-if="(Object.keys(sub_category).length - 1)
+                    !== Object.keys(sub_category).indexOf(subsub_heading)"
+                >
+              </ul>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import interests from '../../../assets/json/interests.json'
+
+export default {
+  name: 'MembersListing',
+  data: () => {
+    return {
+      interests
+    }
+  }
+}
+</script>
diff --git a/components/ui/members/MembersHero.vue b/components/ui/members/MembersHero.vue
new file mode 100644
index 0000000..491abe1
--- /dev/null
+++ b/components/ui/members/MembersHero.vue
@@ -0,0 +1,44 @@
+<template>
+  <div class="container">
+    <div class="hero-content">
+      <br><br><br><br>
+
+      <div class="row">
+        <div class="col-lg-8">
+          <h3 class="wow fadeInUp" data-wow-delay="1s">
+            members
+          </h3>
+
+          <!-- <img
+            class="wow fadeInUp"
+            data-wow-delay="1.15s"
+            src="https://web.archive.org/web/20090809234237/http://www.geocities.com/lateralusspiraleyes/neo_coding_flash.gif"
+            alt="neo"
+          >
+          <br> -->
+
+          <p class="wow fadeInUp" data-wow-delay="1.2s">
+            <code>$ cat members.txt <br></code>
+            {{ description }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'MembersHero',
+  props: {
+    description: {
+      type: String,
+      default: () => {
+        /* return 'despite working in full-stack, i not only have a mild distaste ' +
+          'for front-end, but i\'m sub-par at it so don\'t expect much in that front.' */
+        return null
+      }
+    }
+  }
+}
+</script>
diff --git a/components/ui/members/MembersListing.vue b/components/ui/members/MembersListing.vue
new file mode 100644
index 0000000..5374fbc
--- /dev/null
+++ b/components/ui/members/MembersListing.vue
@@ -0,0 +1,72 @@
+<template>
+  <div class="container">
+    <div class="hero-content">
+      <br>
+
+      <div class="row">
+        <div class="col-lg-8">
+          <div v-for="(category, heading) in members" :key="category">
+            <!-- Main categories -->
+            <h5 :id="heading" class="wow fadeInUp" data-wow-delay="1.2s">
+              # {{ heading }}
+            </h5>
+
+            <!-- If category is an array... -->
+            <ul v-if="Array.isArray(category)">
+              <li v-for="item in category" :key="item">
+                {{ item }}
+              </li>
+            </ul>
+            <!-- If the category is an object... -->
+            <ul v-for="(sub_category, sub_heading) in category" v-else :key="sub_category">
+              <!-- Sub categories -->
+              <h6 :id="sub_heading">
+                ## {{ sub_heading }}
+              </h6>
+
+              <!-- If category is an array... -->
+              <ul v-if="Array.isArray(sub_category)">
+                <li v-for="item in sub_category" :key="item">
+                  {{ item }}
+                </li>
+              </ul>
+              <!-- If the category is an object... -->
+              <ul v-for="(subsub_category, subsub_heading) in sub_category" v-else :key="subsub_category">
+                <h6 :id="subsub_heading">
+                  ### {{ subsub_heading }}
+                </h6>
+
+                <!-- If category is an array... -->
+                <ul v-if="Array.isArray(subsub_category)">
+                  <li v-for="item in subsub_category" :key="item">
+                    {{ item }}
+                  </li>
+                </ul>
+
+                <!-- If the current iterated item is the last of the currently
+                     iterated object, add a line-break... -->
+                <br
+                  v-if="(Object.keys(sub_category).length - 1)
+                    !== Object.keys(sub_category).indexOf(subsub_heading)"
+                >
+              </ul>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import members from 'assets/json/members.json'
+
+export default {
+  name: 'MembersListing',
+  data: () => {
+    return {
+      members
+    }
+  }
+}
+</script>