Mete o aspecto bonitinho, falta acessibilidade
This commit is contained in:
parent
d9a036d2b9
commit
bf63471dd1
@ -2,6 +2,7 @@ baseURL = 'http://example.org/'
|
||||
languageCode = 'pt-pt'
|
||||
defaultContentLanguage = "pt"
|
||||
title = "DRM Portugal"
|
||||
summaryLength = 20
|
||||
|
||||
[markup.goldmark.renderer]
|
||||
unsafe= true
|
||||
|
||||
@ -3,9 +3,15 @@ title: "2016: um ano cheio de DRM"
|
||||
author: Marcos Marado
|
||||
date: 2016-12-01 21:49:00
|
||||
categories:
|
||||
- Legislação
|
||||
tags:
|
||||
- CETA
|
||||
- 2016
|
||||
- BE
|
||||
- directiva
|
||||
- DRM
|
||||
- Governo
|
||||
- Parlamento
|
||||
- PCP
|
||||
- W3C
|
||||
---
|
||||
|
||||
2016 tem sido um ano bastante activo no que diz respeito ao DRM.
|
||||
|
||||
BIN
content/artigos/alteracoes-ao-uso-de-drm-em-portugal/capa.png
Normal file
BIN
content/artigos/alteracoes-ao-uso-de-drm-em-portugal/capa.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
@ -2,7 +2,7 @@
|
||||
title: Alterações ao uso de DRM em Portugal
|
||||
author: Marcos Marado
|
||||
date: 2023-04-30 13:20:00
|
||||
categoria:
|
||||
categories:
|
||||
- Legislação
|
||||
tags:
|
||||
- directiva
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: ANSOL e AEL organizam demonstração contra algemas digitais no encontro da W3C
|
||||
author: Marcos Marado
|
||||
date: 2016-09-08 23:29
|
||||
date: 2016-09-08 23:29:00
|
||||
categories:
|
||||
- Legislação
|
||||
- Protesto
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: "Diga à HP: Não ao DRM!"
|
||||
author: Marcos Marado
|
||||
date: 2016-10-02 18:18
|
||||
date: 2016-10-02 18:18:00
|
||||
---
|
||||
|
||||
A HP activou recentemente uma funcionalidade secreta nas suas impressoras
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
---
|
||||
title: HTML, EME e Normas Abertas
|
||||
author: Marcos Marado
|
||||
date: 2016-09-18 20:26
|
||||
date: 2016-09-18 20:26:00
|
||||
carrousel: true
|
||||
categories:
|
||||
- Factos
|
||||
- HTML
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: "O CETA e o DRM"
|
||||
author: Marcos Marado
|
||||
date: 2016-10-16 21:07
|
||||
date: 2016-10-16 21:07:00
|
||||
categories:
|
||||
- Legislação
|
||||
tags:
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
---
|
||||
title: O DRM impede a utilização educativa
|
||||
author: Paula Simões
|
||||
date: 2013-04-25 17:59
|
||||
date: 2013-04-25 17:59:00
|
||||
carrousel: true
|
||||
categories:
|
||||
- Factos
|
||||
---
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: O DRM não impede a pirataria
|
||||
author: Paula Simões
|
||||
date: 2013-04-20 23:17:00
|
||||
carrousel: true
|
||||
categories:
|
||||
- Factos
|
||||
tags:
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: "Parlamento aprova projeto de lei que resolve #DRM #FixCopyright #PublicDomain"
|
||||
author: Paula Simões
|
||||
date: 2017-04-08 20:49:00
|
||||
destaque: true
|
||||
categories:
|
||||
- Legislação
|
||||
tags:
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
title: Social DRM
|
||||
author: Marcos Marado
|
||||
date: 2013-04-21 17:59
|
||||
date: 2013-04-21 17:59:00
|
||||
categories:
|
||||
- DRM Social
|
||||
---
|
||||
|
||||
@ -3,12 +3,8 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
|
||||
<style>
|
||||
body { max-width: 600px; margin: 0 auto; }
|
||||
img { max-width: 100%; }
|
||||
blockquote { clear: both; }
|
||||
hr { clear: both; }
|
||||
</style>
|
||||
<link href="/styles.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" id="leaf-google-fonts-css" href="https://fonts.googleapis.com/css?family=Oswald:400|PT+Sans:400,700,400italic" type="text/css" media="all">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
@ -31,23 +27,55 @@ hr { clear: both; }
|
||||
</main>
|
||||
|
||||
<aside>
|
||||
{{ $articles := (where .Site.RegularPages "Section" "artigos") }}
|
||||
<section aria-labelled-by="artigos-recentes">
|
||||
<h2 id="artigos-recentes">Artigos recentes</h2>
|
||||
<h2 id="artigos-recentes"><span>Artigos recentes</span></h2>
|
||||
|
||||
{{ $recent := (first 5 (sort $articles "Date" "desc")) }}
|
||||
<ul>
|
||||
{{ range $recent }}
|
||||
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
||||
</section>
|
||||
<section aria-labelled-by="links">
|
||||
<h2 id="links">Links</h2>
|
||||
</section>
|
||||
<section aria-labelled-by="comentarios-recentes">
|
||||
<h2 id="comentarios-recentes">Comentários Recentes</h2>
|
||||
<h2 id="links"><span>Links</span></h2>
|
||||
|
||||
<ul>
|
||||
<li><a href="https://ansol.org/">ANSOL - Associação Nacional para o Software Livre</a></li>
|
||||
<li><a href="https://ensinolivre.pt/">AEL - Associação Ensino Livre</a></li>
|
||||
<li><a href="https://direitosdigitais.pt/">D3: Defesa dos Direitos Digitais</a></li>
|
||||
<li><a href="https://defectivebydesign.org/">Defective By Design</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section aria-labelled-by="arquivo">
|
||||
<h2 id="arquivo">Arquivo</h2>
|
||||
<h2 id="arquivo"><span>Arquivo</span></h2>
|
||||
|
||||
<ul>
|
||||
{{ range ($articles.GroupByDate "2006-01") }}
|
||||
<li><a href="">{{ time.Format "January 2006" (index .Pages 0).Date }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</section>
|
||||
<section aria-labelled-by="categorias">
|
||||
<h2 id="categorias">Categorias</h2>
|
||||
<h2 id="categorias"><span>Categorias</span></h2>
|
||||
|
||||
<ul>
|
||||
{{ range $name, $taxonomy := .Site.Taxonomies.categories }}
|
||||
{{ with $.Site.GetPage (printf "/categories/%s" $name) }}
|
||||
<li><a href="{{ .Permalink }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</ul>
|
||||
</section>
|
||||
<section aria-labelled-by="meta">
|
||||
<h2 id="meta">Meta</h2>
|
||||
<h2 id="meta"><span>Meta</span></h2>
|
||||
|
||||
<ul>
|
||||
<li><a href="">Feed de notícias</a></li>
|
||||
<li><a href="https://gohugo.io">Hugo - Ferramenta de geração de websites</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
</aside>
|
||||
|
||||
|
||||
@ -1,6 +1,23 @@
|
||||
{{ define "main" }}
|
||||
lista:
|
||||
<h1>Arquivos da categoria: {{ .Name }}</h1>
|
||||
<ul class='articles detailed'>
|
||||
{{ range .Pages }}
|
||||
<p><a href="{{ .Permalink }}">{{ .Title }}</a></p>
|
||||
<li>
|
||||
{{ $cover := (index (.Resources.ByType "image") 0) }}
|
||||
{{ if $cover }}
|
||||
<img src="{{ $cover.Permalink }}" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
{{ end }}
|
||||
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
|
||||
<div class='summary'>
|
||||
{{ .Summary }}
|
||||
</div>
|
||||
|
||||
<p class='readmore'><a href="{{ .Permalink }}">Ler artigo completo →</a></p>
|
||||
|
||||
{{ partial "byline.html" . }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
|
||||
@ -2,29 +2,22 @@
|
||||
{{ .Title }} | {{ .Site.Title }}
|
||||
{{ end }}
|
||||
{{ define "main" }}
|
||||
<article>
|
||||
<h1>{{ .Title }}</h1>
|
||||
|
||||
<img src="./capa.jpg" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
<img src="./capa.png" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
<img src="./capa.gif" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
{{ $cover := (index (.Resources.ByType "image") 0) }}
|
||||
{{ if $cover }}
|
||||
<figure class='cover'>
|
||||
<img src="{{ $cover.Permalink }}" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
<figcaption>{{ .Params.covercaption }}</figcaption>
|
||||
</figure>
|
||||
{{ end }}
|
||||
|
||||
{{ .Content }}
|
||||
|
||||
{{ if (eq .Section "artigos") }}
|
||||
<hr>
|
||||
<p>
|
||||
Publicado por {{ .Params.author }}
|
||||
//
|
||||
{{ if .Params.categories }}
|
||||
{{ range $index, $name := .Params.categories }}
|
||||
{{ $name }}{{ if ne (add $index 1) (len $.Params.categories) }}, {{ end }}
|
||||
{{ partial "byline.html" . }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
Sem categoria
|
||||
{{ end }}
|
||||
//
|
||||
<a href="{{ .Permalink }}">{{ time.Format "02 de January, 2006" .Date }}</a>
|
||||
</p>
|
||||
{{ end }}
|
||||
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
89
layouts/index.html
Normal file
89
layouts/index.html
Normal file
@ -0,0 +1,89 @@
|
||||
{{ define "main" }}
|
||||
|
||||
{{ $articles := (where .Site.RegularPages "Params.carrousel" true) }}
|
||||
{{ $len := len $articles }}
|
||||
|
||||
<div class='carrousel'>
|
||||
{{ range $index, $article := $articles }}
|
||||
<input class='carrousel-control' type='radio' name='carrousel' id='v{{ $index }}' {{ if (eq $index 0) }}checked{{ end }} />
|
||||
{{ end }}
|
||||
|
||||
<div class='carrousel-controls'>
|
||||
{{ range $index, $article := $articles }}
|
||||
<label class='carrousel-visible-control' for="v{{ $index }}"></label>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
{{ range $index, $article := $articles }}
|
||||
{{ with $article }}
|
||||
<li class="item item{{ $index }}">
|
||||
{{ $cover := (index (.Resources.ByType "image") 0) }}
|
||||
<a href="{{ .Permalink }}">
|
||||
<img src="{{ $cover.Permalink }}" alt="" />
|
||||
{{ $next := (mod (add $index 1) $len) }}
|
||||
{{ $prev := (mod (add $index $len -1) $len) }}
|
||||
<label class='nav prev' for="v{{ $prev }}"></label>
|
||||
<label class='nav next' for="v{{ $next }}"></label>
|
||||
|
||||
<h2>{{ .Title }}</h2>
|
||||
|
||||
<div class='summary'>
|
||||
{{ truncate 230 "..." .Summary }}
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<h1 class='with-divider'><span>Em destaque</span></h1>
|
||||
{{ $articles := (where .Site.RegularPages "Params.destaque" true) }}
|
||||
<ul class='articles'>
|
||||
{{ range $articles }}
|
||||
<li>
|
||||
{{ $cover := (index (.Resources.ByType "image") 0) }}
|
||||
{{ if $cover }}
|
||||
<img src="{{ $cover.Permalink }}" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
{{ end }}
|
||||
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
|
||||
<div class='summary'>
|
||||
{{ .Summary }}
|
||||
</div>
|
||||
|
||||
<p class='readmore'><a href="{{ .Permalink }}">Ler artigo completo →</a></p>
|
||||
|
||||
{{ partial "byline.html" . }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
||||
<h2 class='with-divider'><span>Mais artigos</span></h2>
|
||||
{{ $articles := (where .Site.RegularPages "Section" "artigos") }}
|
||||
|
||||
{{ $recent := (first 5 (sort $articles "Date" "desc")) }}
|
||||
<ul class='articles'>
|
||||
{{ range $recent }}
|
||||
<li>
|
||||
{{ $cover := (index (.Resources.ByType "image") 0) }}
|
||||
{{ if $cover }}
|
||||
<img src="{{ $cover.Permalink }}" alt="{{ .Params.coverdescription }}" title="{{ .Params.coverdescription }}" />
|
||||
{{ end }}
|
||||
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
|
||||
<div class='summary'>
|
||||
{{ .Summary }}
|
||||
</div>
|
||||
|
||||
<p class='readmore'><a href="{{ .Permalink }}">Ler artigo completo →</a></p>
|
||||
|
||||
{{ partial "byline.html" . }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
14
layouts/partials/byline.html
Normal file
14
layouts/partials/byline.html
Normal file
@ -0,0 +1,14 @@
|
||||
<p class='byline'>
|
||||
Publicado por {{ .Params.author }}
|
||||
//
|
||||
{{ if .Params.categories }}
|
||||
{{ range $index, $name := .Params.categories }}
|
||||
{{ $name }}{{ if ne (add $index 1) (len $.Params.categories) }}, {{ end }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
Sem categoria
|
||||
{{ end }}
|
||||
//
|
||||
<a href="{{ .Permalink }}">{{ time.Format "02 de January, 2006" .Date }}</a>
|
||||
</p>
|
||||
|
||||
BIN
static/img/carrousel-nav.png
Normal file
BIN
static/img/carrousel-nav.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1003 B |
219
static/styles.css
Normal file
219
static/styles.css
Normal file
@ -0,0 +1,219 @@
|
||||
html { padding: 0; margin: 0; }
|
||||
body {
|
||||
font-family: "PT Sans", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
max-width: 980px;
|
||||
margin: 1rem auto;
|
||||
display: grid;
|
||||
box-shadow: 0 0px 8px rgba(150, 150, 150, 0.4);
|
||||
padding: 1rem;
|
||||
color: #444;
|
||||
|
||||
grid-template-areas: "header header" "navigation navigation" "main sidebar" "footer footer";
|
||||
grid-template-columns: 65% 30%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
header { grid-area: header; }
|
||||
nav { grid-area: navigation; }
|
||||
main { grid-area: main; }
|
||||
aside { grid-area: sidebar; }
|
||||
footer { grid-area: footer; }
|
||||
|
||||
a:hover { color: #C4302B; }
|
||||
a, a:visited { color: #333; }
|
||||
|
||||
h1, h2 {
|
||||
font-family: 'Oswald', Helvetica, Arial, sans-serif;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 { font-size: 24px; }
|
||||
aside h2 {
|
||||
text-transform: uppercase;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
||||
aside { border-left: 1px solid #ccc; padding-left: 1rem; }
|
||||
|
||||
aside section { margin-bottom: 2rem; }
|
||||
|
||||
aside ul { list-style-type: none; padding: 0; }
|
||||
aside ul li { margin-bottom: 0.5rem; }
|
||||
|
||||
figure.cover { text-align: center; }
|
||||
figure.cover img { max-width: auto; display: block; margin: 0px auto; }
|
||||
|
||||
nav {
|
||||
border-top: 1px solid #ccc;
|
||||
border-bottom: 1px solid #ccc;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
nav > * {
|
||||
font-size: 12px;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
margin: 0.75rem 0;
|
||||
padding: 0.25rem 1rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
nav > *:nth-child(n + 2) {
|
||||
border-left: 1px solid #ccc;
|
||||
}
|
||||
|
||||
main img {
|
||||
max-width: 100%;
|
||||
border: 1px solid #E1E1E1;
|
||||
background-color: #f3f3f3;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
footer {
|
||||
border-top: 1px solid #ccc;
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
hr {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.articles { list-style-type: none; padding: 0; border-top: 1px solid #ccc; padding-top: 3rem; }
|
||||
.articles h2 { margin-top: 0; font-size: 22px; }
|
||||
.articles.detailed li:nth-child(n + 2)::before {
|
||||
content: "";
|
||||
display: block;
|
||||
height: 22px;
|
||||
width: 100%;
|
||||
background-image: url(/widget-divider.png);
|
||||
}
|
||||
|
||||
.articles:not(.detailed) .byline { display: none; }
|
||||
.articles:not(.detailed) { border-top: none; padding-top: 0.5rem; }
|
||||
|
||||
.articles .summary { overflow: auto; }
|
||||
.articles .readmore { text-align: right; }
|
||||
.articles img { float: left; max-width: 170px; margin-right: 1rem; }
|
||||
|
||||
aside h2, .with-divider { background: url(/widget-divider.png); background-repeat: repeat-x; background-position: center; }
|
||||
aside h2 span, .with-divider span { background-color: white; padding-right: 0.5rem; }
|
||||
|
||||
@media (max-width: 768px) {
|
||||
body {
|
||||
grid-template-areas: "header" "navigation" "main" "sidebar" "footer";
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
aside { border-left: none; padding-left: 0; }
|
||||
}
|
||||
|
||||
.carrousel {
|
||||
position: relative;
|
||||
}
|
||||
.carrousel ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.carrousel li {
|
||||
display: block;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
.carrousel img {
|
||||
display: block;
|
||||
position: absolute;
|
||||
max-width: 100%;
|
||||
z-index: -1;
|
||||
top: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.carrousel h2 {
|
||||
color: white;
|
||||
background-color: #C4302B;
|
||||
display: inline-block;
|
||||
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.9);
|
||||
margin: 0 1rem;
|
||||
padding: 0.25rem 1rem;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.carrousel .summary {
|
||||
color: white;
|
||||
background-color: rgb(0,0,0,0.75);
|
||||
margin: 1rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.carrousel .nav {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
z-index: 4;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.carrousel .nav.prev {
|
||||
background-image: url(/img/carrousel-nav.png);
|
||||
left: 1rem;
|
||||
}
|
||||
|
||||
.carrousel .nav.next {
|
||||
background-image: url(/img/carrousel-nav.png);
|
||||
background-position: 27px 0;
|
||||
right: 1rem;
|
||||
}
|
||||
|
||||
.carrousel .carrousel-control { display: none; }
|
||||
.carrousel .item { display: none; }
|
||||
.carrousel #v0:checked ~ ul .item0,
|
||||
.carrousel #v1:checked ~ ul .item1,
|
||||
.carrousel #v2:checked ~ ul .item2,
|
||||
.carrousel #v3:checked ~ ul .item3,
|
||||
.carrousel #v4:checked ~ ul .item4 { display: flex; }
|
||||
|
||||
.carrousel-controls {
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.carrousel-visible-control {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid black;
|
||||
background-color: white;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 0px 3px rgba(0, 0, 0, 0.9);
|
||||
}
|
||||
|
||||
.carrousel #v0:checked ~ .carrousel-controls .carrousel-visible-control[for="v0"],
|
||||
.carrousel #v1:checked ~ .carrousel-controls .carrousel-visible-control[for="v1"],
|
||||
.carrousel #v2:checked ~ .carrousel-controls .carrousel-visible-control[for="v2"],
|
||||
.carrousel #v3:checked ~ .carrousel-controls .carrousel-visible-control[for="v3"],
|
||||
.carrousel #v4:checked ~ .carrousel-controls .carrousel-visible-control[for="v4"],
|
||||
.carrousel #v5:checked ~ .carrousel-controls .carrousel-visible-control[for="v5"]
|
||||
{ background-color: #C4302B !important; }
|
||||
BIN
static/widget-divider.png
Normal file
BIN
static/widget-divider.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 212 B |
Loading…
Reference in New Issue
Block a user