Compare commits

...

7 Commits

Author SHA1 Message Date
Mats Rauhala 06f95f0aa6 I had double projects set up for some reason 2023-04-25 21:41:30 +03:00
Mats Rauhala 8fcf863e6a The post had some problems on a narrower screen 2023-04-25 21:38:48 +03:00
Mats Rauhala a732c620a8 Some padding 2023-04-25 21:35:58 +03:00
Mats Rauhala a1f344a510 Change contact address 2023-04-25 21:35:41 +03:00
Mats Rauhala 933403e249 Comments 2023-04-25 21:30:09 +03:00
Mats Rauhala 57096e5d06 Two git 2023-04-25 21:28:57 +03:00
Mats Rauhala b02f086730 Update navbar 2023-04-25 21:11:00 +03:00
5 changed files with 58 additions and 35 deletions

View File

@ -5,4 +5,4 @@ title: Contact
I live in Espoo Finland. You can contact me on any of the following services. I live in Espoo Finland. You can contact me on any of the following services.
- **Email**: mats.rauhala@iki.fi - **Email**: mats.rauhala@iki.fi
- **Mastodon**: MasseR@haskell.social - **Mastodon**: MasseR@rauhala.info

View File

@ -550,6 +550,10 @@ video {
} }
} }
.visible {
visibility: visible;
}
.absolute { .absolute {
position: absolute; position: absolute;
} }
@ -591,6 +595,10 @@ video {
display: grid; display: grid;
} }
.hidden {
display: none;
}
.max-w-2xl { .max-w-2xl {
max-width: 42rem; max-width: 42rem;
} }
@ -603,10 +611,6 @@ video {
max-width: 36rem; max-width: 36rem;
} }
.flex-1 {
flex: 1 1 0%;
}
.shrink { .shrink {
flex-shrink: 1; flex-shrink: 1;
} }
@ -627,6 +631,10 @@ video {
align-items: center; align-items: center;
} }
.items-stretch {
align-items: stretch;
}
.justify-center { .justify-center {
justify-content: center; justify-content: center;
} }
@ -635,6 +643,10 @@ video {
justify-content: space-between; justify-content: space-between;
} }
.gap-2 {
gap: 0.5rem;
}
.gap-x-4 { .gap-x-4 {
-moz-column-gap: 1rem; -moz-column-gap: 1rem;
column-gap: 1rem; column-gap: 1rem;
@ -653,6 +665,10 @@ video {
border-radius: 0.25rem; border-radius: 0.25rem;
} }
.border {
border-width: 1px;
}
.border-b { .border-b {
border-bottom-width: 1px; border-bottom-width: 1px;
} }
@ -676,9 +692,13 @@ video {
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.px-3 { .p-2 {
padding-left: 0.75rem; padding: 0.5rem;
padding-right: 0.75rem; }
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
} }
.px-6 { .px-6 {
@ -695,6 +715,10 @@ video {
padding-top: 2.5rem; padding-top: 2.5rem;
} }
.pt-2 {
padding-top: 0.5rem;
}
.text-2xl { .text-2xl {
font-size: 1.5rem; font-size: 1.5rem;
line-height: 2rem; line-height: 2rem;
@ -742,6 +766,10 @@ video {
color: rgb(156 163 175 / var(--tw-text-opacity)); color: rgb(156 163 175 / var(--tw-text-opacity));
} }
.group:hover .group-hover\:block {
display: block;
}
.group:hover .group-hover\:text-gray-600 { .group:hover .group-hover\:text-gray-600 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity)); color: rgb(75 85 99 / var(--tw-text-opacity));

View File

@ -10,26 +10,34 @@
</head> </head>
<body> <body>
<header> <header>
<nav class="bg-gray-800"> <nav class="flex bg-gray-800 text-gray-300 items-stretch text-lg border width-full align-center justify-between">
<div class="flex flex-1 items-center justify-center"> <ul class="flex gap-2 p-2">
<!-- Git logo from https://git-scm.com/downloads/logos --> <li class="hover:text-gray-400"><a href="/">Home</a></li>
<!-- Logo by Jason Long --> <li class="hover:text-gray-400"><a href="/posts.html">Posts</a></li>
<a class="text-gray-300 hover:text-gray-400 rounded px-3" href="/">Home</a> <li class="hover:text-gray-400"><a href="/projects.html">Projects</a></li>
<a class="text-gray-300 hover:text-gray-400 rounded px-3" href="/posts.html">Posts</a> </ul>
<a class="text-gray-300 hover:text-gray-400 rounded px-3" href="/projects.html">Projects</a> <ul class="flex gap-2 p-2">
<a class="text-gray-300 hover:text-gray-400 rounded px-3" href="https://git.rauhala.info">Git</a> <li class="group">Git
<a class="text-gray-300 hover:text-gray-400 rounded px-3" href="/contact.html">Contact</a> <!-- Hide the dropdown by default, but make it visible on the parent hover
</div> see the 'group' on the toplevel
</nav> -->
<ul class="hidden bg-gray-800 text-gray-300 border rounded p-2 group-hover:block absolute">
<li class="hover:text-gray-400"><a href="https://git.rauhala.info/MasseR">Gitea</a></li>
<li class="hover:text-gray-400"><a href="https://github.com/MasseR">GitHub</a></li>
</ul>
</li>
<li class="hover:text-gray-400"><a href="/contact.html">Contact</a></li>
</ul>
</nav>
</header> </header>
<main role="main"> <main role="main" class="px-2">
<div> <div>
$body$ $body$
</div> </div>
</main> </main>
<footer> <footer class="pt-2 border-t px-2">
Site proudly generated by Site proudly generated by
<a href="http://jaspervdj.be/hakyll">Hakyll</a> <a href="http://jaspervdj.be/hakyll">Hakyll</a>
</footer> </footer>

View File

@ -1,5 +1,5 @@
<div class="container mx-auto mt-10 mb-10"> <div class="container mx-auto mt-10 mb-10">
<article class="flex max-w-xl flex-col items-start justify-center"> <article class="max-w-xl flex-col items-start justify-center">
<div class="flex items-center gap-x-4 text-xs"> <div class="flex items-center gap-x-4 text-xs">
<time datetime="$date$" class="text-gray-500">$date$</time> <time datetime="$date$" class="text-gray-500">$date$</time>
</div> </div>

View File

@ -22,16 +22,3 @@
</article> </article>
</section> </section>
</div> </div>
<div class="sidebar-container">
<article>
<section>
$body$
</section>
</article>
<div class="sidebar">
<a href="$github$">Github</a>
<a href="$issues$">Issues</a>
$if(badge)$<img src="$badge$" />$endif$
</div>
</div>