Bootstrap 4 - Migrazione dei glifi?

317

Abbiamo un progetto che usa intensamente i glifidi. Bootstrap v4 rilascia del tutto il carattere glyphicon.

Esiste un equivalente per le icone fornite con Bootstrap V4?

changelog

http://v4-alpha.getbootstrap.com/migration/

bootstrap-4  glyphicons 
— Vincent Poirier
fonte
15
Puoi ancora usare i glyphicons , semplicemente non verranno più spediti con bootstrap. In caso di problemi di licenza , è possibile controllare le icone fantastiche dei caratteri .
— Holt,
1
Credo che tu debba pagare per usare il carattere. Ho modificato la domanda per chiarire.
— Vincent Poirier,
Esiste una licenza gratuita in cui è necessario inserire un collegamento ai glifi (vedere la sezione GLYPHICON FREE nel mio collegamento precedente). Come ho detto nel mio commento precedente, ci sono alternative come il font fantastico che sono open source e gratuite, ma sapere quale è il migliore sarà chiaramente basato sull'opinione ...
— Holt
Sarebbe fantastico, ma il pacchetto gratuito non offre il carattere, solo i file PNG. Apparentemente, solo il pacchetto PRO include Tutte le icone come font web . Sebbene tu sia molto utile (grazie), la domanda è più sui componenti inclusi in Bootstrap, se puoi confermare che nessuna icona di qualsiasi tipo è (o sarà) inclusa nella v4, puoi generare una risposta.
— Vincent Poirier,
Se vai al link fornito fontawesome.io, ti verrà richiesto un pagamento di $ 60 o $ 99 se aspetti troppo, quindi credo che fontawesome non sia più gratuito.
— Gustavo Rodríguez,

Risposte:

269

Puoi usare sia Font Awesome che Github Octicons come alternativa gratuita a Glyphicons.

Bootstrap 4 è passato anche da Less a Sass, quindi potresti integrare il Sass (SCSS) del font nel tuo processo di creazione, per creare un singolo file CSS per i tuoi progetti.

Vedi anche https://getbootstrap.com/docs/4.1/getting-started/build-tools/ per scoprire come impostare i tuoi strumenti:

  1. Scarica e installa Node, che utilizziamo per gestire le nostre dipendenze.
  2. Passare alla /bootstrapdirectory principale ed eseguire npm installper installare le nostre dipendenze locali elencate in package.json.
  3. Installa Ruby, installa Bundler con gem install bundlered infine esegui bundle install. Questo installerà tutte le dipendenze di Ruby, come Jekyll e plugin.

Carattere fantastico

  1. Scarica i file da https://github.com/FortAwesome/Font-Awesome/tree/fa-4
  2. Copia la font-awesome/scsscartella nella cartella / bootstrap

  3. Apri il tuo SCSS /bootstrap/bootstrap.scsse annota il seguente codice SCSS alla fine di questo file:

    $fa-font-path: "../fonts"; @import "../font-awesome/scss/font-awesome.scss";

  4. Si noti che si hanno anche per copiare il file di font da font-awesome/fontsa dist/fontso di qualsiasi altro insieme di cartelle pubbliche $fa-font-pathnel passaggio precedente

  5. Esegui: npm run distper ricompilare il codice con Font-Awesome

Github Octicons

  1. Scarica i file da https://github.com/github/octicons/
  2. Copia la octiconscartella nella tua /bootstrapcartella

  3. Apri il tuo SCSS /bootstrap/bootstrap.scsse annota il seguente codice SCSS alla fine di questo file:

    $fa-font-path: "../fonts"; @import "../octicons/octicons/octicons.scss";

  4. Si noti che si hanno anche per copiare il file di font da font-awesome/fontsa dist/fontso di qualsiasi altro insieme di cartelle pubbliche $fa-font-pathnel passaggio precedente

  5. Esegui: npm run distper ricompilare il codice con Octicons

Glyphicons

Sul sito Web Bootstrap puoi leggere:

Comprende oltre 250 glifi in formato carattere dal set Glyphicon Halflings. Glyphicons Halflings non sono normalmente disponibili gratuitamente, ma il loro creatore li ha resi disponibili per Bootstrap gratuitamente. Come ringraziamento, ti chiediamo di includere un link a Glyphicons solo quando possibile.

A quanto ho capito, puoi utilizzare questi 250 glifi gratuitamente per Bootstrap ma non limitati alla versione 3 esclusiva. Quindi puoi usarli anche per Bootstrap 4.

  1. Copia i file dei caratteri da: https://github.com/twbs/bootstrap-sass/tree/master/assets/fonts/bootstrap
  2. Copia il file https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_glyphicons.scss nella tua bootstrap/scsscartella
  3. Apri scss /bootstrap/bootstrap.scss e annota il seguente codice SCSS alla fine di questo file:
$bootstrap-sass-asset-helper: false;
$icon-font-name: 'glyphicons-halflings-regular';
$icon-font-svg-id: 'glyphicons_halflingsregular';
$icon-font-path: '../fonts/';
@import "glyphicons";
  1. Esegui: npm run distper ricompilare il codice con Glyphicons

Si noti che Bootstrap 4 richiede il post Autoprefixer CSS per la compilazione. Quando si utilizza un compilatore Sass statico per compilare il CSS, è necessario eseguire l'Autoprefixer in seguito.

Puoi trovare ulteriori informazioni sul mixaggio con Bootstrap 4 SCSS qui .

Puoi anche usare Bower per installare i caratteri sopra. L'uso di Bower Font Awesome installa i tuoi file bower_components/components-font-awesome/e noti che Github Octicons imposta il octicons/octicons/octicons-.scssfile principale mentre devi usarlo octicons/octicons/sprockets-octicons.scss.

Tutto quanto sopra compilerà tutto il codice CSS incluso in un singolo file, che richiede solo una richiesta HTTP. In alternativa puoi anche caricare il carattere Font-Awesome da CDN, che può essere veloce anche in molte situazioni. Entrambi i caratteri su CDN includono anche i file dei caratteri (usando i dati-uri, possibilmente non supportati per i browser più vecchi). Quindi considera quale soluzione si adatta meglio alla tua situazione a seconda degli altri browser da supportare.

Per Font Awesome incolla il seguente codice nella <head>sezione HTML del tuo sito:

<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

Prova anche il generatore Yeoman per impilare un'app Web Bootstrap 4 front-end per testare Bootstrap 4 con Font Awesome o Github Octicons.

— Bass Jobsen
fonte
4
Questo è stato molto approfondito e mi ha davvero aiutato a chiarire le cose per me e indicarmi la giusta direzione da me scelta. Qualcuno sa perché BS4 ha deciso di non spedire con Glyphicon Halflings set? Solo per snellire il pacchetto?
— twknab,
6
"Installa Ruby" ?! Perché dovrei installare un intero framework di sviluppo solo per usare un font ?! E come mai lo hai appena menzionato come nota a margine? È enorme poiché cambia semantica, crea processi e dipendenze di tutto il tuo progetto solo per arrivare a un carattere! È inconcepibile per me come si possa consigliare di farlo.
— Jens Mander,
261

La migrazione da Glyphicons a Font Awesome è abbastanza semplice.

Includi un riferimento a Font Awesome (o localmente o usa il CDN).

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

Quindi esegui una ricerca e sostituisci dove cerchi glyphicon glyphicon-e sostituiscilo con fa fa-. La maggior parte dei nomi delle classi CSS sono uguali. Alcuni sono cambiati, quindi è necessario risolverli manualmente.

— Fred
fonte
27
Il modo semplice per l'integrazione senza modifiche. Grazie!
— l.cotonea,
1
Il principio KISS in azione!
— Craig,
7
Non tutti i nomi sono uguali. Questa è la mappa delle icone di glyphicon su font-awesome: gist.github.com/blowsie/15f8fe303383e361958bd53ecb7294f9
— Grigory Kislin
1
Questo è molto più semplice e diretto della risposta accettata. Complimenti!
— luis.ap.uyen,
6
fa fa-è ammortizzato. Il loro sito web ora dice fas fa-, e questo messaggio:The fa prefix has been deprecated in version 5. The new default is the fas solid style and the fab style for brands.
— James Wilkins,
37

