PicciHud/beopen-code
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Pubblicazione sito

Browse Source
This commit is contained in:
PicciHud
2022-05-18 16:48:43 +02:00
parent a6edb01b00
commit 4cd7436953
5 changed files with 248 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
articoli.html
View File

@@ -15,6 +15,7 @@
<div>
<!--NAVBAR + LOGO-->
<div class="spacer"></div>
<div class="title">
<h2>#BeOpen</h2>
@@ -60,7 +61,7 @@
<div class="border"></div>
<p class="piccihud">22-04-2022</p>
<p class="tag">#document #freedom #philosophy</p>
<p>La Dichiarazione di indipendenza del cyberspazio è stata redatto l'8 febbraio 1996 da <em>John P.
<p>La Dichiarazione è stata redatta l'8 febbraio 1996 da <em>John P.
Barlow</em>, uno dei fondatori della
EFF. La Dichiarazione sostiene la negazione della proprietà di Internet.
</p>

71
guida_vim.html
View File

@@ -15,6 +15,7 @@
<div>
<!--NAVBAR + LOGO-->
<div class="spacer"></div>
<div class="title">
<h2>#BeOpen</h2>
@@ -127,6 +128,19 @@
<div class="spacer"></div>
<h2>Manuale di Vim</h2>
<p>Vim è un editor ricco di funzionalità, quindi ricordarle tutte è molto difficile, almeno inizialmente.
Ma non c'è motivo di preoccuparsi: si può sempre chiedere aiuto. Fortunatamente questo aiuto è fornito
da Vim stesso.</p>
<p>Il manuale di aiuto viene fornito con l'editor stesso ed è davvero completo. Per accedere alla guida,
eseguire il comando seguente:</p>
<p><span class="highlightme">:help</span></p>
<div class="spacer"></div>
<h2>Comandi base</h2>
<p>Vediamo ora alcuni comandi di base per spostarsi tra le varie modalità dell'editor.</p>
@@ -624,16 +638,19 @@
</thead>
<tbody>
<tr>
<td><span class="highlightme">qlettera</span></td>
<td>Inizio registrazione macro. Es.: qa - tutti i comandi digitati successivamente saranno
registrati</td>
<td><span class="highlightme">q{lettera}</span></td>
<td>Ha inizio la registrazione della macro. Es.: <span class="highlightme">qa</span> - tutti i
comandi digitati successivamente saranno
registrati. Nell'esempio seguente, "a" è il nome della macro. In questo passaggio è
possibile eseguire qualsiasi azione di Vim.
Si possono vedere queste azioni eseguendo il comando: <span class="highlightme">:registers</span></td>
</tr>
<tr>
<td><span class="highlightme">q</span></td>
<td>Termine della macro</td>
</tr>
<tr>
<td><span class="highlightme">@lettera</span></td>
<td><span class="highlightme">@{lettera}</span></td>
<td>Viene eseguita la macro</td>
</tr>
</tbody>
@@ -717,7 +734,6 @@
</table>
<h2>Eseguire comandi shell da Vim</h2>
<table class="styled-table">
<thead>
<tr>
@@ -732,13 +748,17 @@
</tr>
<tr>
<td><span class="highlightme">:shell</span></td>
<td>Il comando darà accesso al terminale, dove si potranno eseguire più comandi. Digitare il comando <span class="highlightme">exit</span> per tornare alla sessione di Vim</td>
<td>Il comando darà accesso al terminale, dove si potranno eseguire più comandi. Digitare il
comando <span class="highlightme">exit</span> per tornare alla sessione di Vim</td>
</tr>
</tbody>
</table>
Il comando sopra ti darà accesso al terminale, dove puoi eseguire più comandi. Una volta che hai finito, digita il comando exit che tornerà alla sessione di Vim.
Il comando sopra ti darà accesso al terminale, dove puoi eseguire più comandi. Una volta che hai finito,
digita il comando exit che tornerà alla sessione di Vim.
<div class="spacer"></div>
<h2>Controllo ortografico in Vim</h2>
<p>La prima cosa da sapere è come attivare il controllo ortografico o <em>spellcheck</em>.</p>
@@ -824,21 +844,26 @@
</div>
<h3>Auto-completamento</h3>
<p>Digitando <span class="highlightme">CTRL+X</span>, in insert mode, si accede a molto di più del sistema di
<p>Digitando <span class="highlightme">CTRL+X</span>, in insert mode, si accede a molto di più del sistema
di
correzione degli errori. È possibile procedere all'auto-completamento delle parole che si stanno
digitando.</p>
<p>Dopo aver digitato CTRL+X, invece di s è possibile digitare:</p>
<p><span class="trattino">- </span><span class="highlightme">CTRL+L</span>, per il completamento dell’intera linea (completa con frasi simili
<p><span class="trattino">- </span><span class="highlightme">CTRL+L</span>, per il completamento dell’intera
linea (completa con frasi simili
a quelle scritte precedentemente; utile se si è un programmatore);</p>
<p><span class="trattino">- </span><span class="highlightme">CTRL+N</span>, per il completamento con parole del documento (utile soprattutto
<p><span class="trattino">- </span><span class="highlightme">CTRL+N</span>, per il completamento con parole
del documento (utile soprattutto
per nomi o parole complesse che si usano abbondantemente nel file);</p>
<p><span class="trattino">- </span><span class="highlightme">CTRL+K</span>, per il completamento con parole del dizionario.</p>
<p><span class="trattino">- </span><span class="highlightme">CTRL+K</span>, per il completamento con parole
del dizionario.</p>
<div class="spacer"></div>
<h2>Lavorare con più cose contemporaneamente</h2>
<p>Vim è un editor molto potente. Supporta molte funzionalità avanzate per lavorare con più file, buffer e finestre. In questa sezione, discuteremo i seguenti elementi:</p>
<p>Vim è un editor molto potente. Supporta molte funzionalità avanzate per lavorare con più file, buffer e
finestre. In questa sezione, discuteremo i seguenti elementi:</p>
<p><span class="trattino">- </span>più file;</p>
<p><span class="trattino">- </span>buffer multipli;</p>
<p><span class="trattino">- </span>schede multiple;</p>
@@ -866,7 +891,8 @@
</table>
<h3>Buffer multipli</h3>
<p>Il <em>buffer</em> è la memoria temporanea usata da Vim per contenere il testo letto da un file. Una volta terminata la modifica e salvato il file, allora il contenuto del buffer viene
<p>Il <em>buffer</em> è la memoria temporanea usata da Vim per contenere il testo letto da un file. Una
volta terminata la modifica e salvato il file, allora il contenuto del buffer viene
trasferito nel file appropriato.</p>
<p>È possibile utilizzare i buffer per lavorare con più file.</p>
<table class="styled-table">
@@ -1043,8 +1069,23 @@
</tbody>
</table>
<h2>Identazione automatica</h2>
<p>Un altra caratteristica di Vim, che molto aiuta nella scrittura del codice, è l'autoidentazione di un
intero file.
È possibile abilitare l'identazione automatica con il comando:</p>
<span class="highlightme">:set autoindent</span>
<p>Oppure scrivere tutto il codice per poi identarlo tutto in una volta con il comando:</p>
<span class="highlightme">gg=G</span>
<p>Un modo ulteriore per identare un testo in <em>visual mode</em> è il comando:</p>
<span class="highlightme">=</span>
<p>Il comando:</p>
<span class="highlightme">gq</span>
si occupa di identare automaticamente i commenti.
<div class="divider"></div>
<p>Un articolo a parte sarà dedicato ai <em>plugin</em> e alla loro installazione, alla <em>personalizzazione</em> di Vim, sia tramite temi che modificando il file <span class="highlightme">.vimrc</span>.</p>
<p>Un articolo a parte sarà dedicato ai <em>plugin</em> e alla loro installazione, alla
<em>personalizzazione</em> di Vim, sia tramite temi che modificando il file <span class="highlightme">.vimrc</span>.</p>
</div>
<div class="container_img">
@@ -1063,6 +1104,8 @@
<p>-<a href="https://linuxhandbook.com/basic-vim-commands/" target="_blank">Comandi base di Vim</a></p>
<p>-<a href="https://linuxhandbook.com/vim-modes/" target="_blank">Modalità di Vim</a></p>
<p>-<a href="https://www.avvocati-e-mac.it" target="_blank">Guide su Vim in italiano</a></p>
<p>-<a href="https://learntutorials.net/it/vim" target="_blank">Tutorial avanzato I [ITA]</a></p>
<p>-<a href="https://tutorial.edu.lat/pub/vim">Tutorial avanzato II [ITA]</a></p>
<div class="spacer"></div>
<h2>#Video</h2>

19
index.html
View File

@@ -38,24 +38,23 @@
<p>Viviamo in un mondo che si è rapidamente spogliato di uno dei valori fondamentali: la <em>libertà di scelta</em>.
La libertà non esiste senza una vera scelta, che deve essere consapevole e non subita.</p>
<p>Questo vale anche per un'ampia sfera che sta diventando sempre più parte della nostra vita quotidiana: i dispositivi mobile.
Questi spesso non sono progettati pensando ai nostri migliori interessi, ma tuttavia occupano un posto centrale nelle nostre vite. Il mercato mobile è dominato da poche
grandi aziende, che ci consentono di utilizzare i loro servizi e ci rendono dipendenti da essi, in cambio dei nostri dati, della nostra privacy e del nostro tempo.</p>
<p>Credo fermamente in un mondo aperto, trasparente e sicuro. Un mondo in cui puoi scegliere quale piattaforma desideri utilizzare, indipendentemente dall'hardware che acquisti.
Un mondo dove puoi scegliere se condividere i tuoi dati, come e con chi, senza fare concessioni. Un mondo in cui ci sia libertà di scelta a tutti i livelli e in ogni ambito.</p>
<p>Un mondo libero.</p>
<p>Questo vale per una sfera sempre più ampia della nostra vita quotidiana, anche nell'ambito virtuale.
Molti dispositivi e servizi informatici sono infatti progettati pensando non ai nostri migliori interessi, tuttavia occupano un posto sempre più centrale nelle nostre vite. Il mercato è dominato da poche
grandi aziende, che ci consentono di utilizzare i loro servizi e ci rendono <em>dipendenti</em> da essi, in cambio dei nostri dati, della nostra privacy e del nostro tempo.</p>
<p>Credo fermamente in un mondo aperto, trasparente e sicuro. Un mondo in cui puoi scegliere quale piattaforma desideri utilizzare.
Un mondo dove puoi scegliere se condividere i tuoi dati, come e con chi, senza fare concessioni. Un mondo in cui ci sia <em>libertà di scelta</em> a tutti i livelli e in ogni ambito.</p>
<p><em>Un mondo libero.</em> </p>
<p>Questo blog nasce proprio con questo intento: proporre e consigliare alternative etiche, libere e rispettose dell'utente.
Conterrà recensioni, guide, opinioni e consigli su software FLOSS e piattaforme analoghe, ma non solo:
Conterrà recensioni, guide, opinioni e consigli su <em>software FLOSS</em> e piattaforme analoghe, ma non solo:
qua e là si tratterà anche di filosofia, cinema e letteratura.</p>
<div class="divider"></div>
<p>Alcuni punti guida:</p>
<p><span class="trattino">- </span>Tutto il sito è e sarà sempre creato utilizzando strumenti liberi ed aperti, compreso il SO (GNU/Linux);</span></p>
<p><span class="trattino">- </span>Tutto il sito è e sarà sempre scritto utilizzando strumenti liberi ed aperti, compreso il SO (GNU/Linux);</span></p>
<p><span class="trattino">- </span>nessuna dipendenza o framework proprietario è contenuto nel codice Html e Css, ma tutto è stato scritto a mano (coi limiti dell'autore) ed è disponibile su GitLab;</span></p>
<p><span class="trattino">- </span>niente cookie né componenti di terze parti o di analitica sono contenuti nel codice. Su questo sito il proprietario dei tuoi dati sei tu!</span></p>
<p>Il progetto riguarda la diffusione dell’idea stessa di libertà, in qualsiasi ambito.</p>
<p>Il progetto riguarda la <em>diffusione dell’idea stessa di libertà</em>, in qualsiasi ambito.</p>
<div class="divider"></div>

3
indipendenza_cyberspazio.html
View File

@@ -12,6 +12,9 @@
</head>
<body>
<div class="spacer"></div>
<div>
<div class="title">
<h2>#BeOpen</h2>

349
style.css
View File

@@ -11,6 +11,183 @@
font-weight: normal;
}
/*---------------------------------------------------------------------------*/
/*HOMEPAGE*/
/*TEXT*/
blockquote {
font-family: 'Courier New', Courier, monospace;
font-style: italic;
font-size: 15px;
}
blockquote a {
font-style: normal;
color: #ee6ef1;
margin: 0 0 0 -15px;
}
/*ASSET*/
img {
max-width: 100%;
height: auto;
}
.container_home {
width: 1160px;
margin: 0 auto;
}
.center {
text-align: center;
}
.divider {
padding: 20px 0;
}
/*BUTTON*/
.button {
display: inline-block;
font-size: 25px;
padding: 18px 30px;
border: 2px solid #800d83;
transition: .3s;
color: #fff;
margin: 0 0 50px 0;
border-radius: 15px;
}
.inverse {
color: #222;
}
.button:hover {
background: #800d83;
}
.inverse:hover {
color: #fff;
}
/*MAIN*/
.main {
display: flex;
justify-content: center;
width: 100%;
height: 100vh;
background: linear-gradient(rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)), url(./Img/Index/home6.jpg) no-repeat center center scroll;
/*Immagine come background della navbar*/
background-size: cover;
}
.hero {
display: flex;
justify-content: center;
align-items: center;
/*Verticalmente*/
height: 100vh;
/*Al centro del vh*/
flex-direction: column;
}
.hero h1 {
font-size: 100px;
padding: 15px 0;
color: #ee72f1;
font-weight: bold;
font-family: "PecitaBook";
}
.hero p {
font-size: 30px;
color: #fff;
font-weight: 300;
}
/*PAGE -MAIN*/
main {
min-height: 768px;
}
/*---------------------------------------------------------------------------*/
/*LISTA ARTICOLI*/
.border {
display: flex;
margin: auto;
border-color: #800d83;
border-style: dashed;
max-width: 100%;
border-width: 3px;
margin: 15px 0 15px 0;
}
.lista_articol {
width: 85%;
margin: auto;
text-align: left;
line-height: 20px;
}
.lista_articol p {
color: #a39b8f;
font-size: 16px;
text-align: left;
}
.lista_articol h2 {
color: #ee6ef1;
line-height: 30px;
}
.lista_articol .piccihud {
color: #ee6ef1;
}
.lista_articol .tag {
color: #696969;
margin-bottom: 10px;
font-size: 15px;
}
.read_more {
display: flex;
flex-direction: row;
margin: 10px 10px 0 0;
justify-content: left;
padding: 0;
}
.read_more img {
-webkit-filter: invert(.99);
width: 20px;
height: auto;
margin: 0 0 0 5px;
}
.read_more p {
color: #ee6ef1;
}
.read_more p:hover,
.lista_articol h2:hover {
color: #fff;
transition: 1s;
}
/*---------------------------------------------------------------------------*/
/*TEMPLATE ARTICOLO*/
/*BODY E TESTO*/
body {
@@ -520,176 +697,4 @@ h1 {
.styled-table tbody tr:last-of-type {
border-bottom: 2px solid #800d83;
}
/*---------------------------------------------------------------------------*/
/*HOMEPAGE*/
/*TEXT*/
blockquote {
font-family: 'Courier New', Courier, monospace;
font-style: italic;
font-size: 15px;
}
blockquote a {
font-style: normal;
color: #ee6ef1;
margin: 0 0 0 -15px;
}
/*ASSET*/
img {
max-width: 100%;
height: auto;
}
.container_home {
width: 1160px;
margin: 0 auto;
}
.center {
text-align: center;
}
.divider {
padding: 20px 0;
}
/*BUTTON*/
.button {
display: inline-block;
font-size: 25px;
padding: 18px 30px;
border: 2px solid #800d83;
transition: .3s;
color: #fff;
margin: 0 0 50px 0;
border-radius: 15px;
}
.inverse {
color: #222;
}
.button:hover {
background: #800d83;
}
.inverse:hover {
color: #fff;
}
/*MAIN*/
.main {
display: flex;
justify-content: center;
width: 100%;
height: 100vh;
background: linear-gradient(rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)), url(./Img/Index/home6.jpg) no-repeat center center scroll;
/*Immagine come background della navbar*/
background-size: cover;
}
.hero {
display: flex;
justify-content: center;
align-items: center;
/*Verticalmente*/
height: 100vh;
/*Al centro del vh*/
flex-direction: column;
}
.hero h1 {
font-size: 100px;
padding: 15px 0;
color: #ee72f1;
font-weight: bold;
font-family: "PecitaBook";
}
.hero p {
font-size: 30px;
color: #fff;
font-weight: 300;
}
/*PAGE -MAIN*/
main {
min-height: 768px;
}
/*---------------------------------------------------------------------------*/
/*LISTA ARTICOLI*/
.border {
display: flex;
margin: auto;
border-color: #800d83;
border-style: dashed;
max-width: 100%;
border-width: 3px;
margin: 15px 0 15px 0;
}
.lista_articol {
width: 85%;
margin: auto;
text-align: left;
line-height: 20px;
}
.lista_articol p {
color: #a39b8f;
font-size: 16px;
text-align: left;
}
.lista_articol h2 {
color: #ee6ef1;
line-height: 30px;
}
.lista_articol .piccihud {
color: #ee6ef1;
}
.lista_articol .tag {
color: #696969;
margin-bottom: 10px;
font-size: 15px;
}
.read_more {
display: flex;
flex-direction: row;
margin: 10px 10px 0 0;
justify-content: left;
padding: 0;
}
.read_more img {
-webkit-filter: invert(.99);
width: 20px;
height: auto;
margin: 0 0 0 5px;
}
.read_more p {
color: #ee6ef1;
}
.read_more p:hover,
.lista_articol h2:hover {
color: #fff;
}