Slider + tooltip completati

This commit is contained in:
SultanOfSauce 2024-04-05 15:05:28 +02:00
parent 3cfcbff3a1
commit 0bee2fc4e5
14 changed files with 70 additions and 517 deletions

View File

Before

Width:  |  Height:  |  Size: 176 KiB

After

Width:  |  Height:  |  Size: 176 KiB

View File

@ -1,16 +0,0 @@
---
title: "CCMP: {{ replace .Name "-" " " | title }}"
date: {{ .Date }}
description: ""
draft: true
comments: false
showShare: false
norss: false
nosearch: false
toc: false
tags:
- CCMP
categories:
---

View File

@ -1,16 +0,0 @@
---
title: "[DR] De Rebus: {{ replace .Name "-" " " | title }}"
date: {{ .Date }}
description: ""
draft: true
comments: false
showShare: false
norss: false
nosearch: false
toc: false
tags:
- DR
categories:
---

View File

@ -1,104 +0,0 @@
#baseURL = "https://memento.theforbidden.link/"
baseURL = ""
theme = ["hugo-ficurinia"]
title = "Obelisco Digitale"
languageCode = "it"
defaultContentLanguage = "it"
enableEmoji = true
# this will be included in the footer after the current year the site is last
# built, followed by the (c) symbol
# you can use markdown inside this field
copyright = ""
[params]
author = "Adriano Sepe"
description = "Un'eterno flusso di coscienza'" # this will be added as metadata
posts = "/posts" # content directory where to find home page posts; default searches in "posts" and "post"
showPostsLink = true # show or hide the link to the simple post list
extraContentDirs = ["about/"] # other content directories to render similarly to the home page
showcaseDir = "showcase/" # create a content directory that shows a special showcase section in the home page
# shows a specified single page as a home page, instead of the traditional articles list
# requires setting `homeSinglePage`
# goes well with extraContentDirs
showSinglePageAsHome = true
homeSinglePage = "/home"
# It's best to put these icons in the "static" folder of your site
logo = "/obelisk.png"
favicon = "/favicon.png" # 32x32
faviconIco = "/favicon.ico" # 32x32
appletouch = "/apple-touch-icon.png" # 180x180
svgicon = "/obelisk.png"
icon512 = "/icon512.png" # 512x512 png image
logoRightOfTitle = false # positions the logo to the right of the title; default: false
showTags = true # show the Tags menu item; default true
showRss = true # show the link for the RSS feed; default true
imageInArticlePreview = false # show images in article preview; default false
fitImageInArticlePreview = false # make article preview images fit the article preview instead of getting cropped
articleSummary = false # show a summary in article preview; default true
fontFamily = "Finlandica" # changes the font, default "JetBrains Mono"
titleFontFamily = "Labrada" # font used for titles and headings
monospaceFontFamily = "JetBrains Mono" # changes the monospace font for code, default "JetBrains Mono"
# multipliers applied to font sizes, useful for custom fonts that may be too big or too small
titleFontSizeMultiplier = 1.2
mainFontSizeMultiplier = 1.1
monoFontSizeMultiplier = 1.0
contentWidth = "1920px" # maximum width of the site content, css syntax
paperCards = false # enable paper card style; default false
buttonTags = true # enable button tag style; default false
tagsInArticlePreview = true # enable tags list in the article preview card
gridView = false # show post list as a grid. goes well with paperCards
bigArticleTitle = true # makes the title in the single article view bigger
navtype = "circles" # changes the style of the pagination, available styles are: "standard", "circles"
enableShadow = false # shows a shadow around some elements
menuStyle = "buttons" # changes the style of the main site navigation menu, available styles are: "standard", "buttons"
enableSearch = true # enable search page
searchbarEverywhere = true # if the searchbar should be shown in every page; requires enableSearch
searchMenuLink = false # add a search link to the navigation menu; requires enableSearch
mobileHamburgerNav = true # alternative hamburger menu layout for the main nav menu when screen is small
enableFeatured = false # enable a particular view for articles marked as featured (featured: true in the article frontmatter)
underlineTitleLinks = true # show an underline also for links that are titles
enableShareOnFediverse = false # enable a button at the end of an article to share it on the fediverse
tocBeforeImage = false # show the table of contents before the main article image; default false
# alternative sidebar layout
enableSidebarLayout = true
tocInSidebar = false # if the sidebar is enbabled, show the TOC in the sidebar
# redirect to baseURL if current URL host doesn't match
# useful if deploying in gitlab pages with custom domain and don't want
# the username.gitlab.io/website url to persist
# this requires you to set baseURL (see above)
forceRedirect = false
[menu]
# these links will be added to the main navigation menu, sorted by weight
# other elements in this menu are added automatically from the "pages" folder
# the folder it will look into can be customized with the pages variable
# in params above
[[menu.main]]
identifier = "categorie"
name = "Categorie"
url = "/categories/"
weight = 10
[[menu.icons]]
identifier = "email"
name = "Email"
url = "mailto:webmaster@obeliscodigitale.online"
weight = 20

