Commit 81e034fd authored by Pietro Albini's avatar Pietro Albini

Initial commit

parents
This diff is collapsed.
# Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
#
# This program is free software: you can redistribute it and/or modify it
# under the terms of the GNU Affero General Public License as published by the
# Free Software Foundation, either version 3 of the License, or (at your
# option) any later version.
#
# This program is distributed in the hope that it will be useful, but WITHOUT
# ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
# FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
# for more details.
#
# You should have received a copy of the GNU Affero General Public License
# along with this program. If not, see <http://www.gnu.org/licenses/>.
SCSS = python3 -mscss
JSMIN = python3 -mrjsmin
DIR_SCSS = scss
DIR_JS = js
.PHONY: build clean
build: build/theme.css build/theme.js
clean:
@rm -rf build
build/theme.css: $(shell find $(DIR_SCSS) -name "*.scss")
@mkdir -p $(dir $@)
@$(SCSS) -I$(DIR_SCSS) < $(DIR_SCSS)/theme.scss > $@
build/theme.js: $(shell find $(DIR_JS) -name "*.js")
@mkdir -p $(dir $@)
@cat $^ | $(JSMIN) > $@
# Tema "italy"
Questo repository contiene "italy", il nuovo tema dei siti web di Ubuntu-it. Il
tema è rilasciato sotto licenza AGPLv3+.
È presente una demo all'interno del repository, che può essere visualizzata
dopo aver fatto una build del tema semplicemente aprendo il file `demo.html`
nel proprio browser.
## Building
Per fare una build del tema, è necessario avere installati `make`,
`python3-rjsmin` e `python3-pyscss`. Una volta installate le dipendenze basta
eseguire:
```
$ make
```
I file del tema verranno salvati in `build/`.
<!DOCTYPE html>
<!--
Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
This program is free software: you can redistribute it and/or modify it
under the terms of the GNU Affero General Public License as published by the
Free Software Foundation, either version 3 of the License, or (at your
option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
-->
<html lang="it">
<head>
<meta charset="utf-8">
<meta name="viewport" content="device-width">
<title>Demo - Tema di Ubuntu-it</title>
<link rel="stylesheet" href="https://static.ubuntu-it.org/fonts/ubuntu/include.min.css">
<link rel="stylesheet" href="build/theme.css">
</head>
<body>
<div class="cookie-policy hidden">
<div class="container">
<span>
Questo sito utilizza i cookie per offrirti un'esperienza
migliore. Continuando a navigare ne accetti l'uso.
</span>
<a href="#" id="ubuntuit-cookiepolicy-hide">OK</a>
<a href="#">Maggiori informazioni</a>
</div>
</div>
<nav class="sites-list">
<div class="container">
<ul>
<li><a href="#" class="active">Sito web</a></li>
<li><a href="#">Wiki</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Chiedi</a></li>
<li><a href="#">Chat</a></li>
<li><a href="#">Cerca</a></li>
<li><a href="#">Planet</a></li>
<li class="right"><a href="#">Telegram</a></li>
<li class="right"><a href="#">YouTube</a></li>
<li class="right"><a href="#">Google+</a></li>
<li class="right"><a href="#">Twitter</a></li>
<li class="right"><a href="#">Facebook</a></li>
</ul>
</div>
</nav>
<nav class="main-navbar">
<div class="container">
<ul>
<li class="site-name"><a href="#">ubuntu-it</a></li>
<li><a href="#">Download</a></li>
<li><a href="#" class="active">Scopri Ubuntu</a></li>
<li><a href="#">Comunita</a></li>
<li><a href="#">Contatti</a></li>
</ul>
</div>
</nav>
<nav>
<div class="container">
<ul>
<li><a href="#">Desktop e portatili</a></li>
<li><a href="#">Server e cloud</a></li>
<li><a href="#">Derivate</a></li>
</ul>
</div>
</nav>
<div class="container">
<div class="page">
<div class="row">
<h1>Demo del tema di Ubuntu-it</h1>
<p><a href="#" onclick="ubuntuit_cookiepolicy_clear()">
Mostra banner cookie policy
</a></p>
</div>
<div class="row">
<h1>Tipografia</h1>
<p>
Sunt vitae recusandae laborum. Qui consequatur
laudantium illo corporis. Quia quidem occaecati
corporis libero a saepe. Recusandae quis deleniti
debitis non. Nihil molestiae autem ratione doloremque
sit quaerat consequuntur. Velit minus aut et
voluptatem. Dolorem explicabo commodi ullam in iusto
at reiciendis. Eaque quibusdam ad et dolores. Qui
numquam nemo est fuga quia animi impedit enim.
</p>
<p>
Sunt vitae recusandae laborum. Qui consequatur
laudantium illo corporis. Quia quidem occaecati
corporis libero a saepe. Recusandae quis deleniti
debitis non. Nihil molestiae autem ratione doloremque
sit quaerat consequuntur. Velit minus aut et
voluptatem. Dolorem explicabo commodi ullam in iusto
at reiciendis. Eaque quibusdam ad et dolores. Qui
numquam nemo est fuga quia animi impedit enim.
</p>
<h2>Titolo h2</h2>
<p>
Sunt vitae recusandae laborum. Qui consequatur
laudantium illo corporis. Quia quidem occaecati
corporis libero a saepe. Recusandae quis deleniti
debitis non. Nihil molestiae autem ratione doloremque
sit quaerat consequuntur. Velit minus aut et
voluptatem. Dolorem explicabo commodi ullam in iusto
at reiciendis. Eaque quibusdam ad et dolores. Qui
numquam nemo est fuga quia animi impedit enim.
</p>
<h3>Titolo h3</h3>
<p>
Sunt vitae recusandae laborum. Qui consequatur
laudantium illo corporis. Quia quidem occaecati
corporis libero a saepe. Recusandae quis deleniti
debitis non. Nihil molestiae autem ratione doloremque
sit quaerat consequuntur. Velit minus aut et
voluptatem. Dolorem explicabo commodi ullam in iusto
at reiciendis. Eaque quibusdam ad et dolores. Qui
numquam nemo est fuga quia animi impedit enim.
</p>
<h4>Titolo h4</h4>
<p>
Sunt vitae recusandae laborum. Qui consequatur
laudantium illo corporis. Quia quidem occaecati
corporis libero a saepe. Recusandae quis deleniti
debitis non. Nihil molestiae autem ratione doloremque
sit quaerat consequuntur. Velit minus aut et
voluptatem. Dolorem explicabo commodi ullam in iusto
at reiciendis. Eaque quibusdam ad et dolores. Qui
numquam nemo est fuga quia animi impedit enim.
</p>
</div>
</div>
<footer>
<p>
Ubuntu e Canonical sono marchi registrati da Canonical
Ltd.
</p>
<p>
Tema realizzato dal Gruppo Web di Ubuntu-it.
</p>
<ul>
<li><a href="https://code.ubuntu-it.org/ubuntu-it-web/italy-theme/issues">
Segnala un problema
</a></li>
<li><a href="https://code.ubuntu-it.org/ubuntu-it-web/italy-theme">
Codice sorgente
</a></li>
<li><a href="https://wiki.ubuntu-it.org/GruppoWeb">
Collabora con noi
</a></li>
</ul>
</footer>
</div>
<script type="text/javascript" src="build/theme.js"></script>
</body>
</html>
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
function ubuntuit_cookiepolicy_hide() {
var banners = document.querySelectorAll(".cookie-policy");
for (var i = 0; i < banners.length; i++) {
banners[i].classList.add("hidden");
}
};
function ubuntuit_cookiepolicy_show() {
var banners = document.querySelectorAll(".cookie-policy");
for (var i = 0; i < banners.length; i++) {
banners[i].classList.remove("hidden");
}
};
function ubuntuit_cookiepolicy_accept() {
window.localStorage.setItem("ubuntuit-cookiepolicy-accepted", true);
ubuntuit_cookiepolicy_hide();
};
function ubuntuit_cookiepolicy_clear() {
window.localStorage.removeItem("ubuntuit-cookiepolicy-accepted");
ubuntuit_cookiepolicy_show();
};
function ubuntuit_cookiepolicy_init() {
document.getElementById("ubuntuit-cookiepolicy-hide")
.addEventListener("click", function(e) {
e.preventDefault();
ubuntuit_cookiepolicy_accept();
});
if (window.localStorage.getItem("ubuntuit-cookiepolicy-accepted") === null) {
ubuntuit_cookiepolicy_show();
}
};
ubuntuit_cookiepolicy_init();
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
* {
box-sizing: border-box;
}
body {
background: mix(white, $color_warm_gray, 80%);
color: $color_text_gray;
font-family: "Ubuntu", sans-serif;
font-weight: 300;
margin: 0;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 400;
margin: 1em 0 0.5em 0;
}
p {
line-height: 1.4em;
margin: 1em 0;
}
a {
color: $color_orange;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.container {
max-width: $page_size;
margin: auto;
}
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
div.cookie-policy {
background: $color_cool_gray;
color: $color_warm_gray;
font-size: 0.9em;
line-height: 1.4em;
&:after {
clear: both;
content: "";
height: 0;
display: block;
visibility: hidden;
}
&.hidden {
display: none;
}
.container {
padding: 0.6em 0.4em;
}
a {
display: inline-block;
float: right;
margin: 0 0.5em;
}
@media all and (max-width: $page_size) {
text-align: center;
.container {
padding: 0.5em;
}
span {
display: block;
}
a {
float: none;
margin: 0.2em 0.3em;
}
}
}
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
footer {
color: mix(#000, $color_warm_gray, 5%);
margin: 1.5rem 0;
font-size: 0.85em;
font-weight: 400;
text-align: center;
a {
color: mix(#000, $color_warm_gray, 40%);
}
p {
margin: 0.3em;
}
ul {
margin: 0.3em;
padding: 0;
li {
margin: 0 0 0 1em;
display: inline-block;
&:first-child {
margin-left: 0;
}
}
}
}
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
@mixin navbar-style($background, $color, $hover_color) {
background: $background;
ul li {
background: $background;
border-right: 0.1em solid mix(#000, $background, 5%);
border-left: 0.1em solid mix(#000, $background, 5%);
a {
color: $color;
&:hover, &.active {
color: $hover_color;
background: mix(#fff, $background, 10%);
}
}
&.site-name {
border-left: 0;
a:hover, a.active {
background: $background;
}
}
}
}
nav {
box-shadow: 0 0.15em 0.15em rgba(100, 100, 100, 0.1);
ul {
padding: 0;
margin: 0;
li {
padding: 0;
padding-right: 0.1em;
margin: 0;
margin-left: -0.1em;
display: block;
float: left;
a {
display: inline-block;
font-size: 0.9em;
padding: 0.9em 0.7em;
text-decoration: none;
&:hover {
text-decoration: none;
}
}
&.right {
float: right;
}
&.site-name a {
font-size: 1.4em;
padding: 0.45em 0.7em 0.45em 0.4em;
line-height: 100%;
}
}
&:after {
clear: both;
content: "";
height: 0;
visibility: hidden;
display: block;
}
}
@include navbar-style(
mix(#fff, $color_warm_gray, 90%),
mix(#000, $color_warm_gray, 40%),
mix(#000, $color_warm_gray, 60%)
);
&.main-navbar {
font-weight: 400;
@include navbar-style($color_orange, #fff, #fff);
}
&.sites-list {
font-size: 0.8em;
@include navbar-style($color_cool_gray, $color_warm_gray, #fff);
ul li a {
padding: 0.5em 0.7em;
&:hover, &.active {
background: $color_cool_gray;
}
}
}
}
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
div.page {
background: #fff;
border-radius: 0.2em;
box-shadow: 0 0.2em 0.2em rgba(100, 100, 100, 0.1);
margin: 1.5em 0;
div.row {
border-top: 0.1em dotted $color_warm_gray;
padding: 2em;
&:first-child {
border-top: 0;
}
& > *:first-child {
margin-top: 0 !important;
}
& > *:last-child {
margin-bottom: 0 !important;
}
}
@media all and (max-width: $page_size) {
border-radius: 0;
div.row {
padding: 2em 1em;
}
}
}
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
$color_orange: #e95420;
$color_warm_gray: #aea79f;
$color_cool_gray: #333;
$color_text_gray: #111;
$page_size: 60rem;
/* Copyright (C) 2018 Pietro Albini <pietroalbini@ubuntu.com>
*
* This program is free software: you can redistribute it and/or modify it
* under the terms of the GNU Affero General Public License as published by the
* Free Software Foundation, either version 3 of the License, or (at your
* option) any later version.
*
* This program is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
* for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
@import "variables";
@import "base";
@import "cookiepolicy";
@import "navbar";
@import "page";
@import "footer";
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment