diff --git a/_assets/core.scss b/_assets/core.scss index 5837483..2b7533e 100644 --- a/_assets/core.scss +++ b/_assets/core.scss @@ -10,12 +10,6 @@ #}; --- -@font-face { - font-style: normal; - font-weight: normal; - font-family: 'HiLo-DecoRegular'; - src: url('{{ site.baseurl }}/assets/fonts/HiLo-Deco.ttf'); -}; @import 'main'; @import 'syntax'; diff --git a/_assets/fonts/HiLo-Deco.ttf b/_assets/fonts/HiLo-Deco.ttf deleted file mode 100644 index 21a8ca9..0000000 Binary files a/_assets/fonts/HiLo-Deco.ttf and /dev/null differ diff --git a/_assets/rodentia-icons_application-x-feed.svg b/_assets/rodentia-icons_application-x-feed.svg deleted file mode 100644 index 3e13158..0000000 --- a/_assets/rodentia-icons_application-x-feed.svg +++ /dev/null @@ -1,201 +0,0 @@ - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/_config.yml b/_config.yml index 6064fe9..253a11d 100644 --- a/_config.yml +++ b/_config.yml @@ -5,8 +5,6 @@ description: "A blog about libre software experiences and everything else # Author Info author_name: "Franco Masotti" author_email: franco.masotti@student.unife.it -github_username: frnmst -avatar_path: avatar.jpg # Site Settings baseurl: "" # Base URL must end WITHOUT a slash, default: "" @@ -36,6 +34,9 @@ excerpt_enabled: true excerpt_separator: "" excerpt_words: 20 +# Tags +min_tag_score: 2 + # Meta tag options meta_description_words: 140 meta_excerpt_words: 140 diff --git a/_includes/comments.html b/_includes/comments.html index 7dc11b0..5d79f19 100644 --- a/_includes/comments.html +++ b/_includes/comments.html @@ -1,10 +1,4 @@ -
- -
-
-
-

Comments

- +
{% capture mail %}{{ site.author_email }}{% endcapture %} {% assign mail_substring = mail | split: '@' %} {% assign mail_username = mail_substring[0] %} @@ -14,54 +8,39 @@ {% else %} {% capture mailto_prefix %}{{ mail_username }}+{{ page.path | remove: ".html" | remove: ".md" | remove: "_pages/" }}{% endcapture %} {% endif %} - - - {% for comment in site.comments %} + +
+ {% assign comment_counter = 0 %} + {% assign comments = site.comments | sort | reverse %} + {% for comment in comments %} {% assign page_path = page.path | replace: "_posts/", "" | remove: ".md" %} {% assign comment_fullpath = comment.path | replace: "_comments/", "" | split: "/" %} {% assign comment_path = comment_fullpath[0] %} {% assign comment_id = comment_fullpath[1] | remove: ".md" %} - {% if comment_path == page_path %} - {% if forloop.first %} -
- {% endif %} - -
- - - - {% comment %} - - {% endcomment %} - - - - - - - - - - -
Subject{{ comment.subject }}
From{{ comment.from }}
Date{{ comment.date | date: "%c, %:z GMT" }}
-
- - {{ comment.content | markdownify }} - {% comment %} - - {% endcomment %} - {% if forloop.last == false %} -
+ {% assign parity_check = comment_counter | modulo: 2 %} + {% if parity_check == 0 %} + {% assign parity = "even" %} + {% else %} + {% assign parity = "odd" %} {% endif %} - {% endif %} - {% endfor %} + +
+
{{ comment.from }}
+
{{ comment.date | date: "%b %e %Y, %R %Z" }}
+
+

{{ comment.subject }}

