commit a29cb5a080709f90075ac524816cf5855f2140f2
parent 829dd1f1ec9ec6da50fd2c8e24dd7e99f9bfd264
Author: mjkloeckner <martin.cachari@gmail.com>
Date: Fri, 21 Oct 2022 18:51:20 -0300
Blog update and css files cleanup
Since github repository is showing that the principal language is css I
decided to make css files smaller by cleaning old lines.
Build scripts gets updated too, since they wheren't working properly, in
particular, scripts/sync.sh was not generating blog_index.shtml properly
and in consecuence latest_uploads.shtml
Diffstat:
7 files changed, 67 insertions(+), 365 deletions(-)
diff --git a/common/blog_index.shtml b/common/blog_index.shtml
@@ -1,5 +1,5 @@
-<li><time></time> <a href="/md/testing-syntax-highlight/testing-syntax-highlight"></a></li>
-<li><time></time> <a href="/md/nerdearla-2022/nerdearla-2022"></a></li>
-<li><time></time> <a href="/md/sav/sav"></a></li>
-<li><time></time> <a href="/md/dwm-config/dwm-config"></a></li>
-<li><time></time> <a href="/md/vim-config/vim-config"></a></li>
+<li><time>21-Oct-2022</time> <a href="/blog/testing-syntax-highlight/testing-syntax-highlight.html">Testing code syntax highlight</a></li>
+<li><time>23-Sep-2022</time> <a href="/blog/nerdearla-2022/nerdearla-2022.html">I'm going to Nerdearla 2022</a></li>
+<li><time>18-Sep-2022</time> <a href="/blog/sav/sav.html">Sorting Algorithms Visualized with SDL2</a></li>
+<li><time>23-Oct-2021</time> <a href="/blog/dwm-config/dwm-config.html">dwm - A tiling window manager configuration</a></li>
+<li><time>04-Mar-2021</time> <a href="/blog/vim-config/vim-config.html">vim - The keyboard driven text editor</a></li>
diff --git a/common/latest_uploads.shtml b/common/latest_uploads.shtml
@@ -1,5 +1,5 @@
-<li><time></time> <a href="/md/testing-syntax-highlight/testing-syntax-highlight"></a></li>
-<li><time></time> <a href="/md/nerdearla-2022/nerdearla-2022"></a></li>
-<li><time></time> <a href="/md/sav/sav"></a></li>
-<li><time></time> <a href="/md/dwm-config/dwm-config"></a></li>
-<li><time></time> <a href="/md/vim-config/vim-config"></a></li>
+<li><time>21-Oct-2022</time> <a href="/blog/testing-syntax-highlight/testing-syntax-highlight.html">Testing code syntax highlight</a></li>
+<li><time>23-Sep-2022</time> <a href="/blog/nerdearla-2022/nerdearla-2022.html">I'm going to Nerdearla 2022</a></li>
+<li><time>18-Sep-2022</time> <a href="/blog/sav/sav.html">Sorting Algorithms Visualized with SDL2</a></li>
+<li><time>23-Oct-2021</time> <a href="/blog/dwm-config/dwm-config.html">dwm - A tiling window manager configuration</a></li>
+<li><time>04-Mar-2021</time> <a href="/blog/vim-config/vim-config.html">vim - The keyboard driven text editor</a></li>
diff --git a/css/about_style.css b/css/about_style.css
@@ -1,13 +1,3 @@
-#article-title {
- font-size: 16px;
- text-decoration: underline;
- padding-bottom: 1em;
-}
-
-#article-screenshot {
- text-align: center;
-}
-
p {
padding-bottom: .5em;
}
@@ -17,29 +7,6 @@ ul {
padding-bottom: 1em;
}
-.article_bottom_bar {
- border: 0;
- clear:both;
-
- display:block;
-
- background-color: #191919;
-
- width: 60%;
- max-width: 20em;
- height: 0px;
-
- margin-left: auto;
- margin-right: auto;
- margin-top: 2em;
- margin-bottom: 0;
-
- padding-top: 0;
- padding-bottom: 0;
- /*! border-bottom: dashed; */
- border-top: 1px dashed peru;
-}
-
@media (max-width: 800px) {
.article_bottom_bar{
width: 45%;
@@ -70,27 +37,6 @@ ul {
box-shadow: 1px 1px 5px black;
}
-.skills_logos {
- display: flex;
- justify-content: center;
- align-items: center;
- /* padding: 1em; */
-}
-
-.skills_logo {
- max-width: 5em;
- padding: 1em;
-}
-
-.linux_logo {
- max-width: 5em;
- padding: 1em;
-}
-
-#skills_heading {
- text-align: center;
-}
-
@media (prefers-color-scheme: light) {
.article_bottom_bar {
border-top: 1px dashed white;
diff --git a/css/article_style.css b/css/article_style.css
@@ -38,25 +38,11 @@ img {
align-items: center;
}
-h2 {
- padding-bottom: 1em;
-}
-
-h3 {
- font-size: 1.15em;
-}
-
-h4 {
- padding-bottom: .5em;
-}
-
-p {
- padding-bottom: 1em;
-}
-
-em {
- font-weight: bold;
-}
+h2 { padding-bottom: 1em; }
+h3 { font-size: 1.15em; }
+h4 { padding-bottom: .5em; }
+p { padding-bottom: 1em; }
+em { font-weight: bold; }
ul {
margin-left: 1.5em;
@@ -110,9 +96,7 @@ ul {
border: 0 !important;
}
-.pln {
- color: #ebdbb2;
-}
+.pln { color: #ebdbb2; }
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
@@ -127,77 +111,7 @@ li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 {
list-style-type: decimal;
}
-@media screen {
- /* string content */
- .str {
- color: #98971a;
- }
-
- /* keyword */
- .kwd {
- color: #f60;
- }
-
- /* comment */
- .com {
- color: #928374;
- }
-
- /* type name */
- .typ {
- color: #458588;
- }
-
- /* literal value */
- .lit {
- color: #458;
- }
-
- /* punctuation */
- .pun {
- color: #ebdbb2;
- }
-
- /* lisp open bracket */
- .opn {
- color: #ebdbb2;
- }
-
- /* lisp close bracket */
- .clo {
- color: #ebdbb2;
- }
-
- /* markup tag name */
- .tag {
- color: #ebdbb2;
- }
-
- /* markup attribute name */
- .atn {
- color: #9c9;
- }
-
- /* markup attribute value */
- .atv {
- color: #6f0;
- }
-
- /* declaration */
- .dec {
- color: #ebdbb2;
- }
-
- /* variable name */
- .var {
- color: #ebdbb2;
- }
-
- /* function name */
- .fun {
- color: #458588;
- }
-}
+@media screen { /* string content */ .str { color: #98971a; } /* keyword */ .kwd { color: #f60; } /* comment */ .com { color: #928374; } /* type name */ .typ { color: #458588; } /* literal value */ .lit { color: #458; } /* punctuation */ .pun { color: #ebdbb2; } /* lisp open bracket */ .opn { color: #ebdbb2; } /* lisp close bracket */ .clo { color: #ebdbb2; } /* markup tag name */ .tag { color: #ebdbb2; } /* markup attribute name */ .atn { color: #9c9; } /* markup attribute value */ .atv { color: #6f0; } /* declaration */ .dec { color: #ebdbb2; } /* variable name */ .var { color: #ebdbb2; } /* function name */ .fun { color: #458588; } }
@media (prefers-color-scheme: light) {
/*! Color themes for Google Code Prettify | MIT License | github.com/jmblog/color-themes-for-google-code-prettify */
@@ -207,117 +121,10 @@ li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 {
border: 0 !important;
}
-.pln {
- color: #333;
-}
+.pln { color: #333; }
/* Specify class=linenums on a pre to get line numbering */
-ol.linenums {
- margin-top: 0;
- margin-bottom: 0;
- color: #cccccc;
-}
-
-li.L0,
-li.L1,
-li.L2,
-li.L3,
-li.L4,
-li.L5,
-li.L6,
-li.L7,
-li.L8,
-li.L9 {
- padding-left: 1em;
- background-color: #fff;
- list-style-type: decimal;
-}
-
-@media screen {
-
- /* string content */
-
- .str {
- color: #d14;
- }
-
- /* keyword */
-
- .kwd {
- color: #333;
- }
-
- /* comment */
-
- .com {
- color: #998;
- }
-
- /* type name */
-
- .typ {
- color: #458;
- }
-
- /* literal value */
-
- .lit {
- color: #458;
- }
-
- /* punctuation */
+ol.linenums { margin-top: 0; margin-bottom: 0; color: #cccccc; }
+li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 { padding-left: 1em; background-color: #fff; list-style-type: decimal; }
- .pun {
- color: #333;
- }
-
- /* lisp open bracket */
-
- .opn {
- color: #333;
- }
-
- /* lisp close bracket */
-
- .clo {
- color: #333;
- }
-
- /* markup tag name */
-
- .tag {
- color: #000080;
- }
-
- /* markup attribute name */
-
- .atn {
- color: #008080;
- }
-
- /* markup attribute value */
-
- .atv {
- color: #d14;
- }
-
- /* declaration */
-
- .dec {
- color: #333;
- }
-
- /* variable name */
-
- .var {
- color: #008080;
- }
-
- /* function name */
-
- .fun {
- color: #900;
- }
-}
-
-}
+@media screen { /* string content */ .str { color: #d14; } /* keyword */ .kwd { color: #333; } /* comment */ .com { color: #998; } /* type name */ .typ { color: #458; } /* literal value */ .lit { color: #458; } /* punctuation */ .pun { color: #333; } /* lisp open bracket */ .opn { color: #333; } /* lisp close bracket */ .clo { color: #333; } /* markup tag name */ .tag { color: #000080; } /* markup attribute name */ .atn { color: #008080; } /* markup attribute value */ .atv { color: #d14; } /* declaration */ .dec { color: #333; } /* variable name */ .var { color: #008080; } /* function name */ .fun { color: #900; } } }
diff --git a/css/style.css b/css/style.css
@@ -10,19 +10,6 @@
url('/fonts/Futura/FuturaBT-Medium.ttf'); /* IE9 Compat Modes */
}
-/* @font-face { */
-/* font-family: 'Ubuntu Mono'; */
-/* src: local('Ubuntu Mono'), */
-/* local('UbuntuMono-Regular'), */
-/* local('UbuntuMono'), */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.woff2') format('woff2'), /1* Modern Browsers *1/ */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.woff') format('woff'), /1* Modern Browsers *1/ */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf') format('truetype'), /1* Safari, Android, iOS *1/ */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.svg#svgUbuntuMono') format('svg'), /1* Legacy iOS *1/ */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.eot?#iefix') format('embedded-opentype'), /1* IE6-IE8 *1/ */
-/* url('/fonts/UbuntuMono/UbuntuMono-Regular.ttf'); /1* IE9 Compat Modes *1/ */
-/* } */
-
/* latin only */
@font-face {
font-family: 'Ubuntu Mono';
@@ -309,9 +296,7 @@ ul {
padding-bottom: 1em;
}
-h1 {
- font-size: 1.5em;
-}
+h1 { font-size: 1.5em; }
h2 {
font-size: 1.25em;
@@ -328,10 +313,7 @@ h3 {
padding-bottom: .5em;
}
-h4 {
- padding-top: .5em;
- text-align: left;
-}
+h4 { padding-top: .5em; text-align: left; }
h5 {
/* padding-top: .5em; */
@@ -339,59 +321,38 @@ h5 {
font-size: 1em;
}
-p {
- padding-bottom: 1em;
-}
-
+p { padding-bottom: 1em; }
code {
+ font-size: 1em;
+ font-family: "Ubuntu Mono", monospace;
+}
+
+pre {
text-align: left;
padding-top: .5em;
padding-bottom: .5em;
- padding-left: .75em;
- padding-right: .75em;
-
+ padding-left: .75em;
+ padding-right: .75em;
border-radius: .2em;
-
- /* background-color: #03230c; */
- /* background-color: #333333; */
background-color: #111111;
-
width: auto;
-
display: block;
-
margin-left: auto;
margin-right: auto;
margin-top: .25em;
margin-bottom: 1.25em;
-
- /* max-width: 23em; */
border-width: thin;
border-color: antiquewhite;
border-style: dashed;
-
- box-shadow: 5px 5px 7px black;
-
- overflow: auto;
-
- font-size: 1em;
- font-family: "Ubuntu Mono", monospace;
-}
-
-#command {
- /* color: green; */
- color: #33ff11;
-}
-
-#command_sym {
- color: #ff1694;
+ box-shadow: 5px 5px 7px black;
+ overflow: auto;
}
-#command_red {
- color: gold;
-}
+#command { color: #33ff11; }
+#command_sym { color: #ff1694; }
+#command_red { color: gold; }
a.anchor{
display:block;
@@ -477,15 +438,10 @@ time {
margin-top: 0;
box-shadow: 0px 0px 0px;
}
- #command {
- color: inherit;
- }
- #command_sym {
- color: inherit;
- }
- #command_red {
- color: inherit;
- }
+ #command { color: inherit; }
+ #command_sym { color: inherit; }
+ #command_red { color: inherit; }
+
#go_top:hover {
color: #CC2936;
}
@@ -496,4 +452,3 @@ time {
background: white;
}
}
-
diff --git a/md/vim-config/vim-config.md b/md/vim-config/vim-config.md
@@ -7,35 +7,26 @@
If we think for a moment about software we are going to realize that the
core of every program is just plain text, literally, just words in a
-file that someone wrote, this webpage it's just text interpreted by
-your web-browser, whose also just plain text implemented by another
-program, some software has more complexity than others, for example the
-linux kernel it's estimated that has around 27.8 million lines of code,
-which is also just plain text.
+file that someone wrote, this webpage is just text interpreted by
+your web-browser, whose also just plain text.
The way we tell computers what to do is with text, so in order to
write that text we need a set of basic tools, one of which is a text editor,
-and this is were Vim it's known for. Vim is just a text editor.
-The term Vim stands for Vi IMproved, Vim is a rewrite and improved version of Vi,
-a text editor that dates from 1978.
+and this is were Vim is known for.
-In this article I want to show how this text editor became my best
-frient (?), why I learned to love about Vim keybindings and now I even have
-and extension on my browser to use vim like keybindings.
-
-Vim is a console text editor (altough you can find distributions like
-gvim, which comes with a gui), a benefit of this is that, It's very
-lightweign in terms of system resources.
-
-If you installed Vim and you don't know how to move around or insert
-text, first you need to understand the basics, Vim has 3 main "modes"
+Vim is just a console text editor, \`console\` because vim can only be executed from
+the commandline (altough you can find distributions like gvim, which has it's own window),
+a benefit of this is that, it's very lightweight in terms of system resources.
+The term Vim stands for Vi IMproved, Vim is a rewrite and improved version of Vi, a
+console text editor that dates from 1978, it's very similar to vim but with less
+features.
If you installed Vim and you don't know how to move around or insert
text, I'm only going to tell two things, first, how to exit, press esc
a couple of times and also Ctrl+C, just to make sure that you are on normal mode,
-then type \`:wq\` and press enter. I'm also going to tell you how to
-run vim tutor, which is a good tutorial included with vim which teaches you
-how to use vim in an interactive way.
+then type \`:wq!\` and press enter. I'm also going to tell you how to
+run vim tutor, just execute \`vimtutor\` from the commandline. Vim tutor is a
+very good tutorial included with vim, it teaches you how to use vim in an interactive way.
## Vim configuration
@@ -61,21 +52,21 @@ set mouse+=a
By default Vim comes with a lot of features missing, for example, a key
binding to comment a line, or auto close brackets, parenthesis, etc, this
-features you can enable them by installing *plugins*. Vim pluggins are
+features you can enable them by installing *plugins*. Vim plugins are
like strips of other's config files that you can include in yours.
-The simpler way of managing pluggins is with a pluggin manager, I use
+The simpler way of managing plugins is with a plugin manager, I use
[vim-plug](https://github.com/junegunn/vim-plug).
-### Installing a pluggin
+### Installing a plugin
-First install vim-plug or any other vim plugging manager, for vim-plug enter
-the link I left you above, and follow the instructions. For any other plugging manger
+First install vim-plug or any other vim plugin manager, for vim-plug enter
+the link I left you above, and follow the instructions. For any other plugin manger
I think would be similar.
-After you got a pluggin manager installed simply call the plugins that you want from
+After you got a plugin manager installed simply call the plugins that you want from
you .vimrc file, for example I'm using vim-plug and the section
-where I call the pluggins in my .vimrc file looks like this:
+where I call the plugins in my .vimrc file looks like this:
```vim
Plug 'christoomey/vim-tmux-navigator'
diff --git a/scripts/sync.sh b/scripts/sync.sh
@@ -2,6 +2,7 @@
root_folder="/home/mk/soydev/webp/kloeckner.com.ar"
blog_folder="md"
+html_folder="blog"
blog_index_file="common/blog_index.shtml"
latest_uploads_file="common/latest_uploads.shtml"
rss_feed_file=$root_folder/"rss.xml" # RSS feed file
@@ -15,11 +16,11 @@ generate_blog_index() {
# for i in $(eval $root_folder/scritps/sort_blog_index.py $root_folder/$blog_folder); do
for i in ${blog_folders[@]}; do
- article_date=$(cat $i | grep -oP '(?<=<meta name="article-date" content=")(.*?)(?=")')
- article_title=$(cat $i | grep -oP '(?<=<meta name="article-title" content=")(.*?)(?=")')
+ article_date=$(cat $i | grep -oP '(?<=% date: \")(.*?)(?=\")')
+ article_title=$(cat $i | grep -oP '(?<=% title: \")(.*?)(?=\")')
file_name=$(echo "$i" | grep -oE '[^/]*$' | cut -d '.' -f 1)
- printf "<li><time>%s</time> <a href=\"/$blog_folder/$file_name/$file_name\">%s</a></li>\n" \
+ printf "<li><time>%s</time> <a href=\"/$html_folder/$file_name/$file_name.html\">%s</a></li>\n" \
"${article_date}" "${article_title}" >> $root_folder/$blog_index_file
done
}
@@ -37,8 +38,10 @@ generate_rss_feed() {
printf "<lastBuildDate>%s</lastBuildDate>\n" "$(date)" >> $rss_feed_file
for i in ${blog_folders[@]}; do
- article_date=$(cat $i | grep -oP '(?<=<meta name="article-date" content=")(.*?)(?=")')
- article_title=$(cat $i | grep -oP '(?<=<meta name="article-title" content=")(.*?)(?=")')
+ # article_date=$(cat $i | grep -oP '(?<=<meta name="article-date" content=")(.*?)(?=")')
+ # article_title=$(cat $i | grep -oP '(?<=<meta name="article-title" content=")(.*?)(?=")')
+ article_date=$(cat $i | grep -oP '(?<=% date: \")(.*?)(?=\")')
+ article_title=$(cat $i | grep -oP '(?<=% title: \")(.*?)(?=\")')
file_name=$(echo "$i" | grep -oE '[^/]*$' | cut -d '.' -f 1)
article_description="$(md2html $root_folder/md/$file_name/$file_name.md |\
