2024-12-26 11:14:14 +00:00
<!DOCTYPE html>
< html lang = "en" dir = "ltr" id = "top" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta property = "og:title" content = "Remembering the 2004 Indian Ocean Tsunami | Blog" >
< link rel = "canonical" href = "https://leilukin.com/blog/posts/2024-12-26-indian-ocean-tsunami-20-years/" >
< meta name = "generator" content = "Eleventy v3.0.0" >
< meta name = "author" content = "Leilukin" >
< meta name = "description" content = "It is hard to believe that it has been 20 years since the 2004 Indian Ocean tsunami happened." >
< meta name = "fediverse:creator" content = "@Leilukin@dragonscave.space" >
< meta property = "og:site_name" content = "Leilukin's Hub" >
< meta property = "og:type" content = "article" >
< meta property = "og:description" content = "It is hard to believe that it has been 20 years since the 2004 Indian Ocean tsunami happened." >
< meta property = "og:url" content = "https://leilukin.com/blog/posts/2024-12-26-indian-ocean-tsunami-20-years/" >
< meta property = "og:locale" content = "en_MY" >
< meta property = "og:image" content = "https://leilukin.com/assets/leilukin/leilukins-hub-meta-img.png" >
< meta name = "theme-color" content = "#3d2163" >
< link rel = "alternate" type = "application/rss+xml" title = "Leilukin's Hub" href = "/feed.xml" >
< link rel = "preload" href = "/assets/fonts/lexend/lexend-v19-latin-regular.woff2" as = "font" type = "font/woff2" crossorigin = "anonymous" >
< link rel = "preload" href = "/assets/fonts/lexend/lexend-v19-latin-700.woff2" as = "font" type = "font/woff2" crossorigin = "anonymous" >
< style >
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 400;
src: url('/assets/fonts/lexend/lexend-v19-latin-regular.woff2') format('woff2');
}
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 700;
src: url('/assets/fonts/lexend/lexend-v19-latin-700.woff2') format('woff2');
}
< / style >
< link rel = "stylesheet" href = "/assets/fonts/fonts.css" >
< link rel = "stylesheet" href = "/assets/css/global.css" > < link rel = "stylesheet" href = "/assets/css/general.css" > < link rel = "stylesheet" href = "/assets/css/content.css" > < link rel = "stylesheet" href = "/assets/css/plugins.css" > < link rel = "stylesheet" href = "/assets/css/components.css" > < link rel = "stylesheet" href = "/assets/css/a11y-syntax-highlighting-dark.css" > < link rel = "stylesheet" href = "/assets/css/pridesymbols.css" > < link rel = "stylesheet" href = "/assets/css/utility.css" >
< style > . c o n t e n t _ _ n a v {
padding: 1.2em clamp(1em, 5%, 1.5em);
background-color: var(--clr-content-bg);
}
.content__nav--title {
font-size: 1.7rem;
}
.breadcrumbs {
list-style-type: "";
padding: 0;
margin: 0 0 0.7em 0;
display: flex;
gap: 0.5em;
flex-wrap: wrap;
justify-content: center;
}
.breadcrumbs li::after {
content: '➔';
padding-left: 0.3em;
}
.blog__post--pagination {
padding-top: 1em;
margin-block-start: 2.5em;
border-top: 0.1em solid var(--clr-title-border);
}
.blog__post--nextprev {
list-style-type: "";
padding: 0;
margin: 0;
display: grid;
gap: 0.7em;
grid-template-columns: repeat(2, 1fr);
grid-template-areas: 'prev next';
}
.blog__post--prev { grid-area: prev; }
.blog__post--next { grid-area: next; }
.hero img { filter:
drop-shadow(0.1rem 0.1rem 0.2rem black)
drop-shadow(0.1rem 0.1rem 0.2rem rgba(30, 30, 30, 0.8))
; }
.hero {
width: 100%;
background-color: var(--clr-hero-bg);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
.hero__top-bar {
background: var(--clr-navbar-bg);
width: 100%;
padding: 0.5em 0.7em;
}
.hero__img {
display: grid;
place-content: center;
}
.hero img {
object-fit: contain;
overflow: hidden;
max-height: 16rem;
}
.navbar {
background: var(--clr-navbar-bg);
width: 100%;
z-index: 998;
position: sticky;
top: 0;
padding: 0.6em;
}
.navbar__menu {
list-style-type: "";
margin: 0;
padding: 0;
display: flex;
gap: 1em;
flex-wrap: wrap;
text-align: center;
}
.navbar__menu a {
color: var(--clr-navbar-link);
text-decoration: none;
font-weight: 700;
cursor: pointer;
display: inline-block;
}
.navbar__menu a:hover { color: var(--clr-link-hover); }
.navbar__menu a:focus { outline-offset: 0.2em; }
.navbar__links {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
gap: 0.5em;
}
.navbar__toggle {
background-color: inherit;
color: var(--clr-navbar-link);
border: none;
padding: 0;
font-size: 1.25rem;
font-weight: 700;
display: none;
align-items: center;
gap: 0.3em;
}
.navbar__toggle svg { fill: currentColor; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline-offset: 0.1em; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline: 0.15em solid var(--clr-navbar-link); }
.navbar__popover {
background: var(--clr-navbar-bg);
border: 0.15em solid var(--clr-navbar-link);
padding: 1.5em;
max-width: 85%;
}
.navbar__popover::backdrop {
background-color: black;
opacity: 0.5;
}
@supports selector([popover]) {
.navbar__toggle { display: flex; }
.navbar__links { display: none; }
}
/* Tablet screen size */
@media only screen and (min-width: 43.75rem) {
.navbar { padding: 1em 0.6em; }
.navbar__toggle, .navbar__popover { display: none; }
.navbar__links { display: flex; }
}
.top-btn,
.top-btn:hover {
color: var(--clr-top-btn-txt);
text-decoration: none;
font-weight: 700;
}
.top-btn {
position: fixed;
bottom: 0.5rem;
right: 0.5rem;
z-index: 999;
background-color: var(--clr-top-btn-bg);
display: flex;
align-items: center;
border-radius: 50em;
padding: 0.3em 0.5em;
gap: 0.2em;
}
.top-btn:focus {
outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em;
}
.top-btn__arrow {
display: inline-block;
width: 1em;
aspect-ratio: 1 / 1;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
:root { --footer-gap: 0.5em; }
.footer {
margin-top: auto;
width: 100%;
background: var(--clr-main-footer-bg);
padding: 1.5rem 1rem clamp(1.5rem, calc(100% - 1.5rem), 3.5rem);
text-align: center;
display: grid;
gap: var(--footer-gap);
}
.footer__links,
.footer__shrines {
display: flex;
flex-wrap: wrap;
justify-content: center;
column-gap: var(--footer-gap);
}
.footer__links { justify-self: center; }
.footer__shrines { align-self: center; }< / style >
< link rel = "icon" sizes = "32x32" href = "/favicon.ico" >
< link rel = "icon" type = "image/svg+xml" href = "/assets/favicon/leilukin-bee-favicon.svg" >
< link rel = "apple-touch-icon" sizes = "180x180" href = "/assets/favicon/apple-touch-icon.png" >
< link rel = "manifest" href = "/assets/favicon/site.webmanifest" >
< link rel = "me" href = "https://dragonscave.space/@Leilukin" >
< link rel = "me" href = "https://github.com/Leilukin" >
< link rel = "authorization_endpoint" href = "https://indieauth.com/auth" >
< script src = "/assets/js/D968lGk6J8.js" defer = "" > < / script >
< title >
Remembering the 2004 Indian Ocean Tsunami | Blog | Leilukin's Hub
< / title >
< / head >
< body >
< div class = "skip-btn" > < a href = "#content" > Skip to content< / a > < / div >
< header class = "hero" >
< div class = "hero__top-bar hidden" > < / div >
< div class = "hero__img" >
< img fetchpriority = "high" src = "/assets/leilukin/Leilukins-Hub-website-banner.avif" alt = "Banner of Leilukin's Hub" width = "900" height = "300" >
< / div >
< / header >
< nav class = "navbar" aria-labelledby = "top-level-nav-title" >
< h2 class = "visually-hidden" id = "top-level-nav-title" > Top Level< / h2 >
< ul class = "navbar__menu navbar__links" >
< li >
< a href = "/" > Home< / a >
< / li >
< li >
< a href = "/about/" > About< / a >
< / li >
< li >
< a href = "/now/" > Now< / a >
< / li >
< li >
< a href = "/blog/" > Blog< / a >
< / li >
< li >
< a href = "/articles/" > Articles< / a >
< / li >
< li >
< a href = "/projects/" > Projects< / a >
< / li >
< li >
< a href = "/shrines/" > Shrines< / a >
< / li >
< li >
< a href = "/adoptables/" > Adoptables< / a >
< / li >
< li >
< a href = "/links/" > Links< / a >
< / li >
< li >
< a href = "/guestbook/" > Guestbook< / a >
< / li >
< / ul >
< button class = "navbar__toggle" popovertarget = "nav-menu" aria-label = "Toggle navigation menu" >
< svg aria-hidden = "true" focusable = "false" width = "1em" height = "1em" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 448 512" > <!-- !Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. --> < path d = "M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z" > < / path > < / svg >
Navigation
< / button >
< / nav >
< div popover = "" id = "nav-menu" class = "navbar__popover" >
< ul class = "navbar__menu" >
< li >
< a href = "/" > Home< / a >
< / li >
< li >
< a href = "/about/" > About< / a >
< / li >
< li >
< a href = "/now/" > Now< / a >
< / li >
< li >
< a href = "/blog/" > Blog< / a >
< / li >
< li >
< a href = "/articles/" > Articles< / a >
< / li >
< li >
< a href = "/projects/" > Projects< / a >
< / li >
< li >
< a href = "/shrines/" > Shrines< / a >
< / li >
< li >
< a href = "/adoptables/" > Adoptables< / a >
< / li >
< li >
< a href = "/links/" > Links< / a >
< / li >
< li >
< a href = "/guestbook/" > Guestbook< / a >
< / li >
< / ul >
< / div >
< main id = "content" >
< header class = "main__header" >
< nav aria-labelledby = "breadcrumbs-title" >
< h2 class = "visually-hidden" id = "breadcrumbs-title" > Breadcrumbs< / h2 >
< ol class = "breadcrumbs" >
< li >
< a href = "/blog/" > Blog< / a >
< / li >
< li >
< a href = "/blog/posts/" > Blog Archive< / a >
< / li >
< / ol >
< / nav >
< h1 > Remembering the 2004 Indian Ocean Tsunami< / h1 >
< div class = "article__info" >
< p >
182 words.
Posted on < time datetime = "2024-12-26T19:11:55+0800" > 26 December 2024< / time > by Leilukin
< / p >
< p > Categories:
< a href = "/categories/asia" > asia< / a >
< / p >
< / div >
< / header >
< content-wrapper >
< article class = "content" >
< p > Twenty years ago today, the 2004 Indian Ocean earthquake and tsunami happened.< / p >
< p > When I realised a while ago that the year 2024 would also mark the 20th anniversary of the earthquake and tsunami, I felt that time filed, because I still remembered the shock I felt in my young mind when I read the news reports about that natural disaster.< / p >
< p > When the Indian Ocean tsunami struck in 2004, I had just graduated from primary school and was staying at home, and 26 December was also the birthday of my favourite cousin. Later, when I learnt of the massive earthquake in the Indian Ocean caused a massive tsunami that affected many countries, including my own country, Malaysia (especially the northern Malaysia), I was deeply shocked by how deadly and destructive the tsunami was, with the sheer amount of lives lost and the destruction of areas caused by that natural disaster, even though the part of Malaysia I lived (and still live) in was not affected.< / p >
< p > May the dead rest in peace. My condolences to those who lost their loved ones on that day.< / p >
< nav class = "blog__post--pagination" aria-labelledby = "nextprev-title" >
< h2 class = "visually-hidden" id = "nextprev-title" > Next and Previous Blog Posts< / h2 >
< ul class = "blog__post--nextprev" >
< li class = "blog__post--prev" >
< p > Previous Post:< / p >
< a href = "/blog/posts/2024-12-25-leilukins-2024-in-review/" > Leilukin' s 2024: A Year In Review< / a >
< / li >
2024-12-27 04:10:32 +00:00
< li class = "blog__post--next" >
< p > Next Post:< / p >
< a href = "/blog/posts/2024-12-27-my-2024-christmas-season/" > My Christmas Season in 2024< / a >
< / li >
2024-12-26 11:14:14 +00:00
< / ul >
< / nav >
< / article >
< aside class = "right-sidebar" aria-label = "Right sidebar" >
< nav class = "content__nav sidebar--sticky" aria-labelledby = "my-contents-title" >
< h2 class = "content__nav--title" id = "my-contents-title" > My Contents< / h2 >
< ul class = "content__nav--links" >
< li > < a href = "/archive/" > Content Archive< / a > < / li >
< li > < a href = "/categories/" > Content Categories< / a > < / li >
< li > < a href = "/articles/" > Articles< / a > < / li >
< li > < a href = "/blog/posts/" > Blog Archive< / a > < / li >
< li > < a href = "/blog/" > Blog Home< / a > < / li >
< / ul >
< / nav >
< / aside >
< / content-wrapper >
< / main >
< footer class = "footer" >
< p >
< svg class = "inline-icon" aria-hidden = "true" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 512 512" > <!-- !Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. --> < path d = "M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48L48 64zM0 176L0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-208L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z" > < / path > < / svg >
< a rel = "nofollow, noindex" href = "emailme/" > Contact me by email< / a > (< a href = "https://useplaintext.email/" > plain text email< / a > encouraged)
< / p >
< h2 class = "visually-hidden" > Footer Navigation:< / h2 >
< ul class = "inline-nav footer__links" >
< li >
< a href = "/feed.xml" > < svg class = "inline-icon" aria-hidden = "true" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 448 512" > <!-- !Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. --> < path d = "M0 64C0 46.3 14.3 32 32 32c229.8 0 416 186.2 416 416c0 17.7-14.3 32-32 32s-32-14.3-32-32C384 253.6 226.4 96 32 96C14.3 96 0 81.7 0 64zM0 416a64 64 0 1 1 128 0A64 64 0 1 1 0 416zM32 160c159.1 0 288 128.9 288 288c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-123.7-100.3-224-224-224c-17.7 0-32-14.3-32-32s14.3-32 32-32z" > < / path > < / svg > RSS Feed< / a >
< / li >
< li > < a href = "/sitemap/
">Site Map< / a > < / li > < li > < a href = "/changelogs/" > Changelogs< / a > < / li > < li > < a href = "/accessibility/" > Accessibility< / a > < / li > < li > < a href = "/colophon/" > Colophon< / a > < / li > < / ul >
< p > Made with ♥ by Leilukin since 11 September 2022< / p >
< p >
< svg class = "inline-icon" aria-hidden = "true" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 640 512" > <!-- !Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. --> < path d = "M96 64c0-17.7 14.3-32 32-32l320 0 64 0c70.7 0 128 57.3 128 128s-57.3 128-128 128l-32 0c0 53-43 96-96 96l-192 0c-53 0-96-43-96-96L96 64zM480 224l32 0c35.3 0 64-28.7 64-64s-28.7-64-64-64l-32 0 0 128zM32 416l512 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 480c-17.7 0-32-14.3-32-32s14.3-32 32-32z" > < / path > < / svg >
< a href = "https://ko-fi.com/leilukin" > Support me on Ko-Fi< / a >
< / p > < div class = "h-card hidden" >
< span class = "p-name p-nickname" > Leilukin< / span >
< a href = "/" class = "u-url" > Home page< / a >
< img src = "https://i.postimg.cc/RZJgS6tY/leilukin-bee.avif" alt = "Leilukin" class = "u-photo" loading = "lazy" >
< span class = "p-country-name" > Malaysia< / span >
< span class = "p-note" > They/she. A proudly queer and autistic < span class = "p-gender-identity" > non-binary< / span > lesbian from Malaysia.< / span >
< / div > < a href = "#top" class = "top-btn" >
< svg class = "top-btn__arrow" focusable = "false" aria-hidden = "true" viewBox = "0 0 26 28" >
< path d = "M25.172 15.172c0 0.531-0.219 1.031-0.578 1.406l-1.172 1.172c-0.375 0.375-0.891 0.594-1.422 0.594s-1.047-0.219-1.406-0.594l-4.594-4.578v11c0 1.125-0.938 1.828-2 1.828h-2c-1.062 0-2-0.703-2-1.828v-11l-4.594 4.578c-0.359 0.375-0.875 0.594-1.406 0.594s-1.047-0.219-1.406-0.594l-1.172-1.172c-0.375-0.375-0.594-0.875-0.594-1.406s0.219-1.047 0.594-1.422l10.172-10.172c0.359-0.375 0.875-0.578 1.406-0.578s1.047 0.203 1.422 0.578l10.172 10.172c0.359 0.375 0.578 0.891 0.578 1.422z" > < / path >
< / svg >
Back to Top
< / a >
< / footer >
< / body >
< / html >
