Home page done + color change

This commit is contained in:
Claudio Maggioni (maggicl) 2021-01-22 18:49:05 +01:00
parent 6371d64e64
commit 4a509ba6f0
19 changed files with 267 additions and 265 deletions

View file

@ -1,16 +1,19 @@
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>

View file

@ -8,9 +8,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}"> <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
<link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}"> <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">

View file

@ -1,6 +1,5 @@
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
{% for my_page in site.pages %} {% for my_page in site.pages %}
{% if my_page.title %} {% if my_page.title %}
<a href="{{ my_page.url }}">{{ my_page.title }}</a> <a href="{{ my_page.url }}">{{ my_page.title }}</a>
@ -8,8 +7,6 @@
{% endfor %} {% endfor %}
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>

View file

@ -4,9 +4,9 @@
<html> <html>
{% include head.html %} {% include head.html %}
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">{{ site.title }}</h1> <h1 class="title container"><a href="/">{{ site.title }}</a></h1>
{% include header.html %} {% include header.html %}
</section> </section>
</header> </header>

View file

@ -9,7 +9,7 @@ dl, dd, ol, ul, figure {
} }
/* Basic styling */ /* Basic styling */
body { html {
font-weight: $base-font-weight; font-weight: $base-font-weight;
font-size: $base-font-size; font-size: $base-font-size;
line-height: $base-line-height; line-height: $base-line-height;
@ -35,17 +35,18 @@ li > ul, li > ol {
} }
/* Headings */ /* Headings */
h1, h2, h3, h4, h5, h6 { h2, h3, h4, h5, h6 {
font-weight: $base-font-weight; font-weight: $base-font-weight;
text-decoration: underline;
} }
/* Links */ /* Links */
a { a {
color: #08E; color: $brand-color;
text-decoration: none; text-decoration: none;
font-weight: bold;
&:visited { &:visited {
color: #C0B;
} }
&:hover { &:hover {
@ -57,9 +58,9 @@ a {
* Blockquotes * Blockquotes
*/ */
blockquote { blockquote {
color: $grey-color; color: $nav-bg;
border-left: 4px solid $grey-color-light; background: $nav-col;
font-size: 18px; border-left: 4px solid $brand-color;
letter-spacing: -1px; letter-spacing: -1px;
font-style: italic; font-style: italic;
margin: 1rem 0; margin: 1rem 0;
@ -94,7 +95,7 @@ pre {
* background */ * background */
pre, code { pre, code {
font-size: 0.95rem; font-size: 0.95rem;
background: #EEE; background: $nav-col;
} }
/* Disable borders between line numbers and code when /* Disable borders between line numbers and code when

View file

@ -1,7 +1,4 @@
/* vim: set ts=2 sw=2 et tw=80: */ /* vim: set ts=2 sw=2 et tw=80: */
$header-border: 1px solid #eee;
body { body {
background-color: $background-color; background-color: $background-color;
font-family: 'IBM Plex Mono', monospace; font-family: 'IBM Plex Mono', monospace;
@ -25,7 +22,9 @@ ul.navbar-list {
} }
.header { .header {
border-bottom: 1px solid black; border-bottom: $border;
background: $nav-bg;
color: $nav-col;
.head.navbar { .head.navbar {
display: flex; display: flex;
@ -33,30 +32,59 @@ ul.navbar-list {
h1 { h1 {
flex: 2; flex: 2;
font-size: 1.5rem; font-size: 1.5rem;
margin-bottom: .25rem;
display: inline; display: inline;
margin: 0; margin: 0;
padding: 0;
a {
color: white;
}
} }
.links { .links {
flex: 1 fit-content;
white-space: nowrap; white-space: nowrap;
line-height: 2.3rem;
text-align: right; text-align: right;
height: 100%;
padding-left: 1rem;
padding-right: 1rem;
border-left: 1px solid #555;
a { a {
font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
padding: 0 .5rem; display: inline-block;
padding: .25rem .5rem;
}
a:first-child {
padding-left: 0;
}
a:last-child {
padding-right: 0;
} }
} }
} }
} }
.homequote {
display: flex;
background: $nav-bg;
color: $nav-col;
align-items: stretch;
margin-bottom: 1rem;
figure {
margin: 0;
flex: 0;
display: flex;
align-items: center;
min-width: 300px;
background: black;
}
.quote {
border-left: 3px dotted $brand-color;
flex: 1;
padding: 1rem 1.5rem;
}
}
@media (max-width: 700px) { @media (max-width: 700px) {
.navbar-list .navbar-item { .navbar-list .navbar-item {
width: calc(100% - 2em); width: calc(100% - 2em);
@ -78,17 +106,36 @@ ul.post-list li:first-child {
padding-top: 0; padding-top: 0;
} }
.header, footer {
background-color: #EEE;
}
footer { footer {
padding-top: 1rem; padding: .5rem;
} display: flex;
justify-content: space-between;
border-top: $border;
background: $nav-bg;
color: $nav-col;
footer .author { .author {
text-align: center; font-size: 1rem;
text-transform: uppercase; text-align: right;
}
.icons {
text-align: center;
flex: 0;
white-space: nowrap;
.icon {
display: inline-table;
background: $nav-col;
color: $nav-bg;
width: 2.5em;
height: 2.5em;
text-align: center;
line-height: 2.5em;
margin: .25em;
cursor: pointer;
}
}
} }
.container { .container {
@ -96,38 +143,6 @@ footer .author {
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.icons {
text-align: center;
}
a.icon {
display: inline-table;
background-color: rgba(255,255,255,0.5);
border-radius: 1.75em;
width: 3.5em;
height: 3.5em;
text-align: center;
line-height: 3.5em;
margin: .5em;
color: white;
cursor: pointer;
}
/* Disable underlining in icon links inside the footer */
a.icon:link, a.icon:hover, a.icon:visited, a.icon:active {
text-decoration: none;
}
/* Light up footer icon links when hovering */
a.icon:hover {
background-color: #bbbbbb;
}
a.icon i.fa {
font-size: 2em;
display: table-cell;
vertical-align: middle;
}
/* Utility class for centering block elements */ /* Utility class for centering block elements */
.block-center { .block-center {

View file

@ -13,9 +13,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/404.html"> <link rel="canonical" href="https://maggioni.xyz/404.html">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -40,12 +38,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -61,8 +58,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -86,21 +81,24 @@ Thanks to <a href="https://github.com/Giorgio-Croci">Giorgio Croci
</a> for the <code>gif</code>!</p> </a> for the <code>gif</code>!</p>
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -13,9 +13,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/blog/"> <link rel="canonical" href="https://maggioni.xyz/blog/">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -40,12 +38,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -61,8 +58,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -118,21 +113,24 @@
</article> </article>
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -3,7 +3,7 @@
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; } body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; }
/* Basic styling */ /* Basic styling */
body { font-weight: 200; font-size: 18px; line-height: 1.5; font-family: monospace; color: #333; background-color: #FAFAFA; } html { font-weight: 200; font-size: 15px; line-height: 1.5; font-family: monospace; color: #222; background-color: #EEE; }
/* Images */ /* Images */
img { max-width: 100%; vertical-align: middle; } img { max-width: 100%; vertical-align: middle; }
@ -15,17 +15,15 @@ ul, ol { margin-left: 30px; }
li > ul, li > ol { margin-bottom: 0; } li > ul, li > ol { margin-bottom: 0; }
/* Headings */ /* Headings */
h1, h2, h3, h4, h5, h6 { font-weight: 200; } h2, h3, h4, h5, h6 { font-weight: 200; text-decoration: underline; }
/* Links */ /* Links */
a { color: #08E; text-decoration: none; } a { color: #FF6000; text-decoration: none; font-weight: bold; }
a:visited { color: #C0B; }
a:hover { text-decoration: underline; } a:hover { text-decoration: underline; }
/** Blockquotes */ /** Blockquotes */
blockquote { color: #828282; border-left: 4px solid #e8e8e8; font-size: 18px; letter-spacing: -1px; font-style: italic; margin: 1rem 0; padding: 1em; } blockquote { color: #222; background: #EEE; border-left: 4px solid #FF6000; letter-spacing: -1px; font-style: italic; margin: 1rem 0; padding: 1em; }
blockquote > :last-child { margin-bottom: 0; } blockquote > :last-child { margin-bottom: 0; }
@ -71,7 +69,7 @@ p:first-child { margin-top: 0; }
strong { background: #FAA; } strong { background: #FAA; }
/* vim: set ts=2 sw=2 et tw=80: */ /* vim: set ts=2 sw=2 et tw=80: */
body { background-color: #FAFAFA; font-family: 'IBM Plex Mono', monospace; display: flex; min-height: 100vh; flex-direction: column; } body { background-color: #EEE; font-family: 'IBM Plex Mono', monospace; display: flex; min-height: 100vh; flex-direction: column; }
main { flex: 1 0 auto; } main { flex: 1 0 auto; }
@ -79,15 +77,27 @@ main { flex: 1 0 auto; }
ul.navbar-list { margin-bottom: 2rem; } ul.navbar-list { margin-bottom: 2rem; }
.header { border-bottom: 1px solid black; } .header { border-bottom: 3px solid #FF6000; background: #222; color: #EEE; }
.header .head.navbar { display: flex; } .header .head.navbar { display: flex; }
.header .head.navbar h1 { flex: 2; font-size: 1.5rem; margin-bottom: .25rem; display: inline; margin: 0; } .header .head.navbar h1 { flex: 2; font-size: 1.5rem; display: inline; margin: 0; padding: 0; }
.header .head.navbar .links { flex: 1 fit-content; white-space: nowrap; line-height: 2.3rem; text-align: right; height: 100%; padding-left: 1rem; padding-right: 1rem; border-left: 1px solid #555; } .header .head.navbar h1 a { color: white; }
.header .head.navbar .links a { font-weight: bold; text-transform: uppercase; padding: 0 .5rem; } .header .head.navbar .links { white-space: nowrap; text-align: right; }
.header .head.navbar .links a { text-transform: uppercase; display: inline-block; padding: .25rem .5rem; }
.header .head.navbar .links a:first-child { padding-left: 0; }
.header .head.navbar .links a:last-child { padding-right: 0; }
.homequote { display: flex; background: #222; color: #EEE; align-items: stretch; margin-bottom: 1rem; }
.homequote figure { margin: 0; flex: 0; display: flex; align-items: center; min-width: 300px; background: black; }
.homequote .quote { border-left: 3px dotted #FF6000; flex: 1; padding: 1rem 1.5rem; }
@media (max-width: 700px) { .navbar-list .navbar-item { width: calc(100% - 2em); } } @media (max-width: 700px) { .navbar-list .navbar-item { width: calc(100% - 2em); } }
@ -97,26 +107,16 @@ ul.post-list li { padding-top: 2rem; }
ul.post-list li:first-child { padding-top: 0; } ul.post-list li:first-child { padding-top: 0; }
.header, footer { background-color: #EEE; } footer { padding: .5rem; display: flex; justify-content: space-between; border-top: 3px solid #FF6000; background: #222; color: #EEE; }
footer { padding-top: 1rem; } footer .author { font-size: 1rem; text-align: right; }
footer .author { text-align: center; text-transform: uppercase; } footer .icons { text-align: center; flex: 0; white-space: nowrap; }
footer .icons .icon { display: inline-table; background: #EEE; color: #222; width: 2.5em; height: 2.5em; text-align: center; line-height: 2.5em; margin: .25em; cursor: pointer; }
.container { padding-top: 1rem; padding-bottom: 1rem; } .container { padding-top: 1rem; padding-bottom: 1rem; }
.icons { text-align: center; }
a.icon { display: inline-table; background-color: rgba(255, 255, 255, 0.5); border-radius: 1.75em; width: 3.5em; height: 3.5em; text-align: center; line-height: 3.5em; margin: .5em; color: white; cursor: pointer; }
/* Disable underlining in icon links inside the footer */
a.icon:link, a.icon:hover, a.icon:visited, a.icon:active { text-decoration: none; }
/* Light up footer icon links when hovering */
a.icon:hover { background-color: #bbbbbb; }
a.icon i.fa { font-size: 2em; display: table-cell; vertical-align: middle; }
/* Utility class for centering block elements */ /* Utility class for centering block elements */
.block-center { display: block; margin: auto; } .block-center { display: block; margin: auto; }

File diff suppressed because one or more lines are too long

View file

@ -6,8 +6,8 @@
</description> </description>
<link>https://maggioni.xyz/</link> <link>https://maggioni.xyz/</link>
<atom:link href="https://maggioni.xyz/feed.xml" rel="self" type="application/rss+xml"/> <atom:link href="https://maggioni.xyz/feed.xml" rel="self" type="application/rss+xml"/>
<pubDate>Wed, 20 Jan 2021 11:24:33 +0100</pubDate> <pubDate>Fri, 22 Jan 2021 18:48:15 +0100</pubDate>
<lastBuildDate>Wed, 20 Jan 2021 11:24:33 +0100</lastBuildDate> <lastBuildDate>Fri, 22 Jan 2021 18:48:15 +0100</lastBuildDate>
<generator>Jekyll v4.2.0</generator> <generator>Jekyll v4.2.0</generator>
<item> <item>

BIN
_site/images/claudio.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 257 KiB

View file

@ -13,9 +13,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/"> <link rel="canonical" href="https://maggioni.xyz/">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -40,12 +38,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -61,8 +58,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -70,58 +65,63 @@
</section> </section>
</header> </header>
<main class="container"> <main class="container">
<div class="home"> <div class="homequote">
<section> <figure>
<h1>Welcome to Claudio Maggioni&#39;s website!</h1> <img width="300" height="460" src="images/claudio.jpg">
<p>Right now this page is almost empty because I have nothing to put in. </figure>
But remember:</p> <div class="quote"><p>
<blockquote> I once read a Linus Torvalds quote comparing computer
<p>Eat <a target="_blank" href="https://en.wikipedia.org/wiki/Polenta"> science to physics, stating that <blockquote><cite>[...] in physics you're
<em>polenta</em></a> and do not counter-aim!</p> supposed to figure
</blockquote> out how the world is made up, in computer science you create the
<p>The original, in italian:</p> world.</cite></blockquote>
<blockquote> </p><p> Hello, my name is Claudio Maggioni, and I have been a passionate
<p>Mangiate la "world builder" for 7 years. </p><p> Since when I began high school, I
<a target="_blank" href="https://it.wikipedia.org/wiki/Polenta"> meddled with software development, developing a creative mindset and an
<em>polenta</em> interest in problem solving. Since then, I have always been at least in part a
</a> self-taught student of computer science, satisfying my curiosity for topics
e non contromirate!</p> that were not covered in general school curriculum. </p><p> My expertise
</blockquote> includes web development, mobile application development of multiplatform
</section> applications, a passion for functional programming, and DevOps skills for
Linux systems. </p><p> Reaching the end of my undergraduate studies in
computer science, I am currently seeking job opportunities to follow at the
end of my studies, eager to apply my skills in a corporate setting.
</p></div>
</div>
<div class="home">
<section> <section>
<h2>Self-hosted services</h2> <h2>Self-hosted services</h2>
<p> <p> Listed below are some websites served by this server: </p>
Listed below are some websites served by this server:
</p>
<ul> <ul>
<li><a href="https://git.maggioni.xyz">Gitea</a>, a private Git HTTP frontend;</li> <li><a href="https://git.maggioni.xyz">Gitea</a>, a private Git HTTP
<li><a href="https://cloud.maggioni.xyz"><code>maggioni.xyz</code> cloud</a>, frontend;</li>
a private <em>Nextcloud</em> instance;</li> <li><a href="https://cloud.maggioni.xyz"><code>maggioni.xyz</code>
<li><a href="https://vimtok.maggioni.xyz"><code>theshell.ch</code></a></li> cloud</a>, a private <em>Nextcloud</em> instance;</li>
<li><a href="https://theshell.maggioni.xyz">Vimtok</a>,
a private <em>Nextcloud</em> instance;</li>
</ul> </ul>
</section> </section>
</div> </div>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -12,9 +12,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/linux/2016/07/07/get-a-bluetooth-keyboard-work-with-arch.html"> <link rel="canonical" href="https://maggioni.xyz/linux/2016/07/07/get-a-bluetooth-keyboard-work-with-arch.html">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -39,12 +37,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -60,8 +57,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -168,21 +163,24 @@ This incredibly worked. I think the problem was that <code>multi-user.target</co
</article> </article>
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -12,9 +12,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/linux/2016/07/12/installing-gentoo-on-a-thinkpad-x60s.html"> <link rel="canonical" href="https://maggioni.xyz/linux/2016/07/12/installing-gentoo-on-a-thinkpad-x60s.html">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -39,12 +37,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -60,8 +57,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -173,21 +168,24 @@
</article> </article>
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -12,9 +12,7 @@
<link rel="stylesheet" href="/css/main.css"> <link rel="stylesheet" href="/css/main.css">
<link rel="preconnect" href="https://fonts.gstatic.com"> <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Hammersmith+One' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<link rel="canonical" href="https://maggioni.xyz/linux/2016/07/28/how-to-rickroll-people-launching-rm-rf-on-your-system.html"> <link rel="canonical" href="https://maggioni.xyz/linux/2016/07/28/how-to-rickroll-people-launching-rm-rf-on-your-system.html">
<link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml"> <link rel="alternate" type="application/rss+xml" title="maggioni.xyz" href="https://maggioni.xyz/feed.xml">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
@ -39,12 +37,11 @@
</head> </head>
<body> <body>
<header class="header"> <header class="header container">
<nav class="head navbar"> <nav class="head navbar">
<h1 class="title container">maggioni.xyz</h1> <h1 class="title container"><a href="/">maggioni.xyz</a></h1>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->
<div class="links container"> <div class="links">
<a href="/">home</a>
@ -60,8 +57,6 @@
<a href="/feed.xml">RSS</a> <a href="/feed.xml">RSS</a>
<a href="/cv.html">CV</a> <a href="/cv.html">CV</a>
</div>
<div class="links container">
<a href="https://git.maggioni.xyz">Git</a> <a href="https://git.maggioni.xyz">Git</a>
<a href="https://cloud.maggioni.xyz">Cloud</a> <a href="https://cloud.maggioni.xyz">Cloud</a>
</div> </div>
@ -199,21 +194,24 @@ done</span>
</article> </article>
</main> </main>
<footer class="site-footer"> <footer class="site-footer container">
<div class="icons"> <div class="icons">
<a class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a> <a target="_blank" class="icon" href="https://tea.maggioni.xyz/maggicl"><i class="fa fa-git"></i></a>
<a class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a> <a target="_blank" class="icon" href="https://github.com/maggicl"><i class="fa fa-github"></i></a>
<a target="_blank" class="icon" href="https://gitlab.com/maggicl"><i class="fa fa-gitlab"></i></a>
<a target="_blank" class="icon" href="https://www.linkedin.com/in/claudio-maggioni/"><i class="fa fa-linkedin"></i></a>
</div> </div>
<h6 class="author"> <div class="author">
<i class="fa fa-cc" aria-hidden="true"></i> <i class="fa fa-cc" aria-hidden="true"></i>
Claudio Maggioni Claudio Maggioni
<script> <script>
document.write((new Date()).getFullYear()); document.write((new Date()).getFullYear());
</script><br> </script>
<noscript>2021</noscript><br>
Content under Content under
<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"> <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
CC BY-NC-SA 4.0</a> CC BY-NC-SA 4.0</a>
</h6> </div>
</footer> </footer>
</body> </body>

View file

@ -4,20 +4,19 @@
// Our variables // Our variables
$base-font-family: monospace; $base-font-family: monospace;
$base-font-size: 18px; $base-font-size: 15px;
$base-font-weight: 200; $base-font-weight: 200;
$small-font-size: $base-font-size * 0.875; $small-font-size: $base-font-size * 0.875;
$base-line-height: 1.5; $base-line-height: 1.5;
$spacing-unit: 30px; $spacing-unit: 30px;
$text-color: #333; $nav-bg: #222;
$background-color: #FAFAFA; $nav-col: #EEE;
$brand-color: #e82; $text-color: $nav-bg;
$background-color: $nav-col;
$grey-color: #828282; $brand-color: #FF6000;
$grey-color-light: lighten($grey-color, 40%); $border: 3px solid $brand-color;
$grey-color-dark: darken($grey-color, 25%);
// Width of the content area // Width of the content area
$content-width: 800px; $content-width: 800px;
@ -25,8 +24,6 @@ $content-width: 800px;
$on-palm: 600px; $on-palm: 600px;
$on-laptop: 800px; $on-laptop: 800px;
$slideshow-height: 70vh;
// Use media queries like this: // Use media queries like this:
// @include media-query($on-palm) { // @include media-query($on-palm) {
// .wrapper { // .wrapper {

BIN
images/claudio.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 257 KiB

View file

@ -1,39 +1,40 @@
--- ---
layout: main layout: main
--- ---
<div class="homequote">
<figure>
<img width="300" height="460" src="images/claudio.jpg">
</figure>
<div class="quote"><p>
I once read a Linus Torvalds quote comparing computer
science to physics, stating that <blockquote><cite>[...] in physics you're
supposed to figure
out how the world is made up, in computer science you create the
world.</cite></blockquote>
</p><p> Hello, my name is Claudio Maggioni, and I have been a passionate
"world builder" for 7 years. </p><p> Since when I began high school, I
meddled with software development, developing a creative mindset and an
interest in problem solving. Since then, I have always been at least in part a
self-taught student of computer science, satisfying my curiosity for topics
that were not covered in general school curriculum. </p><p> My expertise
includes web development, mobile application development of multiplatform
applications, a passion for functional programming, and DevOps skills for
Linux systems. </p><p> Reaching the end of my undergraduate studies in
computer science, I am currently seeking job opportunities to follow at the
end of my studies, eager to apply my skills in a corporate setting.
</p></div>
</div>
<div class="home"> <div class="home">
<section>
<h1>Welcome to Claudio Maggioni&#39;s website!</h1>
<p>Right now this page is almost empty because I have nothing to put in.
But remember:</p>
<blockquote>
<p>Eat <a target="_blank" href="https://en.wikipedia.org/wiki/Polenta">
<em>polenta</em></a> and do not counter-aim!</p>
</blockquote>
<p>The original, in italian:</p>
<blockquote>
<p>Mangiate la
<a target="_blank" href="https://it.wikipedia.org/wiki/Polenta">
<em>polenta</em>
</a>
e non contromirate!</p>
</blockquote>
</section>
<section> <section>
<h2>Self-hosted services</h2> <h2>Self-hosted services</h2>
<p> <p> Listed below are some websites served by this server: </p>
Listed below are some websites served by this server:
</p>
<ul> <ul>
<li><a href="https://git.maggioni.xyz">Gitea</a>, a private Git HTTP frontend;</li> <li><a href="https://git.maggioni.xyz">Gitea</a>, a private Git HTTP
<li><a href="https://cloud.maggioni.xyz"><code>maggioni.xyz</code> cloud</a>, frontend;</li>
a private <em>Nextcloud</em> instance;</li> <li><a href="https://cloud.maggioni.xyz"><code>maggioni.xyz</code>
<li><a href="https://vimtok.maggioni.xyz"><code>theshell.ch</code></a></li> cloud</a>, a private <em>Nextcloud</em> instance;</li>
<li><a href="https://theshell.maggioni.xyz">Vimtok</a>,
a private <em>Nextcloud</em> instance;</li>
</ul> </ul>
</section> </section>
</div> </div>
<!-- vim: set ts=2 sw=2 et tw=80: --> <!-- vim: set ts=2 sw=2 et tw=80: -->