hover icons for header links

This commit is contained in:
Zoe 2022-04-18 10:42:54 +02:00
parent 3967fa1027
commit 38b4fbd855
5 changed files with 28 additions and 5 deletions

View file

@ -35,7 +35,7 @@ a {
color: $dark-ln;
}
.randomword-button{
.randomword-button {
&.light {
border-color: $light-fg;
background-color: $light-bg;
@ -48,7 +48,7 @@ a {
border-color: $dark-fg;
background-color: $dark-bg;
color: $dark-fg;
&:hover{
&:hover {
color: $dark-bg;
background-color: $dark-fg;
}
@ -229,6 +229,15 @@ h6 {
}
h1 {
& a {
&.light {
color: $light-bg;
}
color: $dark-bg;
&:hover {
background-color: transparent;
}
}
& #rss-title {
background-color: transparent;
color: $dark-bg;

View file

@ -75,6 +75,20 @@ h5,
h6 {
border-top-right-radius: $radius;
border-bottom-right-radius: $radius;
& .with-rss {
&:hover {
&::before {
content: "";
}
}
}
& .singlepagelink {
&:hover {
&::before{
content: "./";
}
}
}
& .hash-link {
&:hover {
cursor: pointer;

View file

@ -2,7 +2,7 @@
<main>
<article class="colorswitch">
<header>
<h1 id="title"><a href="./index.xml" class="colorswitch with-rss" id="rss-title">{{.Title}} </a></h1>
<h1 id="title"><a target="_blank" rel="noreferrer noopener" href="./index.xml" class="colorswitch with-rss" id="rss-title">{{.Title}} </a></h1>
</header>
<!-- "{{.Content}}" pulls from the markdown content of the corresponding _index.md -->
{{.Content}}

View file

@ -1,7 +1,7 @@
{{ define "main" }}
<section id="main">
<div class="titlecontainer">
<h1 id="title" class="colorswitch">{{ .Title }}</h1>
<h1 id="title" class="colorswitch"><a href="./" class="colorswitch singlepagelink">{{ .Title }}</a></h1>
</div>
<div>
<article id="content" class="colorswitch">

View file

@ -1,6 +1,6 @@
{{ define "main" }}
<header>
<h1 id="title"><a href="./index.xml" class="colorswitch with-rss" id="rss-title">{{.Title}} </a></h1>
<h1 id="title"><a target="_blank" rel="noreferrer noopener" href="./index.xml" class="colorswitch with-rss" id="rss-title">{{.Title}} </a></h1>
</header>
<article id="content" class="colorswitch">
<p>