feat: migrate Hugo Bootstrap theme to latest Hugo with Tailwind CSS and refactor codebase

* replace Bootstrap-based styling with Tailwind CSS
* update theme compatibility for latest Hugo version
* refactor templates and partials
* fix outdated code and broken components
* improve project structure and maintainability
* optimize styling and frontend build setup

exampleSite/content/english/portfolio/_index.md

@@ -0,0 +1,5 @@
+---
+title: "We build better <span>products</span> to help our clients build better <span>companies</span>"
+meta_title: "Portfolio"
+date: 2019-12-23T16:48:28+06:00
+---

exampleSite/content/english/portfolio/kio-tape-2.md

@@ -0,0 +1,30 @@
+---
+title: "KIO-TAPE BRAND"
+date: 2019-12-23T20:56:42+06:00
+type: portfolio
+image: "/images/projects/project-thumb-four.jpg"
+category: ["PRODUCT LABEL"]
+button_label: "View Project"
+featured: true
+draft: false
+---
+
+The “Seamless Watch” watch has all the features that users expect in a digital watch, and some unusual features.
+
+The watch has the following features:
+
+Time and date displayed on the screen. Current time is in large numbers, date is in small numbers above it.
+
+Light: Pressing the light button on the side of the watch activates a light while the button is pressed. Pressing and holding that button for 3 seconds turns on the light and keeps it on, until the button is held again for 3 seconds or up to 2 hours. After 2 hours, it will automatically turn off.
+
+Alarm. A daily alarm may be set for a given time. The alarm may be enabled or disabled. When the alarm is enabled and the alarm time is reached, the watch will beep fast for 5 seconds, then slowly for 30 seconds, then fast for another 5 seconds. Pressing any button stops the alarm sound (in addition to performing its normal function).
+
+Timer. Timer mode shows a count-up timer that starts at 00:00. When the timer is started, it counts up. Pressing the start/stop button will pause the timer, pressing it again continues counting up. Pressing and holding the button for 3 seconds resets the timer to 00:00 and stops counting.
+
+Mystery answer. After entering this mode, the screen initially displays “ask now”. The user may ask a yes-or-no question aloud and press the start/stop button, this will display a randomly selected answer that is one of the following: “yeah”, “yeah right”, “no”, “no doubt”, “keep trying”, “keep dreaming”. Whenever the display has more than one word, only one word is displayed for 2 seconds, then the other word is displayed for 2 seconds, alternately. The answer is displayed until the user leaves this mode, or he/she presses start/stop again for a new answer.
+
+Note: these strings are for the English version of the watch, we will need to use completely different strings in other countries without reprogramming the logic of the watch.
+
+The user may cycle among all modes (date/time, timer, mystery answer) by pressing the mode button.
+
+{{< gallery dir="/images/projects" class="" height="400" width="400" webp="true" command="Fit" option="" zoomable="true" >}}

exampleSite/content/english/portfolio/kio-tape.md