+ {{ comment.content | markdownify }}
-
+ + {% assign comment_counter = comment_counter | plus: 1 %} + {% endif %} +{% endfor %} +
diff --git a/_includes/footer.html b/_includes/footer.html index 82b5e66..f3bdf20 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -1,29 +1,14 @@ - - diff --git a/_includes/head.html b/_includes/head.html index a238518..ecc01db 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -1,4 +1,4 @@ -{% comment %}{% endcomment %} +{% comment %}{% endcomment %} @@ -9,8 +9,7 @@ {{ site.title }} {% endif %} - + diff --git a/_includes/header.html b/_includes/header.html index dde17d5..5b700ca 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -1,22 +1,17 @@ -
- skip to main content - {% if page.url != '/sitemap/' %} - sitemap - {% endif %} +
+
- diff --git a/_includes/image.html b/_includes/image.html index bcb2b75..512ed15 100644 --- a/_includes/image.html +++ b/_includes/image.html @@ -5,14 +5,16 @@ {% endif %} {% if include.caption %} -
- - {% if include.alt %}{{ include.alt }}{% else %}Image{% endif %} - - {{ include.caption }} -
+
+ + {% if include.alt %}{{ include.alt }}{% else %}Image{% endif %} +
{{ include.caption }}
+
+
{% else %} - +
+ {% if include.alt %}{{ include.alt }}{% else %}Image{% endif %} +
{% endif %} diff --git a/_includes/page_navigation.html b/_includes/page_navigation.html index 90e32b6..4e0cb82 100644 --- a/_includes/page_navigation.html +++ b/_includes/page_navigation.html @@ -1,8 +1,12 @@ diff --git a/_includes/post_navigation.html b/_includes/post_navigation.html index 4dcb313..e4b92cf 100644 --- a/_includes/post_navigation.html +++ b/_includes/post_navigation.html @@ -1,17 +1,29 @@ + diff --git a/_includes/tag_list.html b/_includes/tag_list.html index dbcc708..3c4623a 100644 --- a/_includes/tag_list.html +++ b/_includes/tag_list.html @@ -1,19 +1,46 @@ -{% assign site_tags = site.tags | sort %} +{% comment %} This is pure madness: an O(n^2) loop is not acceptable but +there is no other solution I am aware of using this templating +language. Using uniq to filter different frequencies should +lead to a better best case (if all frequencies are equal +we get O(n) with n being the number of tags, otherwise +if all freqencies are different we get O(n^2) {% endcomment %} -{% comment %} - -{% endcomment %} +{% comment %} Get all unique tags {% endcomment %} +{% for t in site.tags %} + {% assign tag_frequency = tag_frequency | append: t[1].size | append: '#' %} +{% endfor %} + +{% assign tag_frequency = tag_frequency | split: '#' %} +{% assign tag_frequency_iterator = tag_frequency | sort | reverse %} +{% assign tag_frequency = tag_frequency_iterator | uniq %} -
-
-{% for tag in site_tags %} - {% assign tagg = tag[0] | slugify %} - {% if page.is_home %} - {% capture link %}{{ site.baseurl }}/tags/#{{ tagg }}{% endcapture %} - {{ tag[0] }}  - {% else %} - {{ tag[0] }}  - {% endif %} +{% for f in tag_frequency %} + {% comment %} Nice: srt to int: {% endcomment %} + {% assign freq = f | plus: 0 %} + {% for t in site.tags %} + {% if freq == t[1].size %} + {% assign sorted_tags_by_freq = sorted_tags_by_freq | append: t[0] | append: '#' %} + {% endif %} + {% endfor %} {% endfor %} -
-
+ +{% assign sorted_tags_by_freq = sorted_tags_by_freq | split: '#' %} + +
+ +
diff --git a/_layouts/default.html b/_layouts/default.html index 1520fba..41d6ae7 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -2,7 +2,7 @@ layout: compress --- - + {% include head.html %} @@ -10,14 +10,17 @@ layout: compress {% include header.html %} - {% if page.is_home %} + {% if page.is_home or page.is_tags %} {% include tag_list.html %} {% endif %} -
- {{ content | replace: '↩', '↩︎' }} -
- {% comment %}{% endcomment %} + {% if page.is_post != true %} +
+ {% endif %} + + {{ content | replace: '↩', '↩︎' }} + + {% comment %}Can't use == false since page.is_home might be undefined{% endcomment %} {% if page.is_home != true and page.is_404 != true and page.is_tags != true and page.is_sitemap != true %} {% include comments.html %} {% endif %} diff --git a/_layouts/page.html b/_layouts/page.html index d364a33..8fc9f4f 100644 --- a/_layouts/page.html +++ b/_layouts/page.html @@ -2,18 +2,9 @@ layout: default --- -
+ -

{{ page.title }}

- -
- - {% if page.is_tags %} - {% include tag_list.html %} - {% endif %} - -
- {{ content }} - -
+{{ content }} diff --git a/_layouts/post.html b/_layouts/post.html index 4f0f6ee..e17d8b6 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -2,35 +2,30 @@ layout: default --- -
+{% if page.tags %} + {% assign page_tags = page.tags | sort %} +
+
    + {% for tag in page_tags %} +
  • + {% assign tagg = tag | slugify %} + {% capture link %}{{ site.baseurl }}/tags/#{{ tagg }}{% endcapture %} + {{ tag }}  +
  • + {% endfor %} +
+
+{% endif %} + -
-

{{ page.title }}

- - {% assign page_date = page.date | date: '%F' %} - {% assign page_updated = page.updated | date: '%F' %} - {% if page_date != page_updated %} -
-
- - {% endif %} - {% if page.tags %} -
-
- {% assign page_tags = page.tags | sort %} -
- {% for tag in page_tags %} - {% assign tagg = tag | slugify %} - {% capture link %}{{ site.baseurl }}/tags/#{{ tagg }}{% endcapture %} - {{ tag }}  - {% endfor %} -
- {% endif %} -
- -
-
- - {{ content }} - -
+
+{{ content }} +
diff --git a/_pages/about.md b/_pages/about.md index f3025c9..85ae932 100644 --- a/_pages/about.md +++ b/_pages/about.md @@ -4,61 +4,10 @@ title: About permalink: /about/ --- -## Presentation +Hello. -Hello web world. +The main purpose of this theme is to be as simple as it could be, so you can focus on writing your stuffs. This is your About page. You may describe about yourself here; who you are, what are you currently doing, share some of your projects, your social links and how people can contact you, etc. -This blog tells my experiences with software, computing, "hacks", -hardware, technology and whatever comes to my mind I want to share. - -Usually, when I talk about software I mean -[free software](https://www.gnu.org/philosophy/free-sw.en.html). This means -that most probably I won't talk about proprietary software and operating -systems like Windows, MacOs, etc... but only about GNU/Linux, GNU/Linux-libre -distributions or whatever fully free computing environments will come up. Who -knows what the future will hold us... - -At the moment I am a proud [Parabola GNU/Linux-libre](https://parabola.nu) -user running a very lightweight desktop environment like -[spectrwm](http://www.spectrwm.org) after going through years of -[OpenBox](http://openbox.org). I use [Replicant](http://www.replicant.us/) for -the mobile phone. - -I hope that this turns out to be a useful blog for anyone that encouters -similar problems I have solved. +**Just write things that matter...** Enjoy! - -P.S: I also hope my use of english is correct. If that is not the case don't -hesitate to mail me. - -## Comment rules - -Every post (and some other pages like this one) contain a comment section which -is just a `mailto` link to my private mail containing an id to that post or -comment. You can just click or copy that link and send me an email. - -When you send me an email I will moderate it. By default I will report -verbatim: -- the subject -- the sending date -- your name, if present, or your email if you request so in the comment. If - none is available I will simply use `anonymous` in this field. -- the content which can be written in krmarkdown (the one used on GitHub and - GitLab) - -## Contacts - -You will find me on [GitHub](https://github.com/frnmst), -[GitLab](https://gitlab.com/frnmst), [GNU Social](https://quitter.no/frnmst), -[mail one](mailto://franco.masotti@student.unife.it), -[mail two](mailto://franco.masotti@live.com), -[Tox](tox:9D855839E4BB0ADBF4F49063BF2ABC1479A7728011F20B563EA104B2EE10FF19DC8C255D8F3D), -[XMPP](xmpp://franco.masotti@xabber.de) and other -less relevant web locations. - -You won't find me on Facebook, Whatsapp, Twitter, and similar. - -If you want to see another similar blog wich I co-autor have a -look at [Linux Difficile](https://linuxdifficile.wordpress.com/). - diff --git a/_pages/index.html b/_pages/index.html index beed87b..4733e76 100644 --- a/_pages/index.html +++ b/_pages/index.html @@ -3,39 +3,32 @@ layout: default permalink: index.html --- -
-
- {% for post in site.posts %} - {% unless post.next %} -

{{ post.date | date: '%Y' }} ~

- {% else %} - {% capture year %}{{ post.date | date: '%Y' }}{% endcapture %} - {% capture nyear %}{{ post.next.date | date: '%Y' }}{% endcapture %} - {% if year != nyear %} -

{{ post.date | date: '%Y' }} ~

- {% endif %} - {% endunless %} - - - - {% endfor %} - -
+
+ {% endif %} + + +{% endfor %} + diff --git a/_pages/sitemap.html b/_pages/sitemap.html index 59f8932..df9a704 100644 --- a/_pages/sitemap.html +++ b/_pages/sitemap.html @@ -16,12 +16,14 @@ permalink: /sitemap/ {% endfor %} -{% assign site_posts = site.posts | sort %} -

Posts

- +{% if site.posts %} + {% assign site_posts = site.posts | sort %} +

Posts

+ +{% endif %} diff --git a/_pages/tags.md b/_pages/tags.md index 012168e..dc470be 100644 --- a/_pages/tags.md +++ b/_pages/tags.md @@ -6,8 +6,6 @@ permalink: /tags/
-
- {% assign site_tags = site.tags | sort %} {% for tag in site_tags %} @@ -22,7 +20,5 @@ permalink: /tags/ {% endfor %} -
-
diff --git a/_sass/main.scss b/_sass/main.scss index e1268cc..fc55b57 100644 --- a/_sass/main.scss +++ b/_sass/main.scss @@ -1,485 +1,365 @@ -body { - background-color: #e6e6e6; - font-style: normal; - font-weight: 400; - font-size: 1.5em; - font-family: 'HiLo-DecoRegular'; - padding: 20px; - margin: 0; - -webkit-font-smoothing: antialiased; - -webkit-text-size-adjust: 100%; - @media (min-width: 992px) { - padding: 35px 50px; - } +/* For mobile phones */ +@media only screen and (max-width: 700px) { + body { + margin-left: 0.40625em; + margin-right: 0.40625em; + } + + .post { + pre { + font-size:0.8125em; + line-height: 2em; + + padding-left: 0.8125em; + padding-right: 0.8125em; + } + } } -h2, -h3, -h4, -h5 { - margin: 45px 0 25px; +/* For desktops */ +@media only screen and (min-width: 700px) { + body { + margin-left: 5%; + margin-right: 5%; + @media only screen and (max-width: 1375px) { + margin-left: 10%; + margin-right: 10%; + } + @media only screen and (min-width: 1920px) { + margin-left: 25%; + margin-right: 25%; + } + } + + .post { + pre { + font-size: 1.1375em; + line-height: 2em; + + padding-left: 1.625em; + padding-right: 1.625em; + } + } } -img { - max-width: 100%; +body { + text-align: left; + text-rendering: optimizeLegibility; + background-color: #dadada; + line-height: 1.625em; /* 16×1.625=26pt */ + font-family: "Arial Black", Gadget, sans-serif; + font-size: 1.080625em; + word-spacing: 0em; } -a { - outline: none; - color: inherit; - text-decoration: none; - border-bottom: 1px solid #555; - &.image { - display: block; - text-align: center; - border: 0; - border-radius: 5px; - margin: 30px 0; - } +a:hover { + transition: 0.3s; } -mark { - background: #fffc76; - padding: 0 5px; + +/* Use for abbreviations only. */ +abbr { + letter-spacing: 0.1em; } blockquote { - border-left: 5px solid #ccc; - margin: 40px 0; - padding: 5px 30px; - background: #eee; + font-size: 1.08625em; + line-height: 1.08625em; + font-family: "Comic Sans MS", cursive, serif; + background-color: #ffffff; + box-shadow: inset 0 0 0.40625em grey; + border-radius: 0.8125em; + padding-left: 1.625em; + padding-top: 0.8125em; + padding-bottom: 0.8125em; + margin: 0; } -.logo { - position: relative; - margin: 0 auto 35px; - text-align: center; - animation-duration: 0.7s; - animation-fill-mode: both; - animation-name: bounce; - -webkit-animation-duration: 0.7s; - -webkit-animation-fill-mode: both; - -webkit-animation-name: bounce; - a { - background: #e6e6e6 url("gravatar_wrapper.svg"); - text-decoration: none; - font-weight: 700; - height: 100px; - width: 100px; - font-size: 2.25em; - border-radius: 100%; - display: inline-block; - text-align: center; - line-height: 100px; - border: 5px solid #e6e6e6; - box-sizing: border-box; - -webkit-transition-duration: 0.8s; - transition-duration: 0.8s; - &:hover, - &:focus { - background: #f14e32; - } - &:hover + .logo-prompt, - &:focus + .logo-prompt { - display: inline-block !important; - } - .avatar { - margin-top: 5px; - -webkit-border-radius: 50%; - -moz-border-radius: 50%; - border-radius: 50%; - } - @media (max-width : 480px) {&:hover + .logo-prompt, - &:focus + .logo-prompt { - display: none !important; - } - } - } - .logo-prompt { - position: absolute; - display: none; - vertical-align: middle; - padding: 5px; - border-radius: 3px; - background: #666; - background: rgba(0,0,0,0.5); - margin-left: 15px; - color: #fff; - font-size: 1.23525em; +h1 { + line-height: 1.625em; + margin-top: 0.40625em; + margin-bottom: 0.40625em; +} + +h2 { + line-height: 1.263157em; + margin-top: 1.263157em; + margin-bottom: 1.263157em; +} + +p { + text-indent: 0; + line-height: 1.625em; + margin-top: 1.625em; + margin-bottom: 1.625em; +} + +a { + text-decoration: underline; + text-decoration-color: #d9d9d9; text-align: center; - line-height: 1.2; - top: 50%; - margin-top: -10px; - &:before { - content: ""; - border-width: 5px 5px 5px 0; - border-style: solid; - border-color: transparent #666; - border-color: transparent rgba(0,0,0,.5); - position: absolute; - top: 50%; - left: -5px; - margin-top: -5px; - } - } + color: #666666; } -iframe { - margin: 45px 0 !important; +a:hover { + text-decoration: underline; } ul { - list-style-type: circle; - margin: 40px 0; - padding-left: 50px; - li { - word-wrap: break-word; - } - img { - margin: 40px 0; - border-radius: 5px; - } + list-style-type: circle; } -ol { - margin: 40px 0; - padding-left: 50px; - li { - word-wrap: break-word; - } - img { - margin: 40px 0; - border-radius: 5px; - } +.post { + pre { + border: none; + border-radius: 1.625em; + box-shadow: inset 0 0 0.8125em grey; + background-color: #e6e6e6; + white-space: pre-wrap; + white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ + white-space: -pre-wrap; /* Opera 4-6 */ + white-space: -o-pre-wrap; /* Opera 7 */ + word-wrap: break-word; /* Internet Explorer 5.5+ */ + } } -sup { - vertical-align: top; - position: relative; - top: -0.5em; - margin-left: 1px; +.post-metadata, .page-metadata, .footer, .comment { + box-shadow: inset 0 0 0.40625em grey; + background-color: #ffffff; } -time { - color: #555; +.post-metadata, .page-metadata, .footer, .comment, .index .post-list-metadata { + border-radius: 1.625em; + padding-left: 1.625em; + padding-bottom: 0.40625em; } -code, -pre { - font-family: Consolas, monospace, x; +.post-metadata, .page-metadata, .footer, .comment, .comment-content, .index .post-list-metadata { + margin-bottom: 1.625em; } -code { - color: #f14e32; - background: #eee; - padding: 2px 6px; - font-size: 15.0px; +.page-metadata, .footer, .comment, .index .post-list-metadata { + padding-top: 0.40625em; } -pre { - display: block; - margin-top: 0; - margin-bottom: 1rem; - font-size: 1.6rem; - line-height: 1.4; - white-space: pre; - overflow-x: auto; - background-color: #f9f9f9; - border: 1px solid #ddd; - padding: 1rem; - code { - /* font-size: 100%; */ - color: inherit; - background-color: transparent; - padding: 0; - } +.post-metadata, .page-metadata, .footer, .comment, .index .post-list-metadata { + padding-right: 1.625em; } -table { - width: 100%; - table-layout: fixed; - margin: 45px 0; - thead { - background: #f2f2f2; - } - th { - text-align: left; - padding: 8px 10px; - border-bottom: 15px solid #fff; - } - td { - padding: 4px 0; - } + +.top, .page-navigation, .tag-list { + ul { + margin: 0; + padding: 0; + overflow: hidden; + } + + li { + display: block; + float: left; + } + + a { + text-decoration: none; + } } -iframe { - width: 100%; +.top, .page-navigation { + ul { + font-size: 0.8125em; + margin-bottom: 1.625em; + background-color: #666666; + border-radius: 0.8125em; + } + + li { + border-right: 0.05em solid #ffffff; + } + + a { + display: block; + color: #ffffff; + text-align: center; + padding: 0.8125em 0.8125em; + } + + li a:hover { + background-color: #000000; + } + + .rss { + border-left: 0.05em solid #ffffff; + border-right: none; + float:right + } } -article { - max-width: 500px; - margin: 0 auto; - .title { - line-height: 1.4em; - text-align: center; - } - .divider { - background: #ddd; - background: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(#ccc),to(rgba(255,255,255,0))); - background: -webkit-linear-gradient(left,rgba(255,255,255,0),#ccc,rgba(255,255,255,0)); - background: linear-gradient(to right,rgba(255,255,255,0),#ccc,rgba(255,255,255,0)); - height: 1px; - margin: 2em 0; - } - .center { - text-align: center; - margin: 0 auto; - } - hr { - border: 0; - border-bottom: 1px solid #000; - margin: 30px 0; - } - p { - font-size: 22.5px; - line-height: 1.9em; - word-wrap: break-word; - } - .comment { - font-size: 22.5px; - line-height: 1.9em; - word-wrap: break-word; - padding-top: 5px; - padding-bottom: 5px; - .comment-headers { - font-style: italic; - font-weight: bold; +.index { + .post-list-div { + margin-top: 0.8125em; + margin-bottom: 0.8125em; + } + + .post-list-date { + float: right; + } + + .post-list-excerpt { + font-family: serif; + font-size: 0.8125em; } - } - .tag-list { - font-size: 20px; - color: #555; + a { - -webkit-transition-duration: 0.4s; - transition-duration: 0.4s; - white-space: nowrap; text-decoration: none; - width: 30px; - height: 15px; - border-radius: 8px; + text-align: left; color: #000000; - border: none; - background-color: #d6d6d6; - text-align: center; } - a:hover { - background: #ffffff; - } - } - .footnote { - border: 0; - color: #0087BE; - } - .footnotes { - margin: 50px auto; - display: block; - p { - line-height: 1rem; - font-weight: normal; - } - ol { - margin: 0; - padding-left: 15px; - li { - font-weight: bold; - } + + .post-list-metadata { + background-color: #ffffff; + box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; } - .reversefootnote { - border: 0; - color: #0087BE; + + .post-list-metadata:hover { + background-color: #404040; + transition: 0.3s; + color: #ffffff; } - } } -.tag-posts { +.tag-list { + ul { + margin-top: 0em; + margin-bottom: 0.40625em; + } + + li { + margin-top: 0.203125em; + margin-bottom: 0.40625em; + } + a { - text-decoration: none; - border: none; + margin-top: 0em; + margin-left: 0.8125em; + padding: 0.40625em; + font-size: 0.8125em; + background-color: #ffffff; + border-radius: 0.8125em; } - color: #000000; -} -.back { - text-align: center; - a { - text-decoration: none; - margin: 40px auto 0; - display: inline-block; - padding: 10px; - border: 0; - &:before { - content: "<<"; - margin-right: 5px; - color: #000; - } - } + li a:hover { + background-color: #404040; + color: #ffffff; + } } -.page-navigation, -.footer { - text-align: center; - max-width: 500px; - margin: 0 auto; - font-size: 1.6rem; +.comment-content, .tag-list { + a { + box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; + } } -.page-navigation { - margin: 50px auto 0 auto; - a { - display: inline-block; - text-decoration: none; - border-bottom: none; - } - span { - display: inline-block; - } -} +.comment-content { + font-size: 0.8125em; -.footer { - margin-top: 50px; - color: #777; - a { - border: none; - font-weight: bold; - } - .block { - display: block; - .copyright { - img { - width: 80px; - height: auto; - } + a.odd { + background-color: #cccccc; } - .rss { - img { - width: 48px; - height: auto; - } + + a.even { + background-color: #e6e6e6; } - } -} -section { - max-width: 500px; - margin: 0 auto 50px auto; - ul { - list-style: none; - margin: 0; - padding: 0; - li { - margin: 25px 0; - .title { - max-width: 100%; - //overflow: hidden !important; - //text-overflow: ellipsis !important; - //white-space: nowrap !important; - word-wrap: normal !important; - } - a { + a:hover { + background-color: #f2f2f2; + } + + a { + display: block; + margin-top: 1.625em; text-decoration: none; - border: 0; - color: #000; - box-sizing: border-box; - } - .post-date { - float: right; - margin: 0 0 0 20px; - } - span { - display: inline-block; - color: #757575; - letter-spacing: 1px; - text-transform: uppercase; - } - .excerpt { - padding-top: 20.0px; + text-decoration-color: #000000; + text-align: left; + border-radius: 0.8125em; + color: #000000; + } + + .text { + padding: 0.8125em; + } + + .hr { + border: 0.1015625em inset #808080; + color: #ffffff; + } + + .from { + overflow: hidden; + } + + .date { font-style: italic; - font-size: 20.0px; - color: #555; - } - @media (min-width: 992px) {a { - border-bottom: 2px solid transparent; - &:hover { - border-color: #000; - } - } - } } - } } -.main { - font-size: 20px; - text-align: center; - margin-bottom: 30px; - margin-top: 15px; - a { - color: #000000; - background-color: #d6d6d6; - text-align: center; - -webkit-transition-duration: 0.4s; - transition-duration: 0.4s; - white-space: nowrap; - text-decoration: none; - width: 40px; - height: 15px; - border: none; - } - a:hover { - background: #ffffff; - } +.footer { + .license { + font-weight: bold; + } + + font-size: 0.8125em; } -@keyframes bounce {0% { - transform: translate3d( 0, -1000px, 0 ); - } - 60% { - transform: translate3d( 0, 25px, 0 ); - } - 75% { - transform: translate3d( 0, -10px, 0 ); - } - 90% { - transform: translate3d( 0, 5px, 0 ); - } - 100% { - transform: none; - } + +img { + max-width: 100%; + height: auto; + + /* Disable antialiasing when the picure is scaled. */ + -ms-interpolation-mode: nearest-neighbor; + image-rendering: -webkit-optimize-contrast; + image-rendering: -moz-crisp-edges; + image-rendering: pixelated; } -@-webkit-keyframes bounce {0% { - -webkit-transform: translate3d( 0, -1000px, 0 ); - } - 60% { - -webkit-transform: translate3d( 0, 25px, 0 ); - } - 75% { - -webkit-transform: translate3d( 0, -10px, 0 ); - } - 90% { - -webkit-transform: translate3d( 0, 5px, 0 ); - } - 100% { - -webkit-transform: none; - } +.img img, .figure { + box-shadow: 0 0.203125em 0.203125em 0 grey, 0 0.203125em 0.203125em 0 grey; + border-radius: 0.8125em; } +.img img:hover { + opacity: 0.5; + transition: 0.3s; +} -/* Reset margin and padding for the comments class. */ -body { - margin:0; - padding: 0; +.figure:hover { + background-color: #404040; + transition: 0.3s; + img { + opacity: 0.75; + } + .text { + color: #ffffff; + border-bottom-left-radius: 0.8125em; + border-bottom-right-radius: 0.8125em; + } } -.comment-environment { - background-color: #f2f2f2; +.figure { + width: 99%; + background-color: #ffffff; + img { + width: 100%; + margin-right: 0; + border-top-left-radius: 0.8125em; + border-top-right-radius: 0.8125em; + } + .text { + text-align: center; + font-size: 0.8125em; + font-style: italic; + } + a { + text-decoration: none; + color: #000000; + } }