View File

@ -1,342 +0,0 @@
<!DOCTYPE html>
<html class="" lang="it"><head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<link
rel="icon"
href='/favicon.png'
/>
<link
rel="shortcut icon"
href='/favicon.ico'
type="image/x-icon"
/>
<link
rel="apple-touch-icon"
href='/apple-touch-icon.png'
/>
<link
rel="icon"
href='/obelisk.png'
type="image/svg+xml"
/>
<title>
About &ndash;
Obelisco Digitale
</title>
<link href="/symbols-nerd-font/symbols-nerd-font.css" rel="stylesheet" integrity="sha512-lydow8GLOLlYNOtHlksNCmGWWCBsbIEtikXpHzfWqx78HLlyQZHOzyLwPpKol4Th6aCwLUXOfODVYgwrd3nwKQ=="/>
<link href="/jetbrains-mono/jetbrains-mono.css" rel="stylesheet" integrity="sha512-tJxlgL6v1Y7kFf+qB8SloaAMKnOAw6WouknxXtIjkBux9Y/9aX81EUWOJO8c/3l98DmjG8brr4to7zaez606Fg=="/>
<link type="text/css" rel="stylesheet" href=/css/styles.826aa23d4111867b73db31bd6a8a667c636ecc7f471aba91ab00fc602ae024f42bec10d43984ba4eb3d6faad625a291a3b3021e79da546d1b64756e8e12633eb.css integrity="sha512-gmqiPUERhntz2zG9aopmfGNuzH9HGrqRqwD8YCrgJPQr7BDUOYS6TrPW&#43;q1iWikaOzAh552lRtG2R1bo4SYz6w==" /><style>
@import url('/fonts/labrada/labrada.css');
@import url("/fonts/finlandica/finlandica.css");
@import url("/fonts/rajdhani/rajdhani.css");
</style>
<style>
blockquote {
display: block;
border-width: 2px 0;
border-style: solid;
border-color: #eee;
padding: 1.5em 0 0.5em;
margin: 1.5em 0;
position: relative;
}
blockquote .cite {
display: block;
text-align: right;
font-size: 0.875em;
color: #f7cb15;
}
</style>
<style>
.clr{
clear: both;
}
</style>
<meta name="author" content="Adriano Sepe" />
<meta name="description" content="erché vuoi più informazioni su questo sito.
Come scritto anche nella breve descrizione di questo sito, i post che carico qui non sono altro che pensieri e ricordi più o meno personali. Cercherò per quanto possibile di aggiungere tag intelligenti per ogni post, ed inoltre volevo cercare di introdurre una serie di rubriche per quando voglio parlare di argomenti ricorrenti. Di seguito una descrizione delle rubriche in questo sito; Ovviamente questa sezione verrà aggiornata gradualmente." />
<meta property="og:site_name"
content='Obelisco Digitale' />
<meta property="og:title" content="About" />
<meta property="og:type" content="article" />
<meta
property="article:author" content="Adriano Sepe" />
<meta
property="article:published_time"
content='2023-02-25T01:53:27Z&#43;0100' />
<meta property="og:url" content="/about/" />
<meta property="og:image"
content="/icon512.png" />
<meta property="og:description" content="Ciao, se sei qui è perché vuoi più informazioni su questo sito.
Come scritto anche nella breve descrizione di questo sito, i post che carico qui non sono altro " />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:domain"
content=''
/>
<meta property="twitter:url" content="/about/" />
<meta name="twitter:title" content="About" />
<meta name="twitter:image"
content="/icon512.png" />
<meta name="twitter:description" content="Ciao, se sei qui è perché vuoi più informazioni su questo sito.
Come scritto anche nella breve descrizione di questo sito, i post che carico qui non sono altro " />
<link rel="manifest" href="/manifest/index.json" />
</head>
<body>
<div id="baseContainer"><header class="">
<div class="titleAndSearchContainer">
<div id="titleContainer">
<a class="unstyledLink" href="/">
<img src='/obelisk.png' alt='Logo'/>
</a>
<div class="rightOfLogo">
<div class="titleAndHamburger">
<h1>
<a class="unstyledLink" href="/">Obelisco Digitale</a>
</h1>
<label id="hamburger-menu" for="main-nav-toggler">
&#xf85b;
</label>
</div>
<div id="wide_nav"><nav>
<input type="checkbox" id="main-nav-toggler" />
<ul id="main-nav">
<li><a href="/">Home</a></li>
<li><a href="/posts">Post</a></li>
<li><a href="/about/">About</a></li>
<li><a href="/categories/">Categorie</a></li>
<li><a href="/tags">Tag</a></li>
</ul>
</nav>
</div>
</div>
</div>
<div class="search">
<input id="searchbar" type="text" placeholder='Cerca' />
<a class="nerdlink" onclick="newSearch();">&#xf002;</a>
</div>
<script>
function newSearch() {
let term = searchbar.value.trim();
if (!term) return;
location.href = `/search?q=${term}`;
}
searchbar.onkeyup = (ev) => {if (ev.keyCode == 13) newSearch()};
</script>
</div>
<div id="links">
<a
rel="noreferrer"
target="_blank"
class="nerdlink"
href="/index.xml">
&#xf09e;
<span>
RSS
</span>
</a>
<a
rel="noreferrer"
target="_blank"
class="nerdlink"
href="mailto:webmaster@obeliscodigitale.online">
&#xf6ed;
<span>
Email
</span>
</a>
</div>
<div id="sidebar_nav"><nav>
<input type="checkbox" id="main-nav-toggler" />
<ul id="main-nav">
<li><a href="/">Home</a></li>
<li><a href="/posts">Post</a></li>
<li><a href="/about/">About</a></li>
<li><a href="/categories/">Categorie</a></li>
<li><a href="/tags">Tag</a></li>
</ul>
</nav>
</div>
</header>
<div id="contentContainer">
<div id="content">
<main>
<article class="card single">
<h1>About</h1>
<div><p>Ciao, se sei qui è perché vuoi più informazioni su questo sito.</p>
<p>Come scritto anche nella breve descrizione di questo sito, i post che carico qui non sono altro che pensieri e ricordi più o meno personali. Cercherò per quanto possibile di aggiungere tag intelligenti per ogni post, ed inoltre volevo cercare di introdurre una serie di rubriche per quando voglio parlare di argomenti ricorrenti. Di seguito una descrizione delle rubriche in questo sito; Ovviamente questa sezione verrà aggiornata gradualmente.</p>
<h1 id="rubriche">Rubriche</h1>
<ul>
<li>
<h2 id="cose-che-mi-piacciono-ccmp">Cose Che Mi Piacciono (CCMP)</h2>
</li>
</ul>
<p>Una rubrica sulle cose che mi piacciono. Si parla di musica, videogame o cose che in generale mi sconfinferano. L&rsquo;obiettivo è semplicemente quello di tenere traccia dei miei gusti nel tempo.</p>
<ul>
<li>
<h2 id="sondering-individuals-si">Sondering Individuals (SI)</h2>
</li>
</ul>
<p>Persone sconosciute che hanno lasciato il segno. La storia di incontri avvenuti una volta e che voglio ricordare.</p>
<ul>
<li>
<h2 id="de-rebus-sulle-cose-dr"><em>De Rebus</em> (Sulle cose) (DR)</h2>
</li>
</ul>
<p>Riflessioni su argomenti più o meno filosofici.</p>
<ul>
<li>
<h2 id="come-va-cv">Come Va? (CV)</h2>
</li>
</ul>
<p>&ldquo;Adri, come va?&rdquo;</p>
<ul>
<li>
<h2 id="eventi-e">Eventi (E)</h2>
</li>
</ul>
<p>Storie di cose che mi sono accadute.</p>
<ul>
<li>
<h2 id="miscellanea">Miscellanea</h2>
</li>
</ul>
<h1 id="to-do-aggiunto-qui-perché-non-voglio-creare-altre-sezioni">To do (aggiunto qui perché non voglio creare altre sezioni)</h1>
<ul>
<li>Aggiungere un contatore per il numero di visitatori (Se mi puoi aiutare contattami!);</li>
<li>Se necessario, aggiungere un pulsantino per le donazioni al fine di tenere i costi di hosting.</li>
</ul>
<h1 id="licensing-etc">Licensing etc.</h1>
<p>I font utilizzati sono <a href="https://fonts.google.com/specimen/Finlandica">Finlandica</a> per il testo normale e <a href="https://fonts.google.com/specimen/Labrada">Labrada</a> per i titoli, entrambi disponibili su Google Fonts.</p>
<p>Sto inoltre utilizzando il tema <a href="https://gitlab.com/gabmus/hugo-ficurinia">Ficurinia</a> come indicato nel footer.</p>
</div>
</article>
</main><footer>
<hr /><script data-goatcounter="https://sharayar.goatcounter.com/count"
async src="//gc.zgo.at/count.js"></script>
Ultima Modifica: 22/07/2023
Ultima Modifica: 22/07/2023
\n
Sito gentilmente hostato da <a href=http://leprd.space>leprd.space</a>.
<p><small>
2023 &copy;
</small></p>
<p><small>
<a href='https://gitlab.com/gabmus/hugo-ficurinia'>Tema Ficurinia</a> per <a href='https://gohugo.io'>Hugo</a> creato da <a href='https://gabmus.org'>Gabriele Musco</a>. Disponibile con licenza <a href='https://www.gnu.org/licenses/agpl-3.0.html'>GNU AGPLv3</a>.
</small></p>
</footer>
</div>
</div>
</div>
</body>
</html>