@@ -0,0 +1,30 @@
+---
+title: "KIO TAPE"
+date: 2019-12-23T15:44:46+06:00
+type: portfolio
+image: "/images/projects/project-thumb-four.jpg"
+category: ["PRODUCT LABEL"]
+button_label: "View Project"
+featured: true
+draft: false
+---
+
+The “Seamless Watch” watch has all the features that users expect in a digital watch, and some unusual features.
+
+The watch has the following features:
+
+Time and date displayed on the screen. Current time is in large numbers, date is in small numbers above it.
+
+Light: Pressing the light button on the side of the watch activates a light while the button is pressed. Pressing and holding that button for 3 seconds turns on the light and keeps it on, until the button is held again for 3 seconds or up to 2 hours. After 2 hours, it will automatically turn off.
+
+Alarm. A daily alarm may be set for a given time. The alarm may be enabled or disabled. When the alarm is enabled and the alarm time is reached, the watch will beep fast for 5 seconds, then slowly for 30 seconds, then fast for another 5 seconds. Pressing any button stops the alarm sound (in addition to performing its normal function).
+
+Timer. Timer mode shows a count-up timer that starts at 00:00. When the timer is started, it counts up. Pressing the start/stop button will pause the timer, pressing it again continues counting up. Pressing and holding the button for 3 seconds resets the timer to 00:00 and stops counting.
+
+Mystery answer. After entering this mode, the screen initially displays “ask now”. The user may ask a yes-or-no question aloud and press the start/stop button, this will display a randomly selected answer that is one of the following: “yeah”, “yeah right”, “no”, “no doubt”, “keep trying”, “keep dreaming”. Whenever the display has more than one word, only one word is displayed for 2 seconds, then the other word is displayed for 2 seconds, alternately. The answer is displayed until the user leaves this mode, or he/she presses start/stop again for a new answer.
+
+Note: these strings are for the English version of the watch, we will need to use completely different strings in other countries without reprogramming the logic of the watch.
+
+The user may cycle among all modes (date/time, timer, mystery answer) by pressing the mode button.
+
+{{< gallery dir="/images/projects" class="" height="400" width="400" webp="true" command="Fit" option="" zoomable="true" >}}

exampleSite/content/english/portfolio/osen-clock.md

@@ -0,0 +1,30 @@
+---
+title: "OSEN CLOCK"
+date: 2019-12-23T15:56:43+06:00
+type: portfolio
+image: "/images/projects/project-thumb-two.jpg"
+category: ["PRODUCT DESIGN"]
+button_label: "View Project"
+featured: true
+draft: false
+---
+
+The “Seamless Watch” watch has all the features that users expect in a digital watch, and some unusual features.
+
+The watch has the following features:
+
+Time and date displayed on the screen. Current time is in large numbers, date is in small numbers above it.
+
+Light: Pressing the light button on the side of the watch activates a light while the button is pressed. Pressing and holding that button for 3 seconds turns on the light and keeps it on, until the button is held again for 3 seconds or up to 2 hours. After 2 hours, it will automatically turn off.
+
+Alarm. A daily alarm may be set for a given time. The alarm may be enabled or disabled. When the alarm is enabled and the alarm time is reached, the watch will beep fast for 5 seconds, then slowly for 30 seconds, then fast for another 5 seconds. Pressing any button stops the alarm sound (in addition to performing its normal function).
+
+Timer. Timer mode shows a count-up timer that starts at 00:00. When the timer is started, it counts up. Pressing the start/stop button will pause the timer, pressing it again continues counting up. Pressing and holding the button for 3 seconds resets the timer to 00:00 and stops counting.
+
+Mystery answer. After entering this mode, the screen initially displays “ask now”. The user may ask a yes-or-no question aloud and press the start/stop button, this will display a randomly selected answer that is one of the following: “yeah”, “yeah right”, “no”, “no doubt”, “keep trying”, “keep dreaming”. Whenever the display has more than one word, only one word is displayed for 2 seconds, then the other word is displayed for 2 seconds, alternately. The answer is displayed until the user leaves this mode, or he/she presses start/stop again for a new answer.
+
+Note: these strings are for the English version of the watch, we will need to use completely different strings in other countries without reprogramming the logic of the watch.
+
+The user may cycle among all modes (date/time, timer, mystery answer) by pressing the mode button.
+
+{{< gallery dir="/images/projects" class="" height="400" width="400" webp="true" command="Fit" option="" zoomable="true" >}}

exampleSite/content/english/portfolio/seamless-watch.md