Il file glyphicons.less da Bootstrap 3 è disponibile su GitHub. https://github.com/twbs/bootstrap/blob/master/less/glyphicons.less

Ha bisogno di queste variabili:

@icon-font-path:          "../fonts/";
@icon-font-name:          "glyphicons-halflings-regular";
@icon-font-svg-id:        "glyphicons_halflingsregular";

Quindi è possibile convertire il file .less in un file .css che è possibile utilizzare direttamente. Puoi farlo online su lesscss.org/less-preview/ . Qui l'ho fatto per te , salvarlo come glyphicons.css e includerlo nei tuoi file HTML.

<link href="https://stackoverflow.com/Content/glyphicons.css" rel="stylesheet" />

Hai anche bisogno dei caratteri Glyphicon che si trovano nel pacchetto Bootstrap 3, inseriscili in una directory / fonts /.

Ora puoi continuare a usare Glyphicons con Bootstrap 4 come al solito.

— Fred
fonte
Fred Grazie mille.
— user3728517
Fred, grazie. Le icone vengono visualizzate nei browser Firefox e Chrome. Ma in IE, le icone vengono visualizzate nella versione 11.0.9600.19377 ma non nella versione 11.0.9600.19356. Come posso rendere le icone da visualizzare in IE versione 11.0.9600.19356. Ho anche controllato la console e non ci sono errori in IE versione 11.0.9600.19356
— Hemant
@Hemant, non lo so. Ad ogni modo, questo post è molto vecchio e risalente a quando Glyphicons era alla versione 4. Oggi andrei per la versione 5.
— Fred
17

Se hai bisogno solo di classi glyphicon nei CSS: 

