mysticmode/website
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Update blog design

Browse Source
This commit is contained in:
Nirmal Kumar R
2026-03-08 04:59:58 +05:30
parent 2a4a6615ac
commit 76ad0676f3
38 changed files with 625 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blog.html
+7 -7
View File
@@ -9,19 +9,17 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
</header>
<main>
<h4>// blog</h4>
<ul>
<li>
<a href="blog/the-ordinary-man.html">The Ordinary man and the hard days reality</a>
@@ -82,8 +80,10 @@
</li>
</ul>
</main>
<div class="separator">
<img src="img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/50-years.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">50 Years <span class="date">[2023-07-20]</span></div>
<div class="content">
<p>
@@ -43,8 +42,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/a-bite-of-unconscious-way.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">A bite of unconscious way <span class="date">[2024-08-10]</span></div>
<div class="content">
<p>
@@ -72,8 +71,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/creativity.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">Creativity <span class="date">[2023-04-20]</span></div>
<div class="content">
<p>
@@ -78,8 +77,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/hello-from-mysticmode.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">Hello from mysticmode <span class="date">[2021-11-28]</span></div>
<div class="content">
<p>
@@ -45,8 +44,10 @@
<p>Much love to you -- Nirmal</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/in-praise-of-silent-voice.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">In praise of silent voice <span class="date">[2022-10-20]</span></div>
<div class="content">
<p>
@@ -67,8 +66,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/interview-with-annamalai-swami-by-jim-lemkin.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">
Interview with Annamalai Swami by Jim Lemkin
<span class="date">[2020-11-10]</span>
@@ -86,8 +85,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/is-it-really-smart-work.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">Is it really smart work? <span class="date">[2022-05-02]</span></div>
<div class="content">
<p>
@@ -43,8 +42,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/mid-of-the-crisis.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">Mid of the crisis <span class="date">[2023-02-07]</span></div>
<div class="content">
<p>
@@ -38,8 +37,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/my-admiration-and-respect-for-bruce-lee.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">
My admiration and respect for Bruce Lee
<span class="date">[2022-12-17]</span>
@@ -84,8 +83,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/nothing-can-beat-this.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">Nothing can beat this <span class="date">[2024-03-11]</span></div>
<div class="content">
<p>Nothing can beat this - there could be lot of books, videos, documentaries on life and well-being, spiritually
@@ -32,8 +31,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/occurrence-and-non-occurrence.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">
Occurrence and non-occurrence <span class="date">[2022-05-04]</span>
</div>
@@ -35,8 +34,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/the-ordinary-man.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">
The Ordinary man and the hard days reality
<span class="date">[2025-05-11]</span>
@@ -53,8 +52,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/time-goes-by-and-does-life-grow-in-you.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">
Time goes by and does life grow in you?
<span class="date">[2022-07-09]</span>
@@ -34,8 +33,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
blog/when-my-mental-health-goes-down.html
+9 -8
View File
@@ -9,19 +9,18 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper blog">
<div class="title">What I do when my mental health goes down <span class="date">[2024-10-22]</span></div>
<div class="content">
<p>
@@ -101,8 +100,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
img/bgme.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

img/garden.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 481 KiB

img/garden.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 12 KiB

img/nirmal-banner.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 19 KiB

img/nklogo.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 18 KiB

img/waves.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.1 KiB

