Commit fd23b517 authored by Carl Schwan's avatar Carl Schwan 🚴
Browse files

Many small cleanup in the hugo templates

* Use a custom donation box value
* Add redirections for old urls
* Add 404 error handler
* Added README with instruction how to use
* Added Copyright info and an screenshot to the Readme
* Implement translations with i18n-hugo-extractor
* Add height/width information to images
* Cleanup css from unused stuff, optimize images and modernize icon in
  format table
* Don't show link in footer
* Minor changes in the nenu + cleanup
parent 200dad2d
# okular.kde.org
<!--- This should be updated to point to the correct image one the MR is merged --->
![An screenshot of okular's homepage](https://invent.kde.org/carlschwan/okular-kde-org/-/raw/hugo/static/images/screenies/Home.png)
-----
This is the git repository for okular.kde.org, the website for Okular, the universal document reader developed by kde. The site itself is built using [HUGO Framework](https://gohugo.io/), which uses go to generate static websites. If you want to test the website by yourself:
### Prerequisites
You will need to have the following packages installed in your system:
* HUGO: The framework itself we are using for deploying this website
* Go: The [aether-sass](https://invent.kde.org/websites/aether-sass) theme, which this website needs, is included as a Go submodule. You must manually install go in your system before trying to build the website; if go is not availaible, the build process will not work as expected
* Git: This is the file versioning system we use to store the files
### Build the Site
1. Clone this repository: `git clone https://invent.kde.org/websites/okular-kde-org.git`
2. Step into the directory: `cd okular-kde-org`
* To see a live version of the site that updates as you modify the source code, use `hugo server`
* To get the final HTML, ready to be deployed, use `hugo` and check the `./public` folder
### Build the translations
See [extractor docmentation](https://invent.kde.org/websites/hugo-i18n-extractor)
#!/usr/bin/env bash
FILENAME="okular-kde-org_www"
function export_pot_file # First parameter will be the path of the pot file we have to create, includes $FILENAME
{
potfile=$1
i18n-hugo-extractor --directory './' extract $potfile
}
function import_po_files # First parameter will be a path that will contain several .po files with the format LANG.po
{
export LANG=en_US.UTF-8
podir=$1
i18n-hugo-extractor --directory './' import $podir
i18n-hugo-extractor --directory './' generate-translations
rm -rf locale $podir
}
details {
border: 1px solid #5850ec;
border-radius: 10px;
border: 1px solid #54a3d8;
border-radius: 3px;
padding: .5rem .5rem 0;
}
......
......@@ -23,17 +23,6 @@
margin-top: 5px;
}
hr.blue-line {
width: 4rem;
height: 5px;
background: #3daee9;
margin: auto;
border: none;
outline: none;
margin-top: 0.3rem;
margin-bottom: 1rem;
}
main {
font-size: 16px;
......@@ -47,68 +36,6 @@ main {
h1 {
font-weight: bold;
}
.container-application {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
.container-laptop {
max-width: 1100px;
margin-left: auto;
margin-right: auto;
}
@media (max-width: 767.98px) {
.laptop-overlay {
margin-left: 0;
margin-right: 0;
width: 100%;
}
}
.laptop-overlay {
border-radius: 3px;
border: 1px solid #bfbfbf;
margin-top: 5.2%;
}
.fill-flex {
flex-grow: 1
}
#section-green {
background-color: rgba(39,174,96,0.1);
}
.card {
padding: 0;
box-shadow: 1px 3px 8px #EFF0F1;
}
@media (min-width: 992px) {
.text-right-lg {
text-align: right;
}
}
.kde-img {
max-width: 850px;
margin: 20px 0;
}
#plasma-homepage {
background: rgba(61,174,233,.1);
}
#plasma .container {
text-align: center;
justify-content: center;
}
.plasma-info {
display: flex;
flex-direction: column;
align-items: center;
}
@media (min-width: 1100px) {
p {
font-size: 20px;
......@@ -119,164 +46,3 @@ h1 {
justify-content: center;
}
}
.app {
align-items: center;
.button {
margin-left: 10px;
}
.app-description {
display: flex;
align-items: center;
text-align: center;
order: 0;
div {
margin-left: auto;
margin-right: auto;
max-width: 500px;
}
}
@media (min-width: 992px) {
&:nth-child(odd) .app-description {
order: 12;
}
}
}
#plasma h1 {
margin-top: 0.1em;
margin-bottom: 10px;
font-size: 80px;
}
#plasma h2 {
margin-top: 0.1em;
margin-bottom: 40px;
}
.swiper-slide img, .screenshot img {
height: 50vw;
min-height: 300px;
max-height: 500px;
}
.swiper-slide h3 {
text-align: center;
}
.swiper-pagination-bullet {
width: 12px;
height: 12px;
}
.swiper-slide {
flex-shrink: initial;
}
#plasma .learn-more:not(.button) {
margin-left: 10px;
}
.button {
margin-left: 0;
}
.hardware-grid {
display: grid;
grid-template-rows: auto auto;
grid-template-columns: 33% 33% 33%;
grid-template-areas:
"pinebook slimbook focus"
"pinebook-desc slimbook-desc focus-desc";
}
@media (max-width: 767px) {
.hardware-grid {
display: flex;
flex-direction: column;
}
}
.pinebook {
grid-area: pinebook;
padding-left: 5px;
padding-right: 5px;
}
.pinebook-desc {
grid-area: pinebook-desc;
}
.slimbook {
grid-area: slimbook;
padding-left: 13px;
padding-right: 13px;
}
.slimbook-desc {
grid-area: slimbook-desc;
}
.focus {
grid-area: focus;
}
.focus-desc {
grid-area: focus-desc;
}
.focus, .slimbook, .pinebook {
align-self: end;
margin: 20px;
}
.focus img, .slimbook img, .pinebook img {
max-width: 100%;
height: auto;
}
.focus-desc, .slimbook-desc, .pinebook-desc {
text-align: center;
align-self: start;
padding: 5px 15px;
}
#kde-connect {
background: rgba(246, 116, 0, 0.05);
}
.mt-1 {
text-align: left;
}
.50-wide {
width: 50%;
}
.col {
float: left;
margin-top: .5rem;
margin-bottom: .5rem;
margin-right: .5rem;
margin-left: .5rem;
vertical-align: middle;
}
.flexbox {
display: flex;
flex-flow: row
}
.flexbox-column {
display: flex;
flex-flow: column
}
#krita {
box-shadow: 0px 3px 3px 2px #BFBFBF;
border-radius: 4px;
}
#kdenlive {
box-shadow: 0px 3px 3px 2px #BFBFBF;
border-radius: 4px;
}
#kdevelop {
box-shadow: 0px 3px 3px 2px #BFBFBF;
border-radius: 4px;
}
#gcompris {
box-shadow: 0px 3px 3px 2px #BFBFBF;
border-radius: 4px;
margin-bottom: 30px;
}
......@@ -5,21 +5,21 @@
.FormatsDone {
height: 10px;
background-color: #A8FF85;
background-color: #A8FF8544;
border: 1px solid #000;
text-align: center;
}
.FormatsInProgress {
height: 10px;
background-color: #FFFF84;
background-color: #FFFF8444;
border: 1px solid #000;
text-align: center;
}
.FormatsTodo {
height: 10px;
background-color: #FF9C83;
background-color: #FF9C8344;
border: 1px solid #000;
text-align: center;
}
heightAuthor:
name: The Okular developers
baseURL: https://okular.kde.org/
defaultcontentlanguage: en
enableGitInfo: true
enableRobotsTXT: true
heightAuthor:
name: The Okular developers
i18n:
enabled: true
extractContent:
- files:
- content/faq.md
- content/_index.html
- content/build-it.md
- content/contact.md
- content/download.md
- content/formats.md
glob:
- content/news/*.md
extractMenu: true
extractStrings: true
importContentSeparately: true
languages:
en:
contentDir: content/
......@@ -11,24 +26,15 @@ languages:
languageName: English
menu:
main:
- name: Format Support
url: /formats/
- name: Okular
weight: 1
- name: Download
url: /download/
url: /
- name: About
identifier: about
weight: 2
- name: Build It
url: /build-it/
weight: 3
- name: News
url: /news/
weight: 4
- name: FAQ
url: /faq/
weight: 5
- name: Contact
url: /contact/
weight: 6
- name: Donate
url: https://kde.org/donations
weight: 7
......@@ -59,6 +65,19 @@ languages:
- name: Donaciones
url: https://kde.org/donations
weight: 7
fr:
contentDir: content-trans/fr
languageCode: fr
menu:
main: []
weight: 2
markup:
goldmark:
renderer:
unsafe: true
module:
imports:
- path: invent.kde.org/websites/aether-sass
outputs:
home:
- HTML
......@@ -68,11 +87,13 @@ params:
comments: false
commit: true
dateFormat: January 2, 2006
donationBox: //okular.kde.org//donation_box
readingTime: true
rss: true
selfHosted: true
showRelatedPosts: true
showPatrons: false
showLinkFooter: false
showRelatedPosts: true
socialShare: false
useHLJS: true
wordCount: false
......@@ -82,11 +103,4 @@ pygmentsStyle: trac
pygmentsUseClasses: true
staticDir:
- static
title: KDE Announcement | Release Service
module:
imports:
- path: "invent.kde.org/websites/aether-sass"
markup:
goldmark:
renderer:
unsafe: true
title: Okular
module:
imports:
- path: invent.kde.org/websites/aether-sass
- path: github.com/thednp/bootstrap.native
replacements: invent.kde.org/websites/aether-sass -> ../../aether-sass
# Compiling Okular from source on Linux
---
title: Compiling Okular from source on Linux
menu:
main:
parent: about
weight: 2
title: Build It
---
<span style="background-color:#e8f4fa">If you are looking for the pre-compiled packages, visit the [download page](/download/). You can check the packaging status [here](https://repology.org/project/okular/versions)</span>
......@@ -17,6 +24,7 @@ You can download and compile Okular this way:
If you install Okular in a different path than your system install directory it is possible that you need to run `source build/prefix.sh; okular` so that the correct Okular instance and libraries are picked up.
## Optional packages
There are some optional packages you could install in order to have some more functionalities in Okular. Some might already be packaged for your distro, but other may not. If you want to avoid any issues, stick to the packages supported by your distribution
* Poppler (PDF backend): To compile the PDF backend, you need [the Poppler library](http://poppler.freedesktop.org), for which the minimum version required is 0.24
......
# Contact
---
title: Contact
menu:
main:
parent: about
weight: 4
---
<img src="/images/konqi-dev.png" align="right" alt="Konqi, the KDE mascot" style="height: 200px;"/>
......
---
layout: download
title: Download
menu:
main:
parent: about
weight: 3
intro: Okular is availaible as a precompiled package in a wide range of platforms. You can check the package status for your linux distro on the right or keep reading for info on other Operating Systems
sassFiles:
- /sass/download.scss
......
---
layout: faq
menu:
main:
parent: about
weight: 4
title: Frequently Asked Questions
sassFiles:
- /sass/faq.scss
......
......@@ -2,7 +2,11 @@
layout: formats
title: Document Format Handlers Status
intro: Okular supports a wide variety of document formats and use cases. This page always refers to the stable series of Okular, currently Okular 20.12
menu:
main:
parent: about
weight: 1
title: Document Format
sassFiles:
- /sass/table.scss
---
......@@ -2,4 +2,8 @@ module okular-kde-org
go 1.13
require invent.kde.org/websites/aether-sass v0.0.0-20210211200219-f408dee6c33d // indirect
require (
github.com/gohugoio/hugo-mod-bootstrap-scss-v4 v0.0.0-20200902213320-c9cb5e39d8c6 // indirect
github.com/thednp/bootstrap.native v0.0.0-20210208065639-9692a29f3498 // indirect
invent.kde.org/websites/aether-sass v0.0.0-20210403210106-44c9ce4c8090 // indirect
)
......@@ -3,3 +3,7 @@ github.com/thednp/bootstrap.native v0.0.0-20210208065639-9692a29f3498/go.mod h1:
github.com/twbs/bootstrap v4.5.2+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
invent.kde.org/websites/aether-sass v0.0.0-20210211200219-f408dee6c33d h1:sm+DeQf0SYghTS0Xr8vzy0QxU7V1OQPLWMufWdXBGGk=
invent.kde.org/websites/aether-sass v0.0.0-20210211200219-f408dee6c33d/go.mod h1:4DvMg7qs7DpW4EguZ6NquxA/sADT6M7LlAYZ1PjB9hw=
invent.kde.org/websites/aether-sass v0.0.0-20210325155219-4f31599e349d h1:jNzB0S6FicUD2hMA9P+tTAtkFUntw9Uex5jzGWNBjKQ=
invent.kde.org/websites/aether-sass v0.0.0-20210325155219-4f31599e349d/go.mod h1:IskP5IPDRfW//16JlG6MmQ4Jm9aDeBOS5mV0NtquUbI=
invent.kde.org/websites/aether-sass v0.0.0-20210403210106-44c9ce4c8090 h1:FINYxV2Sn1U2LdUBS3qEfGkRYS4RdeAE8Vj6EcKxVXI=
invent.kde.org/websites/aether-sass v0.0.0-20210403210106-44c9ce4c8090/go.mod h1:4DvMg7qs7DpW4EguZ6NquxA/sADT6M7LlAYZ1PjB9hw=
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
......@@ -28,7 +28,7 @@ Home.annotate.description:
Home.selectandview:
other: "Select and View any Text"
Home.selectandview.description:
other: "With Okular's 'Selection mode', you can copy and paste almost anything from your documents to elsewhere. And, for those times the text you want to select is too small, you can use the 'Magnifier mode'."
other: "With Okular's 'Selection mode', you can copy and paste almost anything from your documents to elsewhere. And, for those times the text you want to read is too small, you can use the 'Magnifier mode'."
Home.selectandview.alt_img1:
other: "Okular's 'Selection mode', with text, area and table selection options."
Home.selectandview.alt_img2:
......
{{/*
SPDX-FileCopyrightText: Pablo Marcos <kde@pablomarcos.me>
SPDX-License-Identifier: LGPL-3.0-or-later
*/}}
{{ define "main" }}
<main class="container" role="main">
<h1>{{ .Params.title }}</h1>
......
{{/*
SPDX-FileCopyrightText: Pablo Marcos <kde@pablomarcos.me>
SPDX-License-Identifier: LGPL-3.0-or-later
*/}}
{{ define "main" }}
<main class="container" role="main">
<h1> {{ .Params.title }} </h1>
......
This diff is collapsed.
{{/*
SPDX-FileCopyrightText: Pablo Marcos <kde@pablomarcos.me>
SPDX-License-Identifier: LGPL-3.0-or-later
*/}}
{{- $.Scratch.Add "index" slice -}}
{{- range .Site.RegularPages -}}
{{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "categories" .Params.categories "contents" .Plain "permalink" .Permalink) -}}
......
{{/*
SPDX-FileCopyrightText: Pablo Marcos <kde@pablomarcos.me>
SPDX-License-Identifier: LGPL-3.0-or-later
*/}}
{{ define "main" }}
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>