update @ Sun Oct 29 00:03:22 EEST 2023

Signed-off-by: Ari Archer <ari.web.xyz@gmail.com>
2025-02-04 09:39:25 +01:00 · 2023-10-29 00:03:22 +03:00 · 2023-10-29 00:03:22 +03:00 · a6d929e444
commit a6d929e444
parent 8defe6564b
5 changed files with 110 additions and 129 deletions
--- a/blog.json
+++ b/blog.json
@ -46,7 +46,7 @@
  "website": "https://ari-web.xyz",
  "blog": "https://blog.ari-web.xyz",
  "source": "/git",
-  "visitor-count": "/visit",
+  "visitor-count": "https://server.ari-web.xyz/visit",
  "comment": "/c",
  "theme": {
    "primary": "#262220",
@ -2159,7 +2159,7 @@
    "how-to-print-coloured-text-in-c-and-c--": {
      "title": "how to print coloured text in c and c++",
      "description": "this is a simple problem but ppl look for complex solutions",
-      "content": "I decided to make this blog as I always need to\nfind how to print coloured text, so this is my solution to it\n\n## C++\n\n### Code\n\n    #define ANSI_BEGIN \"\\x1B[\"\n\n    namespace AnsiColour {\n    const char *red = ANSI_BEGIN \"31m\";\n    const char *green = ANSI_BEGIN \"32m\";\n    const char *yellow = ANSI_BEGIN \"33m\";\n    const char *blue = ANSI_BEGIN \"34m\";\n    const char *magenta = ANSI_BEGIN \"35m\";\n    const char *cyan = ANSI_BEGIN \"36m\";\n    const char *white = ANSI_BEGIN \"37m\";\n    } // namespace AnsiColour\n\n    namespace AnsiEffect {\n    const char *bold = ANSI_BEGIN \"1m\";\n    const char *reset = ANSI_BEGIN \"0m\";\n    const char *underline = ANSI_BEGIN \"4m\";\n    } // namespace AnsiEffect\n\n### Example usage\n\n    std::cout << AnsiColour::blue << AnsiEffect::bold\n        << \"Hello world\" << AnsiEffect::reset << '\\n';\n\n## C\n\n### Code\n\n    #define ANSI_BEGIN \"\\x1B[\"\n\n    const char *CLR_RED = ANSI_BEGIN \"31m\";\n    const char *CLR_GREEN = ANSI_BEGIN \"32m\";\n    const char *CLR_YELLOW = ANSI_BEGIN \"33m\";\n    const char *CLR_BLUE = ANSI_BEGIN \"34m\";\n    const char *CLR_MAGENTA = ANSI_BEGIN \"35m\";\n    const char *CLR_CYAN = ANSI_BEGIN \"36m\";\n    const char *CLR_WHITE = ANSI_BEGIN \"37m\";\n\n    const char *EFF_BOLD = ANSI_BEGIN \"1m\";\n    const char *EFF_RESET = ANSI_BEGIN \"0m\";\n    const char *EFF_UNDERLINE = ANSI_BEGIN \"4m\";\n\n### Example usage\n\n    printf(\"%s%sHello world%s\\n\", CLR_BLUE, EFF_BOLD, EFF_RESET);\n",
+      "content": "I decided to make this blog as I always need to\nfind how to print coloured text, so this is my solution to it\n\n## C++\n\n### Code\n\n    #define ANSI_BEGIN \"\\x1B[\"\n\n    namespace AnsiColour {\n        const char *red = ANSI_BEGIN \"31m\";\n        const char *green = ANSI_BEGIN \"32m\";\n        const char *yellow = ANSI_BEGIN \"33m\";\n        const char *blue = ANSI_BEGIN \"34m\";\n        const char *magenta = ANSI_BEGIN \"35m\";\n        const char *cyan = ANSI_BEGIN \"36m\";\n        const char *white = ANSI_BEGIN \"37m\";\n    } // namespace AnsiColour\n\n    namespace AnsiEffect {\n        const char *bold = ANSI_BEGIN \"1m\";\n        const char *reset = ANSI_BEGIN \"0m\";\n        const char *underline = ANSI_BEGIN \"4m\";\n    } // namespace AnsiEffect\n\n### Example usage\n\n    std::cout << AnsiColour::blue << AnsiEffect::bold\n        << \"Hello world\" << AnsiEffect::reset << '\\n';\n\n## C\n\n### Code\n\n    #define ANSI_BEGIN \"\\x1B[\"\n\n    const char *CLR_RED = ANSI_BEGIN \"31m\";\n    const char *CLR_GREEN = ANSI_BEGIN \"32m\";\n    const char *CLR_YELLOW = ANSI_BEGIN \"33m\";\n    const char *CLR_BLUE = ANSI_BEGIN \"34m\";\n    const char *CLR_MAGENTA = ANSI_BEGIN \"35m\";\n    const char *CLR_CYAN = ANSI_BEGIN \"36m\";\n    const char *CLR_WHITE = ANSI_BEGIN \"37m\";\n\n    const char *EFF_BOLD = ANSI_BEGIN \"1m\";\n    const char *EFF_RESET = ANSI_BEGIN \"0m\";\n    const char *EFF_UNDERLINE = ANSI_BEGIN \"4m\";\n\n### Example usage\n\n    printf(\"%s%sHello world%s\\n\", CLR_BLUE, EFF_BOLD, EFF_RESET);",
      "keywords": [
        "colour",
        "C++",
@ -2174,7 +2174,8 @@
        "colors",
        "terminal"
      ],
-      "created": 1652041043.26174
+      "created": 1652041043.26174,
+      "edited": 1698513497.438135
    },
    "happy-pi-e--day": {
      "title": "happy pi(e) day",
--- a/content/critical.css
+++ b/content/critical.css
@ -1,9 +1,5 @@
 :root {
-    --bq-b: #ede9d3;
-
-    --bqw: 2px;
-
-    --a-f: #cdc4c4; /* #9e9b9b; */
+    --af: #cdc4c4;
 }

 *,
@ -14,7 +10,16 @@
    word-wrap: break-word;
 }

+h1 {
+    text-align: center;
+}
+
 html {
+    background-image: -o-radial-gradient(
+        circle,
+        rgba(249, 240, 194, 0.15) 1px,
+        transparent 1px
+    );
    background-image: radial-gradient(
        circle,
        rgba(249, 240, 194, 0.15) 1px,
@ -25,71 +30,68 @@ html {
 }

 body {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+    -ms-flex-direction: column;
+    flex-direction: column;
+
+    padding: 2em;
+
    margin: auto;
-    padding: 2rem;
    max-width: 1100px;
    min-height: 100vh;
    text-rendering: optimizeSpeed;
 }

-h1 {
-    text-align: center;
-    margin: 1em;
-    font-size: 2em;
-}
-
-li {
-    margin: 0.5em;
-}
-
-#info-bar {
-    text-align: center;
-}
-
-#post-content {
-    padding: 0.3em;
+main {
+    -webkit-box-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
    line-height: 1.4;
 }

-a {
-    text-decoration: none;
-    font-style: italic;
-    color: var(--a-f);
-}
-
-*[h] > a {
-    opacity: 0.3;
-    -webkit-transition: opacity 0.1s ease-in-out;
-    -o-transition: opacity 0.1s ease-in-out;
-    transition: opacity 0.1s ease-in-out;
-}
-
-nav img {
-    height: 1rem;
-}
-
-code:not(pre code),
-time {
-    border-radius: 2px;
-    padding: 0.2em;
+footer {
+    text-align: center;
+    -webkit-filter: brightness(75%);
+    filter: brightness(75%);
 }

 br {
    margin-bottom: 0.2em;
 }

-main {
-    height: 96.5vh;
-    display: flex;
-    flex-direction: column;
+hr {
+    margin-top: 1em;
 }

-footer {
+nav {
    text-align: center;
-    filter: brightness(75%);
-
-    display: flex;
-    flex-direction: column;
-    flex-grow: 2;
-    justify-content: flex-end;
+}
+
+#blist {
+    margin-left: 1em;
+}
+
+li {
+    margin-bottom: 0.3em;
+}
+
+a {
+    text-decoration: none;
+    font-style: italic;
+    color: var(--af);
+}
+
+nav img {
+    height: 1em;
+}
+
+code:not(pre code),
+time,
+pre {
+    border-radius: 2px;
+    padding: 0.2em;
 }
--- a/content/post_critical.css
+++ b/content/post_critical.css
@ -1,3 +1,21 @@
+:root {
+    --qw: 2px;
+    --qb: #ede9d3;
+    --qf: #e6e0c8;
+}
+
+pre {
+    padding: 1em;
+    overflow-y: auto;
+}
+
+*[h] > a {
+    opacity: 0.3;
+    -webkit-transition: opacity 0.1s ease-in-out;
+    -o-transition: opacity 0.1s ease-in-out;
+    transition: opacity 0.1s ease-in-out;
+}
+
 blockquote {
    margin: 10px 0;
    overflow: hidden;
@ -6,24 +24,16 @@ blockquote {
    position: relative;
 }

+blockquote,
+blockquote * {
+    color: var(--qf);
+}
+
 blockquote:before {
    content: "";
-    border-left: var(--bqw) solid var(--bq-b); /* Thx cel */
+    border-left: var(--qw) solid var(--qb);
    position: absolute;
    bottom: 14px;
    top: 13px;
    left: 0;
 }
-
-pre {
-    padding: 1em;
-    border-radius: 4px;
-}
-
-pre,
-pre code {
-    overflow-x: auto !important;
-
-    scrollbar-width: initial;
-    -ms-overflow-style: initial;
-}
--- a/content/styles.css
+++ b/content/styles.css
@ -1,13 +1,9 @@
@import url(/content/fonts/Hack.min.css);

 :root {
-    --bq-f: #e6e0c8;
-
-    --cd-b: #1f1b1a;
-    --cd-f: #f0f3e6;
-    --cd-bd: #181414;
-
-    --scrlh: 6px; /* TODO Firefox */
+    --cf: #f0f3e6;
+    --cb: #1f1b1a;
+    --s: 6px;
 }

 *,
@ -16,10 +12,7 @@
    font-family: Hack, hack, monospace;

    scrollbar-width: none;
-    -ms-overflow-style: none;
-
-    scrollbar-color: var(--cd-bd) transparent;
-
+    scrollbar-color: var(--cb) transparent;
    scroll-behavior: smooth;

    outline-offset: 3px;
@ -27,7 +20,7 @@

 ::-webkit-scrollbar,
 ::-webkit-scrollbar-thumb {
-    height: var(--scrlh);
+    height: var(--s);
 }

 ::-webkit-scrollbar {
@ -35,7 +28,7 @@
 }

 ::-webkit-scrollbar-thumb {
-    background-color: var(--cd-bd);
+    background-color: var(--cb);
 }

 html::-webkit-scrollbar,
@ -48,25 +41,11 @@ a:hover {
    text-decoration: underline;
 }

-pre,
-pre * {
-    background-color: var(--cd-b);
-}
-
-pre,
-pre *,
-code {
-    color: var(--cd-f);
-}
-
-code:not(pre code),
-time {
-    background-color: var(--cd-b);
-}
-
-blockquote,
-blockquote * {
-    color: var(--bq-f);
+code,
+time,
+pre {
+    color: var(--cf);
+    background-color: var(--cb);
 }

 *[h]:hover > a,
@ -81,9 +60,9 @@ blockquote * {

@media only screen and (max-width: 1200px) {
    *[h] > a,
-    *[h]:hover > a,
-    *[h]:focus > a {
-        opacity: 1;
+    *[h] > a:hover,
+    *[h] > a:focus {
+        opacity: 1 !important;
    }
 }

@ -110,28 +89,17 @@ blockquote * {
        --b: #000;
        --f: #fff;

-        --bq-f: #ededed;
-        --bq-b: #868e91;
+        --cf: #f0f0f0;
+        --cb: #090909;

-        --cd-b: #090909;
-        --cd-f: #f0f0f0;
+        --qf: #ededed;
+        --qb: #868e91;

-        --a-f: #a9c4d1;
+        --af: #a9c4d1;

-        --bqw: 4px;
+        --bw: 4px;

-        --scrlh: initial; /* TODO: Firefox */
-    }
-
-    html::-webkit-scrollbar {
-        display: initial !important;
-    }
-
-    *,
-    *::before,
-    *::after {
-        scrollbar-width: initial !important;
-        -ms-overflow-style: initial !important;
+        --s: initial;
    }

    a {
--- a/scripts/blog.py
+++ b/scripts/blog.py
@ -215,7 +215,6 @@ POST_TEMPLATE: typing.Final[str] = (
 </head>

 <body>
-<main id="post-content">
 <header role="group">
  <h1 role="heading" aria-level="1">{post_title}</h1>

@ -253,9 +252,10 @@ POST_TEMPLATE: typing.Final[str] = (
    <hr aria-hidden="true" role="seperator" />
  </nav>
 </header>
+<main>
 <article id="main">{post_content}</article>
- <footer><p>{author} &lt;<a href="mailto:{email}">{email}</a>&gt; + {license}</p></footer>
 </main>
+ <footer><p>{author} &lt;<a href="mailto:{email}">{email}</a>&gt; + {license}</p></footer>
 </body>
 </html>"""
 )
@ -269,7 +269,6 @@ INDEX_TEMPLATE: typing.Final[str] = (
 </head>

 <body>
-<main id="post-content">
 <header role="group">
  <h1 role="heading" aria-level="1">{blog_header}</h1>

@ -301,9 +300,10 @@ INDEX_TEMPLATE: typing.Final[str] = (
    <hr aria-hidden="true" role="seperator" />
  </nav>
 </header>
- <article id="main"><ol reversed>{blog_list}</ol></article>
- <footer><p>{author} &lt;<a href="mailto:{email}">{email}</a>&gt; + {license}</p></footer>
+<main>
+ <article id="main"><ol reversed id=blist>{blog_list}</ol></article>
 </main>
+ <footer><p>{author} &lt;<a href="mailto:{email}">{email}</a>&gt; + {license}</p></footer>
 </body>
 </html>"""
 )