minor tweaks
This commit is contained in:
parent
791aa71db7
commit
be5f412246
|
@ -12,6 +12,9 @@ menu:
|
|||
- name: BLOG
|
||||
pageRef: /blog
|
||||
weight: 20
|
||||
- name: PROJECTS
|
||||
pageRef: /projects
|
||||
weight: 30
|
||||
- name: ABOUT
|
||||
pageRef: /about
|
||||
weight: 30
|
||||
|
|
|
@ -39,12 +39,14 @@
|
|||
|
||||
--main-bg: var(--jet);
|
||||
--content-bg: var(--raisin-black);
|
||||
--primary-text: var(--pewter-blue);
|
||||
--secondary-text: var(--base01);
|
||||
--primary-text: var(--pale-silver);
|
||||
--secondary-text: var(--pewter-blue);
|
||||
--primary-link: var(--chinese-red);
|
||||
--primary-link-hover: var(--red);
|
||||
--secondary-link: var(--blue);
|
||||
--primary-link-hover: var(--pewter-blue);
|
||||
--secondary-link: var(--cyan);
|
||||
--secondary-link-hover: var(--pewter-blue);
|
||||
--ternary-link: var(--chinese-red);
|
||||
--ternary-link-hover: var(--pewter-blue);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
@ -60,6 +62,7 @@
|
|||
body {
|
||||
background-color: var(--main-bg);
|
||||
color: var(--primary-text);
|
||||
font-size: 16px;
|
||||
font-family: 'Krub', sans-serif;
|
||||
scrollbar-width: none;
|
||||
padding: 0;
|
||||
|
@ -71,7 +74,7 @@ body::-webkit-scrollbar {
|
|||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
color: var(--primary-text);
|
||||
color: var(--secondary-text);
|
||||
font-family: 'B216 Mono', monospace;
|
||||
}
|
||||
|
||||
|
@ -84,19 +87,27 @@ p {
|
|||
line-height: 1.8;
|
||||
}
|
||||
|
||||
a {
|
||||
transition: color 0.5s;
|
||||
}
|
||||
|
||||
a:link, a:visited {
|
||||
color: var(--primary-link);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover, a:active {
|
||||
text-decoration: underline;
|
||||
color: var(--primary-link-hover);
|
||||
}
|
||||
|
||||
a.tag {
|
||||
color: var(--secondary-link);
|
||||
}
|
||||
|
||||
a.tag:hover, a.tag:active {
|
||||
color: var(--secondary-link-hover);
|
||||
}
|
||||
|
||||
a.permalink {
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
@ -167,6 +178,7 @@ header a.sitetitle {
|
|||
|
||||
p#subtitle {
|
||||
text-align: center;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
p.about {
|
||||
|
@ -195,6 +207,7 @@ span.rss {
|
|||
nav {
|
||||
flex: 3 1 55%;
|
||||
text-align: right;
|
||||
padding-right: 0.4em;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
|
@ -203,34 +216,32 @@ nav ul {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
/*nav li {
|
||||
display: inline;
|
||||
}*/
|
||||
|
||||
nav li a {
|
||||
display: inline-block;
|
||||
padding: 15px 20px;
|
||||
transition-property: background-color;
|
||||
transition-duration: 0.5s;
|
||||
transition-delay: 0.1s;
|
||||
font-family: 'B612 Mono', monospace;
|
||||
font-weight: bold;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
nav li a:link, nav li a:visited {
|
||||
color: var(--ternary-link);
|
||||
}
|
||||
|
||||
nav li a:hover, nav li a:active {
|
||||
color: var(--ternary-link-hover);
|
||||
}
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
background-color: var(--content-bg);
|
||||
padding: 0 150px;
|
||||
flex-flow: row wrap;
|
||||
/* gap: 20px; */
|
||||
z-index: 1;
|
||||
/* margin: 0 0.1rem; */
|
||||
}
|
||||
|
||||
main li {
|
||||
padding: 0.2em 0;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
|
@ -261,7 +272,11 @@ article time {
|
|||
}
|
||||
|
||||
article a.title {
|
||||
color: var(--yellow);
|
||||
color: var(--primary-link);
|
||||
}
|
||||
|
||||
article a.title:hover, article a.title:active {
|
||||
color: var(--primary-link-hover);
|
||||
}
|
||||
|
||||
code {
|
||||
|
@ -318,45 +333,31 @@ footer {
|
|||
|
||||
#links-main li {
|
||||
padding: 7px 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.links-column details {
|
||||
border: 1px dotted var(--pewter-blue);
|
||||
padding: 0.5em 0.5em 0;
|
||||
}
|
||||
|
||||
.links-column details[open] {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.links-column details[open] summary {
|
||||
border-bottom: 1px dotted var(--pewter-blue);
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.links-column summary {
|
||||
margin: -0.5em -0.5em 0;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.links-column {
|
||||
flex: 1 1 300px;
|
||||
overflow-wrap: break-word;
|
||||
height: fit-content;
|
||||
}
|
||||
|
||||
.hover-links {
|
||||
position: relative;
|
||||
border-bottom: 1px dotted var(--secondary-link);
|
||||
}
|
||||
|
||||
a.hover-links:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.hover-links:before {
|
||||
content: attr(data-hover);
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
max-width: 340px;
|
||||
min-width: 200px;
|
||||
background-color: var(--main-bg);
|
||||
color: var(--primary-text);
|
||||
text-align: center;
|
||||
border: 4px double var(--primary-text);
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: -50px;
|
||||
top: -250%;
|
||||
}
|
||||
|
||||
.hover-links:hover:before {
|
||||
opacity: 0.8;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
|
|
|
@ -392,7 +392,7 @@ A more detailed example:
|
|||
let apiURL = `https://webmention.io/api/mentions.jf2?per-page=${maxWebmentions}&sort-by=${sortBy}&sort-dir=${sortDir}`;
|
||||
|
||||
pages.forEach(function (path) {
|
||||
apiURL += `&target[]=${encodeURIComponent('http:' + path)}&target[]=${encodeURIComponent('https:' + path)}`;
|
||||
apiURL += `&target[]=${encodeURIComponent('http:' + path)}&target[]=${encodeURIComponent('https:' + path)}&target[]=${encodeURIComponent('https:' + path.endswith('/') ? path.slice(0, -1) : str)}`;
|
||||
});
|
||||
|
||||
/** @type {WebmentionResponse} */
|
||||
|
|
Loading…
Reference in New Issue