View File

@ -1,20 +0,0 @@
The MIT License (MIT)
Copyright (c) 2024 YOUR_NAME_HERE
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

View File

@ -1,6 +1,7 @@
<label class="switch">
<input class="font-toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
<span class="slider">
<span class="tooltiptext">Font poco chiaro? Clicca qui!</span>
</span>
</label>
<div id="desert"></div>

View File

@ -23,7 +23,7 @@
.slider {
box-sizing: border-box;
border: 1px solid var(--main-color);
box-shadow: 0px 4px var(--main-color);
box-shadow: 0px 4px 0px var(--main-color);
position: absolute;
cursor: var(--pointercur), pointer;
top: 0;
@ -36,6 +36,7 @@
black
);
transition: 0.2s;
transition-timing-function: ease-in-out;
}
.slider:before {
@ -53,6 +54,60 @@
background-color: var(--bg-color);
box-shadow: 0 3px 0 var(--main-color);
transition: 0.2s;
transition-timing-function: ease-in-out;
}
.slider .tooltiptext {
visibility: hidden;
white-space: nowrap;
height: 20px;
margin: 5px;
padding: 5px;
background-color: #F7F3E3;
color: #191102;
text-align: center;
border: solid;
border-width: 1px;
border-color: #191102;
font-family: Heal The Web A;
/* Position the tooltip */
position: absolute;
z-index: 1;
left: 110%;
top: -7px;
opacity: 0;
transition: .3s;
}
.slider:hover .tooltiptext {
visibility: visible;
opacity: 1;
box-shadow: 0px 8px 0px var(--main-color);
top: -15px;
}
.slider .tooltiptext::before {
content: " ";
position: absolute;
top: calc(50% - 1px);
right: 100%; /* To the left of the tooltip */
margin-top: -5px;
border-width: 6px;
border-style: solid;
border-color: transparent var(--main-color) transparent transparent;
}
.slider .tooltiptext::after {
content: " ";
position: absolute;
top: 50%;
right: 100%; /* To the left of the tooltip */
margin-top: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent var(--bg-color) transparent transparent;
}
.font-toggle:checked + .slider {

View File

@ -10,10 +10,10 @@
--link: #A81ADB;
--defcur: url("../curdark/cursor-pointer-1-dark.png");
--pointercur: url("../curdark/cursor-pointer-18-dark.png");
--desertbg: url("../pix/desertile_03.png");
--desertbg: url("../pix/deserttile.png");
--sand: url("../pix/sand.png");
--obelisk: url("../pix/obelisk2.png");
--wall: url("../pix/Tileset4.png");
--obelisk: url("../pix/obelisk.png");
--wall: url("../pix/wall.png");
--bg: linear-gradient(0deg, #53F4FF 0%, #85F7FF 33%, #ADFAFF 66%);
--bg-repeats: no-repeat, repeat-x, repeat, no-repeat;
--clouds: url("../pix/cloudtiling.png");

View File

Before

Width:  |  Height:  |  Size: 50 KiB

After

Width:  |  Height:  |  Size: 50 KiB

View File

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

View File

Before

Width:  |  Height:  |  Size: 43 KiB

After

Width:  |  Height:  |  Size: 43 KiB

View File

@ -1,21 +1,16 @@
# theme.toml template for a Hugo theme
# See https://github.com/gohugoio/hugoThemes#themetoml for an example
name = "ExampleTheme"
license = "MIT"
licenselink = "https://github.com/yourname/yourtheme/blob/master/LICENSE"
description = ""
homepage = "http://example.com/"
name = "Memento"
license = "-"
licenselink = "-"
description = "-"
homepage = "-"
tags = []
features = []
min_version = "0.41.0"
min_version = "1.00.0"
[author]
name = ""
homepage = ""
name = "Adriano"
homepage = "obelisco.digital"
# If porting an existing theme
[original]
name = ""
homepage = ""
repo = ""