index.html
+90 -11
View File
@@ -9,18 +9,15 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
</header>
<section class="content-wrapper">
<div class="content">
<p>
@@ -28,15 +25,97 @@
musings. Rest of it is my internal flight and experience which I
cannot put it into words although I try my best.
</p>
<p class="contact">
You can connect with me on
<a rel="me" href="https://ieji.de/@mysticmode">Mastodon</a> or
via <a href="mailto:hi@nirm.al">email</a>.
<p>
<h4>My own chosen writings:</h4>
<p><strong>// blog</strong></p>
<ul>
<li>
<li>
<a href="blog/the-ordinary-man.html">The Ordinary man and the hard days reality</a>
<span class="date">[2025-05-11]</span>
</li>
<li>
<a href="blog/a-bite-of-unconscious-way.html">A bite of unconscious way</a>
<span class="date">[2024-08-10]</span>
</li>
</li>
<li>
<a href="blog/in-praise-of-silent-voice.html">In praise of silent voice</a>
<span class="date">[2022-10-20]</span>
</li>
</ul>
<p><strong>// poems</strong></p>
<ul>
<li>
<a href="poems/you-not-be-me.html">You not be me</a>
<span class="date">[2025-01-30]</span>
</li>
<li>
<a href="poems/shades-of-status-quo.html">Shades of status quo</a>
<span class="date">[2024-12-20]</span>
</li>
<li>
<a href="poems/polar-bliss.html">Polar bliss</a>
<span class="date">[2023-04-09]</span>
</li>
<li>
<a href="poems/love-for-a-stranger.html">Love for a stranger</a>
<span class="date">[2022-12-10]</span>
</li>
<li>
<a href="poems/seeker.html">Seeker</a>
<span class="date">[2022-10-14]</span>
</li>
</ul>
</p>
</div>
<div class="aside">
<p class="headline">Nirmal Kumar R (mysticmode)</p>
<div class="me">
<img src="img/bgme.jpg">
</div>
<div class="github-username">
<a href="https://github.com/mysticmode" target="_blank">gh: @mysticmode</a>
</div>
<div class="elsewhere">
<h5>elsewhere:</h5>
<div>
<h4>mastodon:</h4>
<a href="https://ieji.de/@mysticmode" target="_blank">@mysticmode</a>
</div>
<div>
<h4>youtube:</h4>
<a href="https://www.youtube.com/@mysticmode" target="_blank">@mysticmode</a>
</div>
<div>
<h4>curated playlist:</h4>
<a href="https://www.youtube.com/watch?v=UwTqcctD1rw&list=PLvt_osSC-5-a9XZP71wLeXJc47dybCMVY" target="_blank">Hits from Heart</a>
</div>
<div class="favorites">
<h5>favorites:</h5>
<div>
<h4>music:</h4>
<a href="https://en.wikipedia.org/wiki/Arvo_P%C3%A4rt" target="_blank">Arvo Pärt</a>
</div>
<div>
<h4>movie:</h4>
<a href="https://en.wikipedia.org/wiki/April_Snow" target="_blank">April Snow</a>
</div>
<div>
<h4>writer</h4>
<a href="https://en.wikipedia.org/wiki/Paulo_Coelho" target="_blank">Paulo Coelho</a>
</div>
<div>
<h4>person in history</h4>
<a href="https://en.wikipedia.org/wiki/Rumi" target="_blank">Rumi</a>
</div>
</div>
</div>
</section>
<div class="separator">
<img src="img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems.html
+7 -7
View File
@@ -9,19 +9,17 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
</header>
<main>
<h4>// poems</h4>
<ul>
<li>
<a href="poems/questioning-of-silence.html">Questioning of silence</a>
@@ -81,8 +79,10 @@
</li>
</ul>
</main>
<div class="separator">
<img src="img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/a-place-in-my-heart.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">A place in my heart <span class="date">[2022-11-26]</span></div>
<div class="content">
<p>
@@ -51,8 +48,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/dont-just-get-going.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Don't just get going <span class="date">[2022-01-05]</span></div>
<div class="content">
<p>
@@ -39,8 +36,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/free-yourself.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Free yourself <span class="date">[2023-01-26]</span></div>
<div class="content">
<p>
@@ -44,8 +41,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/life-is-preciously-short.html
+6 -7
View File
@@ -9,18 +9,15 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
</header>
<section class="content-wrapper">
<div class="title">Life is preciously short <span class="date">[2021-08-12]</span></div>
<div class="content">
@@ -41,8 +38,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/love-for-a-stranger.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Love for a stranger <span class="date">[2022-12-10]</span></div>
<div class="content">
<p>
@@ -50,8 +47,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/musical-play.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Musical play <span class="date">[2025-10-12]</span></div>
<div class="content">
<p>
@@ -35,8 +32,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/my-life-is-not-shrinking.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">My life is not shrinking <span class="date">[2022-05-22]</span></div>
<div class="content">
<p>My life is not shrinking;</p>
@@ -35,8 +32,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/path-and-love.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Path and Love <span class="date">[2022-09-29]</span></div>
<div class="content">
<p>
@@ -30,8 +27,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/polar-bliss.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Polar bliss <span class="date">[2023-04-09]</span></div>
<div class="content">
<p>
@@ -44,8 +41,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/questioning-of-silence.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Questioning of silence <span class="date">[2025-11-18]</span></div>
<div class="content">
<p>They say being in silence is the key to realization of oneself<br />
@@ -52,8 +49,10 @@
<p>As always, the questions ponder over and go away, but to write these questions is to do justice to my own thinking, for it to not become a paradox of my life.</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/seeker.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Seeker <span class="date">[2022-10-14]</span></div>
<div class="content">
<p>
@@ -48,8 +45,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/shades-of-status-quo.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Shades of status quo <span class="date">[2024-12-20]</span></div>
<div class="content">
<p>
@@ -51,8 +48,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/solitude.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">Solitude <span class="date">[2014-09-09]</span></div>
<div class="content">
<p>
@@ -43,8 +40,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
poems/you-not-be-me.html
+7 -8
View File
@@ -9,19 +9,16 @@
</head>
<body>
<a rel="me" href="https://ieji.de/@mysticmode" style="display:none;">Mastodon</a>
<a href="/" class="header">
<div class="logo">
<img src="/img/garden.png" width="70px" />
</div>
<p><img src="/img/nirmal-banner.png" height="50px"></p>
</a>
<header>
<img src="/img/garden.jpg" class="banner" width="800px">
<nav>
<a href="/">Home</a>
<a href="/blog.html">Blog</a>
<a href="/poems.html">Poems</a>
<a href="mailto:hi@nirm.al">Contact</a>
</nav>
<section class="content-wrapper">
</header>
<section class="content-wrapper poems">
<div class="title">You not be me <span class="date">[2025-01-30]</span></div>
<div class="content">
<p>
@@ -50,8 +47,10 @@
</p>
</div>
</section>
<div class="separator">
<img src="/img/waves.jpg">
</div>
<footer>
<hr />
© Nirmal Kumar R. All original text, is licensed under a
<a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
Source code of this website can be found
style.css
+111 -68
View File
@@ -1,5 +1,5 @@
:root {
--font-weight-normal: 500;
--font-weight-normal: 400;
--font-weight-medium: 600;
--font-weight-bold: 800;
}
@@ -15,26 +15,19 @@ body {
}
body {
font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Times", serif, "Amiri", "Arial", serif;
font-feature-settings: "tnum";
font-variant-numeric: tabular-nums;
font-size: 16px;
font-size: 14px;
font-weight: var(--font-weight-normal);
line-height: 1.5;
text-decoration: none;
color: #333;
width: 60ch;
margin: 1em auto;
width: 800px;
margin: 2em auto;
padding: 0 2em;
}
a {
display: inline-block;
color: #000;
text-decoration: underline;
text-decoration-thickness: 2px;
}
p {
word-break: break-word;
word-wrap: break-word;
@@ -56,49 +49,38 @@ pre {
overflow-y: hidden;
}
.header {
header {
width: 800px;
display: flex;
flex-direction: column;
align-items: center;
text-decoration: none;
border: none;
}
.header:hover {
border-bottom: none;
}
.header p {
font-size: 20px;
font-family: "Neue Haas Grotesk Display Pro", serif;
color: #333;
}
.logo {
border-radius: 50%;
height: 75px;
width: 75px;
}
.logo>img {
border-radius: 50%;
}
nav {
display: block;
margin: 1em 0;
display: flex;
justify-content: space-around;
border: 1px dotted;
border-top: none;
}
nav a {
margin-right: 1em;
font-size: 14px;
font-weight: var(--font-weight-medium);
color: #333;
text-transform: uppercase;
font-weight: var(--font-weight-normal);
color: #000;
text-transform: lowercase;
text-decoration: none;
border-bottom: none;
padding: 0 1em;
}
nav a:last-child {
margin-right: 0;
a {
color: #000;
text-decoration: none;
border-bottom: 1px dotted;
}
a:hover, nav a:hover {
background-color: #000;
color: white;
}
.home img {
@@ -112,19 +94,98 @@ ul {
ul li {
list-style: none;
text-transform: uppercase;
margin-bottom: 1em;
}
.separator {
width: 800px;
display: flex;
justify-content: center;
}
.content-wrapper {
display: flex;
align-items: start;
width: 800px;
text-align: justify;
margin-bottom: 3em;
}
.content-wrapper.blog,
.content-wrapper.poems {
margin-top: 20px;
flex-direction: column;
}
.content-wrapper.blog .content,
.content-wrapper.poems .content {
min-height: auto;
}
.content-wrapper .aside {
width: 275px;
border-left: 1px dotted;
}
.aside .me {
height: 147px;
}
.aside .me img {
width: 147px;
height: 147px;
}
.aside .github-username {
background: black;
text-align: center;
padding: 7px 0;
}
.aside .github-username a {
color: white;
}
.aside .headline {
text-align: center;
font-size: 12px;
}
.aside .elsewhere {
padding: 0 5px;
}
.aside .elsewhere h5 {
font-style: italic;
margin: 7px 0 2px;
}
.aside .elsewhere h4 {
margin: 0;
}
.aside .elsewhere a {
font-size: 12px;
}
.aside .elsewhere div {
margin-bottom: 15px;
}
.content-wrapper .content {
width: auto;
min-height: 500px;
padding-right: 10px;
}
.content-wrapper .title {
font-size: 1rem;
font-weight: var(--font-weight-bold);
text-transform: uppercase;
}
ul li a {
font-size: 14px;
font-weight: var(--font-weight-bold);
font-weight: var(--font-weight-normal);
color: #333;
}
@@ -143,30 +204,12 @@ main ul li span {
display: block;
}
hr {
position: relative;
display: block;
height: 1.20rem;
margin: 1em 0;
border: none;
color: #000;
}
hr::after {
display: block;
content: "";
position: absolute;
top: calc(1.20rem / 2 - 2px);
left: 0;
width: 100%;
border-top: calc(2px * 3) double #000;
height: 0;
}
footer {
font-size: 12px;
color: #666;
margin-bottom: 3em;
margin-top: 10px;
width: 800px;
text-align: justify;
}
footer a {