@@ -0,0 +1,30 @@
+---
+title: "SEAMLESS WATCH"
+date: 2019-12-23T15:55:44+06:00
+type: portfolio
+image: "/images/projects/project-thumb-three.jpg"
+category: ["REBRAND"]
+button_label: "View Project"
+featured: true
+draft: false
+---
+
+The “Seamless Watch” watch has all the features that users expect in a digital watch, and some unusual features.
+
+The watch has the following features:
+
+Time and date displayed on the screen. Current time is in large numbers, date is in small numbers above it.
+
+Light: Pressing the light button on the side of the watch activates a light while the button is pressed. Pressing and holding that button for 3 seconds turns on the light and keeps it on, until the button is held again for 3 seconds or up to 2 hours. After 2 hours, it will automatically turn off.
+
+Alarm. A daily alarm may be set for a given time. The alarm may be enabled or disabled. When the alarm is enabled and the alarm time is reached, the watch will beep fast for 5 seconds, then slowly for 30 seconds, then fast for another 5 seconds. Pressing any button stops the alarm sound (in addition to performing its normal function).
+
+Timer. Timer mode shows a count-up timer that starts at 00:00. When the timer is started, it counts up. Pressing the start/stop button will pause the timer, pressing it again continues counting up. Pressing and holding the button for 3 seconds resets the timer to 00:00 and stops counting.
+
+Mystery answer. After entering this mode, the screen initially displays “ask now”. The user may ask a yes-or-no question aloud and press the start/stop button, this will display a randomly selected answer that is one of the following: “yeah”, “yeah right”, “no”, “no doubt”, “keep trying”, “keep dreaming”. Whenever the display has more than one word, only one word is displayed for 2 seconds, then the other word is displayed for 2 seconds, alternately. The answer is displayed until the user leaves this mode, or he/she presses start/stop again for a new answer.
+
+Note: these strings are for the English version of the watch, we will need to use completely different strings in other countries without reprogramming the logic of the watch.
+
+The user may cycle among all modes (date/time, timer, mystery answer) by pressing the mode button.
+
+{{< gallery dir="/images/projects" class="" height="400" width="400" webp="true" command="Fit" option="" zoomable="true" >}}

exampleSite/content/english/portfolio/use-less-brand.md

@@ -0,0 +1,30 @@
+---
+title: "USE-LESS BRAND"
+date: 2019-12-23T15:58:10+06:00
+type: portfolio
+image: "/images/projects/project-thumb-one.jpg"
+category: ["UI, UX"]
+button_label: "View Project"
+featured: false
+draft: false
+---
+
+The “Seamless Watch” watch has all the features that users expect in a digital watch, and some unusual features.
+
+The watch has the following features:
+
+Time and date displayed on the screen. Current time is in large numbers, date is in small numbers above it.
+
+Light: Pressing the light button on the side of the watch activates a light while the button is pressed. Pressing and holding that button for 3 seconds turns on the light and keeps it on, until the button is held again for 3 seconds or up to 2 hours. After 2 hours, it will automatically turn off.
+
+Alarm. A daily alarm may be set for a given time. The alarm may be enabled or disabled. When the alarm is enabled and the alarm time is reached, the watch will beep fast for 5 seconds, then slowly for 30 seconds, then fast for another 5 seconds. Pressing any button stops the alarm sound (in addition to performing its normal function).
+
+Timer. Timer mode shows a count-up timer that starts at 00:00. When the timer is started, it counts up. Pressing the start/stop button will pause the timer, pressing it again continues counting up. Pressing and holding the button for 3 seconds resets the timer to 00:00 and stops counting.
+
+Mystery answer. After entering this mode, the screen initially displays “ask now”. The user may ask a yes-or-no question aloud and press the start/stop button, this will display a randomly selected answer that is one of the following: “yeah”, “yeah right”, “no”, “no doubt”, “keep trying”, “keep dreaming”. Whenever the display has more than one word, only one word is displayed for 2 seconds, then the other word is displayed for 2 seconds, alternately. The answer is displayed until the user leaves this mode, or he/she presses start/stop again for a new answer.
+
+Note: these strings are for the English version of the watch, we will need to use completely different strings in other countries without reprogramming the logic of the watch.
+
+The user may cycle among all modes (date/time, timer, mystery answer) by pressing the mode button.
+
+{{< gallery dir="/images/projects" class="" height="400" width="400" webp="true" command="Fit" option="" zoomable="true" >}}