diff --git a/config.toml b/config.toml
index aa791ad..9e1e6d4 100644
--- a/config.toml
+++ b/config.toml
@@ -5,6 +5,7 @@ compile_sass = false
minify_html = true
generate_feed = true
default_language = "en"
+output_dir = "docs"
taxonomies = [
{name = "tags", feed = true},
diff --git a/content/_index.md b/content/_index.md
index a4a9d13..61b644d 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -10,7 +10,7 @@ Official blog of Cybersecurity Club, IIT Madras.
## Posts
-- [First Post](./blog/first-post)
+- [First Post](./blog/posts/first-post)
## Tags
diff --git a/content/blog/_index.md b/content/blog/_index.md
deleted file mode 100644
index a04d3f5..0000000
--- a/content/blog/_index.md
+++ /dev/null
@@ -1,9 +0,0 @@
-+++
-paginate_by = 15
-path = "blog"
-title = "All blog posts"
-sort_by = "date"
-page_template = "blog-page.html"
-+++
-
-> List of all *[tags](/tags)*
\ No newline at end of file
diff --git a/content/blog/2024-05-22-first-post.md b/content/posts/2024-05-22-first-post.md
similarity index 100%
rename from content/blog/2024-05-22-first-post.md
rename to content/posts/2024-05-22-first-post.md
diff --git a/docs/click.ogg b/docs/click.ogg
new file mode 100644
index 0000000..f9c6dc0
Binary files /dev/null and b/docs/click.ogg differ
diff --git a/docs/css/style.css b/docs/css/style.css
new file mode 100644
index 0000000..85c84ac
--- /dev/null
+++ b/docs/css/style.css
@@ -0,0 +1,105 @@
+#nav-bar {
+ padding: .625rem 0 0 0;
+ display: flex;
+ flex-direction: row;
+ gap: .25rem;
+ flex-wrap: wrap;
+ justify-content: flex-end;
+ align-items: center;
+ align-content: flex-end
+}
+
+#footer-container {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.accent-data {
+ color: var(--accent);
+}
+
+.theme-transition {
+ transition: color 0.3s ease, background-color 0.3s ease;
+}
+
+.tags-data {
+ display: flex;
+ flex-direction: column;
+ flex-wrap: wrap;
+ justify-content: flex-end;
+ align-items: flex-start;
+ align-content: flex-end
+}
+
+.title-list li {
+ margin-bottom: .375rem;
+}
+
+/* icons settings */
+.icons {
+ width: 1.3rem;
+ height: 1.3rem;
+ aspect-ratio: 1/1;
+ display: inline-block;
+ vertical-align: middle;
+ color: var(--text);
+ fill: var(--text);
+ background-color: transparent;
+ cursor: pointer;
+}
+
+.icons:hover {
+ background-color: transparent;
+ color: var(--accent);
+}
+
+/* footnotes */
+.footnote-definition {
+ margin: 0 0 0 .125rem;
+}
+
+.footnote-definition-label {
+ color: var(--accent);
+}
+
+.footnote-definition p {
+ display: inline;
+ margin: .625rem 0 0 .625rem;
+}
+
+/* general classes */
+.no-style {
+ padding: 0;
+ margin: 0;
+ border: none;
+ border-radius: 0
+}
+
+.no-style:hover {
+ background-color: transparent;
+ color: var(--accent);
+}
+
+.center {
+ text-align: center;
+}
+
+.center img {
+ display: block;
+ margin: 1rem auto;
+}
+
+.float-right {
+ float: right
+}
+
+.float-left {
+ float: left
+}
+
+/* shortcodes css */
+.webring {
+ margin: .375rem;
+}
\ No newline at end of file
diff --git a/docs/favicon.ico b/docs/favicon.ico
new file mode 100644
index 0000000..7eb16ea
Binary files /dev/null and b/docs/favicon.ico differ
diff --git a/docs/icons.svg b/docs/icons.svg
new file mode 100644
index 0000000..374e315
--- /dev/null
+++ b/docs/icons.svg
@@ -0,0 +1,21 @@
+
\ No newline at end of file
diff --git a/docs/js/script.js b/docs/js/script.js
new file mode 100644
index 0000000..298b900
--- /dev/null
+++ b/docs/js/script.js
@@ -0,0 +1,49 @@
+const toggleButton = document.getElementById('theme-toggle');
+const themeIcon = document.getElementById('theme-icon');
+const themeSound = document.getElementById('theme-sound');
+
+// Function to update the theme icon based on the current theme
+const updateThemeIcon = (isDarkMode) => {
+ const themeMode = isDarkMode ? 'darkMode' : 'lightMode';
+ const iconPath = themeIcon.querySelector('use').getAttribute('href').replace(/#.*$/, `#${themeMode}`);
+ themeIcon.querySelector('use').setAttribute('href', iconPath);
+};
+
+// Function to update the theme based on the current mode
+const updateTheme = (isDarkMode) => {
+ const theme = isDarkMode ? 'dark' : 'light';
+ document.documentElement.setAttribute('data-theme', theme);
+ updateThemeIcon(isDarkMode);
+};
+
+// Function to toggle the theme
+const toggleTheme = () => {
+ const isDarkMode = toggleButton.checked;
+ updateTheme(isDarkMode);
+ themeSound.play();
+ localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
+
+ // Add transition class to body for smooth transition
+ document.body.classList.add('theme-transition');
+ setTimeout(() => {
+ document.body.classList.remove('theme-transition');
+ }, 300);
+};
+
+// Event listener for theme toggle
+toggleButton.addEventListener('change', toggleTheme);
+
+// Function to initialize the theme based on the stored preference
+const initializeTheme = () => {
+ const storedTheme = localStorage.getItem('theme');
+ const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+ const isDarkMode = storedTheme === 'dark' || (!storedTheme && prefersDark);
+ toggleButton.checked = isDarkMode;
+ updateTheme(isDarkMode);
+};
+
+// Initialize the theme
+initializeTheme();
+
+// Listen for changes in system preference
+window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', initializeTheme);
diff --git a/templates/atom.xml b/templates/atom.xml
new file mode 100644
index 0000000..1533175
--- /dev/null
+++ b/templates/atom.xml
@@ -0,0 +1,53 @@
+
+
+ {{ config.title }}
+ {%- if term %} - {{ term.name }}
+ {%- elif section.title %} - {{ section.title }}
+ {%- endif -%}
+
+ {%- if config.description %}
+ {{ config.description }}
+ {%- endif %}
+
+
+ Zola
+ {{ last_updated | date(format="%+") }}
+ {{ feed_url | safe }}
+ {%- for page in pages %}
+
+ {{ page.title }}
+ {{ page.date | date(format="%+") }}
+ {{ page.updated | default(value=page.date) | date(format="%+") }}
+ {% for author in page.authors %}
+
+
+ {{ author }}
+
+
+ {% else %}
+
+
+ {%- if config.author -%}
+ {{ config.author }}
+ {%- else -%}
+ Unknown
+ {%- endif -%}
+
+
+ {% endfor %}
+
+ {{ page.permalink | safe }}
+ {% if page.summary %}
+ {{ page.summary }}
+ {% else %}
+ {{ page.content }}
+ {% endif %}
+
+ {%- endfor %}
+