@font-face{font-family:'Glyphicons Halflings';src:url('https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.eot');src:url('https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),url('https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.woff') format('woff'),url('https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.ttf') format('truetype'),url('https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;}
.glyphicon-asterisk:before{content:"\2a";}
.glyphicon-plus:before{content:"\2b";}
.glyphicon-euro:before{content:"\20ac";}
.glyphicon-minus:before{content:"\2212";}
.glyphicon-cloud:before{content:"\2601";}
.glyphicon-envelope:before{content:"\2709";}
.glyphicon-pencil:before{content:"\270f";}
.glyphicon-glass:before{content:"\e001";}
.glyphicon-music:before{content:"\e002";}
.glyphicon-search:before{content:"\e003";}
.glyphicon-heart:before{content:"\e005";}
.glyphicon-star:before{content:"\e006";}
.glyphicon-star-empty:before{content:"\e007";}
.glyphicon-user:before{content:"\e008";}
.glyphicon-film:before{content:"\e009";}
.glyphicon-th-large:before{content:"\e010";}
.glyphicon-th:before{content:"\e011";}
.glyphicon-th-list:before{content:"\e012";}
.glyphicon-ok:before{content:"\e013";}
.glyphicon-remove:before{content:"\e014";}
.glyphicon-zoom-in:before{content:"\e015";}
.glyphicon-zoom-out:before{content:"\e016";}
.glyphicon-off:before{content:"\e017";}
.glyphicon-signal:before{content:"\e018";}
.glyphicon-cog:before{content:"\e019";}
.glyphicon-trash:before{content:"\e020";}
.glyphicon-home:before{content:"\e021";}
.glyphicon-file:before{content:"\e022";}
.glyphicon-time:before{content:"\e023";}
.glyphicon-road:before{content:"\e024";}
.glyphicon-download-alt:before{content:"\e025";}
.glyphicon-download:before{content:"\e026";}
.glyphicon-upload:before{content:"\e027";}
.glyphicon-inbox:before{content:"\e028";}
.glyphicon-play-circle:before{content:"\e029";}
.glyphicon-repeat:before{content:"\e030";}
.glyphicon-refresh:before{content:"\e031";}
.glyphicon-list-alt:before{content:"\e032";}
.glyphicon-flag:before{content:"\e034";}
.glyphicon-headphones:before{content:"\e035";}
.glyphicon-volume-off:before{content:"\e036";}
.glyphicon-volume-down:before{content:"\e037";}
.glyphicon-volume-up:before{content:"\e038";}
.glyphicon-qrcode:before{content:"\e039";}
.glyphicon-barcode:before{content:"\e040";}
.glyphicon-tag:before{content:"\e041";}
.glyphicon-tags:before{content:"\e042";}
.glyphicon-book:before{content:"\e043";}
.glyphicon-print:before{content:"\e045";}
.glyphicon-font:before{content:"\e047";}
.glyphicon-bold:before{content:"\e048";}
.glyphicon-italic:before{content:"\e049";}
.glyphicon-text-height:before{content:"\e050";}
.glyphicon-text-width:before{content:"\e051";}
.glyphicon-align-left:before{content:"\e052";}
.glyphicon-align-center:before{content:"\e053";}
.glyphicon-align-right:before{content:"\e054";}
.glyphicon-align-justify:before{content:"\e055";}
.glyphicon-list:before{content:"\e056";}
.glyphicon-indent-left:before{content:"\e057";}
.glyphicon-indent-right:before{content:"\e058";}
.glyphicon-facetime-video:before{content:"\e059";}
.glyphicon-picture:before{content:"\e060";}
.glyphicon-map-marker:before{content:"\e062";}
.glyphicon-adjust:before{content:"\e063";}
.glyphicon-tint:before{content:"\e064";}
.glyphicon-edit:before{content:"\e065";}
.glyphicon-share:before{content:"\e066";}
.glyphicon-check:before{content:"\e067";}
.glyphicon-move:before{content:"\e068";}
.glyphicon-step-backward:before{content:"\e069";}
.glyphicon-fast-backward:before{content:"\e070";}
.glyphicon-backward:before{content:"\e071";}
.glyphicon-play:before{content:"\e072";}
.glyphicon-pause:before{content:"\e073";}
.glyphicon-stop:before{content:"\e074";}
.glyphicon-forward:before{content:"\e075";}
.glyphicon-fast-forward:before{content:"\e076";}
.glyphicon-step-forward:before{content:"\e077";}
.glyphicon-eject:before{content:"\e078";}
.glyphicon-chevron-left:before{content:"\e079";}
.glyphicon-chevron-right:before{content:"\e080";}
.glyphicon-plus-sign:before{content:"\e081";}
.glyphicon-minus-sign:before{content:"\e082";}
.glyphicon-remove-sign:before{content:"\e083";}
.glyphicon-ok-sign:before{content:"\e084";}
.glyphicon-question-sign:before{content:"\e085";}
.glyphicon-info-sign:before{content:"\e086";}
.glyphicon-screenshot:before{content:"\e087";}
.glyphicon-remove-circle:before{content:"\e088";}
.glyphicon-ok-circle:before{content:"\e089";}
.glyphicon-ban-circle:before{content:"\e090";}
.glyphicon-arrow-left:before{content:"\e091";}
.glyphicon-arrow-right:before{content:"\e092";}
.glyphicon-arrow-up:before{content:"\e093";}
.glyphicon-arrow-down:before{content:"\e094";}
.glyphicon-share-alt:before{content:"\e095";}
.glyphicon-resize-full:before{content:"\e096";}
.glyphicon-resize-small:before{content:"\e097";}
.glyphicon-exclamation-sign:before{content:"\e101";}
.glyphicon-gift:before{content:"\e102";}
.glyphicon-leaf:before{content:"\e103";}
.glyphicon-eye-open:before{content:"\e105";}
.glyphicon-eye-close:before{content:"\e106";}
.glyphicon-warning-sign:before{content:"\e107";}
.glyphicon-plane:before{content:"\e108";}
.glyphicon-random:before{content:"\e110";}
.glyphicon-comment:before{content:"\e111";}
.glyphicon-magnet:before{content:"\e112";}
.glyphicon-chevron-up:before{content:"\e113";}
.glyphicon-chevron-down:before{content:"\e114";}
.glyphicon-retweet:before{content:"\e115";}
.glyphicon-shopping-cart:before{content:"\e116";}
.glyphicon-folder-close:before{content:"\e117";}
.glyphicon-folder-open:before{content:"\e118";}
.glyphicon-resize-vertical:before{content:"\e119";}
.glyphicon-resize-horizontal:before{content:"\e120";}
.glyphicon-hdd:before{content:"\e121";}
.glyphicon-bullhorn:before{content:"\e122";}
.glyphicon-certificate:before{content:"\e124";}
.glyphicon-thumbs-up:before{content:"\e125";}
.glyphicon-thumbs-down:before{content:"\e126";}
.glyphicon-hand-right:before{content:"\e127";}
.glyphicon-hand-left:before{content:"\e128";}
.glyphicon-hand-up:before{content:"\e129";}
.glyphicon-hand-down:before{content:"\e130";}
.glyphicon-circle-arrow-right:before{content:"\e131";}
.glyphicon-circle-arrow-left:before{content:"\e132";}
.glyphicon-circle-arrow-up:before{content:"\e133";}
.glyphicon-circle-arrow-down:before{content:"\e134";}
.glyphicon-globe:before{content:"\e135";}
.glyphicon-tasks:before{content:"\e137";}
.glyphicon-filter:before{content:"\e138";}
.glyphicon-fullscreen:before{content:"\e140";}
.glyphicon-dashboard:before{content:"\e141";}
.glyphicon-heart-empty:before{content:"\e143";}
.glyphicon-link:before{content:"\e144";}
.glyphicon-phone:before{content:"\e145";}
.glyphicon-usd:before{content:"\e148";}
.glyphicon-gbp:before{content:"\e149";}
.glyphicon-sort:before{content:"\e150";}
.glyphicon-sort-by-alphabet:before{content:"\e151";}
.glyphicon-sort-by-alphabet-alt:before{content:"\e152";}
.glyphicon-sort-by-order:before{content:"\e153";}
.glyphicon-sort-by-order-alt:before{content:"\e154";}
.glyphicon-sort-by-attributes:before{content:"\e155";}
.glyphicon-sort-by-attributes-alt:before{content:"\e156";}
.glyphicon-unchecked:before{content:"\e157";}
.glyphicon-expand:before{content:"\e158";}
.glyphicon-collapse-down:before{content:"\e159";}
.glyphicon-collapse-up:before{content:"\e160";}
.glyphicon-log-in:before{content:"\e161";}
.glyphicon-flash:before{content:"\e162";}
.glyphicon-log-out:before{content:"\e163";}
.glyphicon-new-window:before{content:"\e164";}
.glyphicon-record:before{content:"\e165";}
.glyphicon-save:before{content:"\e166";}
.glyphicon-open:before{content:"\e167";}
.glyphicon-saved:before{content:"\e168";}
.glyphicon-import:before{content:"\e169";}
.glyphicon-export:before{content:"\e170";}
.glyphicon-send:before{content:"\e171";}
.glyphicon-floppy-disk:before{content:"\e172";}
.glyphicon-floppy-saved:before{content:"\e173";}
.glyphicon-floppy-remove:before{content:"\e174";}
.glyphicon-floppy-save:before{content:"\e175";}
.glyphicon-floppy-open:before{content:"\e176";}
.glyphicon-credit-card:before{content:"\e177";}
.glyphicon-transfer:before{content:"\e178";}
.glyphicon-cutlery:before{content:"\e179";}
.glyphicon-header:before{content:"\e180";}
.glyphicon-compressed:before{content:"\e181";}
.glyphicon-earphone:before{content:"\e182";}
.glyphicon-phone-alt:before{content:"\e183";}
.glyphicon-tower:before{content:"\e184";}
.glyphicon-stats:before{content:"\e185";}
.glyphicon-sd-video:before{content:"\e186";}
.glyphicon-hd-video:before{content:"\e187";}
.glyphicon-subtitles:before{content:"\e188";}
.glyphicon-sound-stereo:before{content:"\e189";}
.glyphicon-sound-dolby:before{content:"\e190";}
.glyphicon-sound-5-1:before{content:"\e191";}
.glyphicon-sound-6-1:before{content:"\e192";}
.glyphicon-sound-7-1:before{content:"\e193";}
.glyphicon-copyright-mark:before{content:"\e194";}
.glyphicon-registration-mark:before{content:"\e195";}
.glyphicon-cloud-download:before{content:"\e197";}
.glyphicon-cloud-upload:before{content:"\e198";}
.glyphicon-tree-conifer:before{content:"\e199";}
.glyphicon-tree-deciduous:before{content:"\e200";}
.glyphicon-briefcase:before{content:"\1f4bc";}
.glyphicon-calendar:before{content:"\1f4c5";}
.glyphicon-pushpin:before{content:"\1f4cc";}
.glyphicon-paperclip:before{content:"\1f4ce";}
.glyphicon-camera:before{content:"\1f4f7";}
.glyphicon-lock:before{content:"\1f512";}
.glyphicon-bell:before{content:"\1f514";}
.glyphicon-bookmark:before{content:"\1f516";}
.glyphicon-fire:before{content:"\1f525";}
.glyphicon-wrench:before{content:"\1f527";}
Espandi frammento

— Роман Будённый
fonte
Ha funzionato come un piacere per me! Grazie!
— theshadow124
3

Per le persone che sono alla ricerca di soluzioni one-liner, è possibile importare solo Glyphicons Bootstrap:

<link href="https://stackoverflow.com//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" rel="stylesheet">
— R. Gurung
fonte
Rompe molte altre cose
— Bob Claerhout il
Mi piacerebbe saperne di più. @BobClaerhout
— R. Gurung,
2 cose che ricordo: cambio di font e bootprap datepicker ( bootstrap-datepicker.readthedocs.io/en/latest ) perde il suo bel formato
— Bob Claerhout
2

Panoramica:

Sto usando bootstrap 4 senza glifi. Ho riscontrato un problema con il treeview bootstrap che dipende dai glifi. Sto usando treeview così com'è, e sto usando scss @extend per tradurre gli stili di classe delle icone in caratteri di classe fantastici. Penso che sia abbastanza fluido (se me lo chiedi)!

Dettagli:

Ho usato scss @extend per gestirlo per me.

In precedenza avevo deciso di utilizzare font-awesome senza una ragione migliore di come l'ho usato in passato.

Quando sono andato a provare il bootstrap treeview, ho scoperto che mancavano le icone, perché non avevo i glyphicon installati.

Ho deciso di utilizzare la funzione scss @extend, per fare in modo che le classi glyphicon utilizzino le classi font-awesome in questo modo:

.treeview {
  .glyphicon {
    @extend .fa;
  }
  .glyphicon-minus {
    @extend .fa-minus;
  }
  .glyphicon-plus {
    @extend .fa-plus;
  }
}
— Siti Web Taylored
fonte
2

Se stai usando Laravel 5.6, viene fornito con Bootstrap 4. Tutto ciò che devi fare è:

npm install and npm install open-iconic --save

A /resources/assets/sass/app.scsscambiare la riga di importazione dei font di Google sulla riga 2 in

@import '~open-iconic/font/css/open-iconic-bootstrap';

Tutto quello che devi fare ora è

npm run watch

e includere 

<link rel="stylesheet" href="{{asset('css/app.css')}}">

sopra il file del master blade e <script src="{{asset('js/app.js')}}"></script>prima di chiudere il tag body. Otterrai Bootstrap 4 e l'icona.

L'uso è <span class="oi oi-cog"></span>

Fare riferimento qui per i dettagli dell'icona: Open Iconic: consigliato da Bootstrap 4

Se su un progetto diverso da Laravel, puoi semplicemente importare @import 'node_modules/open-iconic/font/css/open-iconic-bootstrap-min.css';nel tuo file di stile.

Spero che questo ti aiuti. Buon tentativo.

— Ershad Ahamed
fonte
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.