Compare commits
No commits in common. "v2.0.0" and "master" have entirely different histories.
@ -18,7 +18,7 @@ rules:
|
||||
- as-needed
|
||||
semi:
|
||||
- 2
|
||||
- never
|
||||
- always
|
||||
class-methods-use-this: 0
|
||||
comma-dangle:
|
||||
- 2
|
||||
@ -33,7 +33,7 @@ rules:
|
||||
func-names: 0
|
||||
quotes:
|
||||
- 2
|
||||
- single
|
||||
- double
|
||||
- allowTemplateLiterals: true
|
||||
no-underscore-dangle: 0
|
||||
object-curly-newline: 0
|
||||
|
3
.gitignore
vendored
@ -88,3 +88,6 @@ typings/
|
||||
.dynamodb/
|
||||
|
||||
# End of https://www.gitignore.io/api/node
|
||||
public
|
||||
resources
|
||||
.hugo_build.lock
|
||||
|
1
.husky/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
_
|
4
.husky/pre-push
Executable file
@ -0,0 +1,4 @@
|
||||
#!/bin/sh
|
||||
. "$(dirname "$0")/_/husky.sh"
|
||||
|
||||
yarn build && git add . && git commit --amend --no-edit
|
@ -2,6 +2,7 @@
|
||||
"parser": "babel",
|
||||
"printWidth": 100,
|
||||
"trailingComma": "all",
|
||||
"arrowParens": "avoid",
|
||||
"overrides": [{
|
||||
"files": ".html",
|
||||
"options": {
|
||||
|
10
.stylelintrc.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"extends": [
|
||||
"stylelint-config-standard-scss",
|
||||
"stylelint-config-prettier-scss"
|
||||
],
|
||||
"rules": {
|
||||
"max-empty-lines": 1
|
||||
}
|
||||
}
|
||||
|
@ -16,6 +16,10 @@ eg:
|
||||
- John, a javascript developer.
|
||||
-->
|
||||
|
||||
- **Social media icons** (https://github.com/...)
|
||||
- This is the biggest missing feature of the theme. But now it will help your audience reach you over the internet.
|
||||
- John, a javascript developer.
|
||||
- **Portfolio** (https://github.com/Louisload/hugo-theme-terminal-portfolio)
|
||||
- Allows you to create a portfolio page (or several). Supports icons and subsections.
|
||||
- Luís Rodrigues Alves (Louisload), a game dev and musician.
|
||||
|
||||
- **Single Page Website** (https://github.com/justinnuwin/hugo-theme-terminal)
|
||||
- A layout where the homepage can render lists of pages and the navigation menu can link to sections on the homepage.
|
||||
- Justin Nguyen, software and hardware developer.
|
||||
|
158
README.md
@ -1,10 +1,19 @@
|
||||
# Terminal
|
||||
|
||||
## The theme is no longer maintained, but can still be used
|
||||
|
||||
Even if the repository is archived you can still use the theme, fork it, download it, expand it, etc. Remember that each Hugo theme is a module that can be modified to match your needs. The theme is fully "open" and it depends only on the internal engines implemented in Hugo.
|
||||
|
||||
The theme brings many useful features thanks to [all people that contributed to it](https://github.com/panr/hugo-theme-terminal/graphs/contributors) (I want to thank you all!). At the time of archiving the theme has reached 9th place on the [official Hugo Themes list](https://themes.gohugo.io/). This is huge! Thanks to you!
|
||||
|
||||
----
|
||||
|
||||

|
||||
|
||||
|
||||
### DEMO - https://hugo-terminal.now.sh/
|
||||
|
||||
<a href="https://www.buymeacoffee.com/panr" target="_blank"><img src="https://res.cloudinary.com/panr/image/upload/v1579374705/buymeacoffee_y6yvov.svg" alt="Buy Me A Coffee" ></a>
|
||||
### ⚠️ The theme needs at least Hugo **Extended** v0.90.x.
|
||||
|
||||
---
|
||||
|
||||
@ -16,28 +25,34 @@
|
||||
- [How to configure](#how-to-configure)
|
||||
- [Post archetype](#post-archetype)
|
||||
- [Add-ons](#add-ons)
|
||||
- [How to (safely) edit the theme](#how-to-edit)
|
||||
- [How to edit the theme](#how-to-edit)
|
||||
- [Found a bug?](#bug)
|
||||
- [New cool idea or feature](#feature)
|
||||
- [Terminal theme user?](#terminal-theme-user)
|
||||
- [Sponsoring](#sponsoring)
|
||||
- [Licence](#licence)
|
||||
- [License](#license)
|
||||
|
||||
## Features
|
||||
|
||||
- **5 duetone themes**, depending on your preferences (orange is default, red, blue, green, pink)
|
||||
- **5 duotone themes**, depending on your preferences (orange is default, red, blue, green, pink)
|
||||
- [**Fira Code**](https://github.com/tonsky/FiraCode) as default monospaced font. It's gorgeous!
|
||||
- **really nice duotone**, custom syntax highlighting based on [**PrismJS**](https://prismjs.com)
|
||||
- fully responsive
|
||||
- fully based on Hugo ecosystem (Pipes and Modules)
|
||||
|
||||
#### Built-in shortcodes
|
||||
|
||||
- **`image`** (prop required: **`src`**; props optional: **`alt`**, **`position`** (**left** is default | center | right), **`style`**)
|
||||
- eg: `{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}`
|
||||
- **`image`** (props required: **`src`**; props optional: **`alt`**, **`position`** (**left** is default | center | right), **`style`**)
|
||||
- e.g.
|
||||
```go
|
||||
{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}
|
||||
```
|
||||
- **`figure`** (same as `image`, plus few optional props: **`caption`**, **`captionPosition`** (left | **center** is default | right), **`captionStyle`**)
|
||||
- eg: `{{< figure src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" caption="Hello Friend!" captionPosition="right" captionStyle="color: red;" >}}`
|
||||
- **`code`** (prop required: **`language`**; props optional: **`title`**, **`id`**, **`expand`** (default "△"), **`collapse`** (default "▽"), **`isCollapsed`**)
|
||||
- eg:
|
||||
- e.g.
|
||||
```go
|
||||
{{< figure src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" caption="Hello Friend!" captionPosition="right" captionStyle="color: red;" >}}
|
||||
```
|
||||
- **`code`** (props required: **`language`**; props optional: **`title`**, **`id`**, **`expand`** (default "△"), **`collapse`** (default "▽"), **`isCollapsed`**)
|
||||
- e.g.
|
||||
```go
|
||||
{{< code language="css" title="Really cool snippet" id="1" expand="Show" collapse="Hide" isCollapsed="true" >}}
|
||||
pre {
|
||||
@ -72,38 +87,71 @@ A custom syntax highlighting based on PrismJS. All you need to do is to wrap you
|
||||
```
|
||||
````
|
||||
|
||||
**Supported languages**: bash/shell, css, clike, javascript, apacheconf, actionscript, applescript, c, csharp, cpp, coffeescript, ruby, csp, css-extras, diff, django, docker, elixir, elm, markup-templating, erlang, fsharp, flow, git, go, graphql, less, handlebars, haskell, http, java, json, kotlin, latex, markdown, makefile, objectivec, ocaml, perl, php, php-extras, r, sql, processing, scss, python, jsx, typescript, toml, reason, textile, rust, sass, stylus, scheme, pug, swift, yaml, haml, twig, tsx, vim, visual-basic, wasm.
|
||||
**Supported languages**: actionscript, apacheconf, applescript, bash, c, clike, cmake, coffeescript, cpp, csharp, csp, css, css-extras, diff, django, docker, elixir, elm, erlang, flow, fsharp, git, go, graphql, haml, handlebars, haskell, http, java, javascript, json, jsx, kotlin, latex, less, llvm, makefile, markdown, markup, markup-templating, nasm, objectivec, ocaml, perl, php, php-extras, powershell, processing, pug, python, r, reason, ruby, rust, sass, scala, scheme, scss, sql, stylus, swift, textile, toml, tsx, twig, typescript, vim, visual-basic, wasm, yaml.
|
||||
|
||||
## How to start
|
||||
|
||||
You can download the theme manually by going to [https://github.com/panr/hugo-theme-terminal.git](https://github.com/panr/hugo-theme-terminal.git) and pasting it to `themes/terminal` in your root directory.
|
||||
|
||||
You can also clone it directly to your Hugo folder:
|
||||
You can also choose **one of the 3 possibilities** to install the theme:
|
||||
|
||||
```
|
||||
$ git clone https://github.com/panr/hugo-theme-terminal.git themes/terminal
|
||||
1. as Hugo Module
|
||||
2. as a standalone local directory
|
||||
3. as a git submodule
|
||||
|
||||
⚠️ The theme needs at least Hugo **Extended** v0.90.x.
|
||||
|
||||
### Install theme as Hugo Module
|
||||
|
||||
```bash
|
||||
# If this is the first time you're using Hugo Modules
|
||||
# in your project. You have to initiate your own module before
|
||||
# you fetch the theme module.
|
||||
#
|
||||
# hugo mod init [your website/module name]
|
||||
hugo mod get github.com/panr/hugo-theme-terminal/v3
|
||||
```
|
||||
|
||||
If you don't want to make any radical changes, it's the best option, because you can get new updates when they are available. You can also include it as a git submodule:
|
||||
and in your config file add:
|
||||
|
||||
```toml
|
||||
[module]
|
||||
# this is needed when you fetch the theme as a submodule to your repo.
|
||||
# replacements = "github.com/panr/hugo-theme-terminal -> themes/terminal"
|
||||
[[module.imports]]
|
||||
path = 'github.com/panr/hugo-theme-terminal/v3'
|
||||
```
|
||||
$ git submodule add https://github.com/panr/hugo-theme-terminal.git themes/terminal
|
||||
|
||||
Keep in mind that the theme by default won't show up in the `themes` directory. This means that you are using the theme as it was on the repository at the moment you fetched it. Your local `go.sum` file keeps all the references. Read more about Hugo Modules in the [official documentation](https://gohugo.io/hugo-modules/).
|
||||
|
||||
### Install theme locally
|
||||
|
||||
```bash
|
||||
git clone https://github.com/panr/hugo-theme-terminal.git themes/terminal
|
||||
```
|
||||
|
||||
This will clone the repository directly to the `themes/terminal` directory.
|
||||
|
||||
### Install theme as a submodule
|
||||
|
||||
```bash
|
||||
git submodule add -f https://github.com/panr/hugo-theme-terminal.git themes/terminal
|
||||
```
|
||||
|
||||
This will install the repository as a sumbodule in the `themes/terminal` directory.
|
||||
|
||||
⚠️ If you encounter any issues with:
|
||||
|
||||
```bash
|
||||
Error: module "terminal" not found; either add it as a Hugo Module or store it in "[...your custom path]/themes".: module does not exist
|
||||
```
|
||||
|
||||
then please try to remove `theme = "terminal"` from your config file.
|
||||
|
||||
## How to run your site
|
||||
|
||||
The theme is using [Hugo Pipes](https://gohugo.io/hugo-pipes/) to handle Javascript and PostCSS files. This setup **requires** following npm packages:
|
||||
|
||||
```
|
||||
@babel/cli @babel/core @babel/preset-env browserslist clipboard cssnano postcss-cli postcss-import postcss-mixins postcss-nested postcss-preset-env postcss-url
|
||||
```
|
||||
|
||||
Before you start, you have to install them (globally or locally).
|
||||
|
||||
Then:
|
||||
|
||||
```
|
||||
$ hugo server -t terminal
|
||||
```bash
|
||||
hugo server -t terminal
|
||||
```
|
||||
|
||||
and go to `localhost:1313` in your browser. From now on all the changes you make will go live, so you don't need to refresh your browser every single time.
|
||||
@ -115,6 +163,8 @@ The theme doesn't require any advanced configuration. Just copy:
|
||||
```toml
|
||||
baseurl = "/"
|
||||
languageCode = "en-us"
|
||||
# Add it only if you keep the theme in the `themes` directory.
|
||||
# Remove it if you use the theme as a remote Hugo Module.
|
||||
theme = "terminal"
|
||||
paginate = 5
|
||||
|
||||
@ -138,18 +188,35 @@ paginate = 5
|
||||
# center theme with default width
|
||||
centerTheme = false
|
||||
|
||||
# set a custom favicon (default is a `themeColor` square)
|
||||
# favicon = "favicon.ico"
|
||||
# if your resource directory contains an image called `cover.(jpg|png|webp)`,
|
||||
# then the file will be used as a cover automatically.
|
||||
# With this option you don't have to put the `cover` param in a front-matter.
|
||||
autoCover = true
|
||||
|
||||
# set post to show the last updated
|
||||
# If you use git, you can set `enableGitInfo` to `true` and then post will automatically get the last updated
|
||||
showLastUpdated = false
|
||||
|
||||
# set a custom favicon (default is a `themeColor` square)
|
||||
# favicon = "favicon.ico"
|
||||
|
||||
# Provide a string as a prefix for the last update date. By default, it looks like this: 2020-xx-xx [Updated: 2020-xx-xx] :: Author
|
||||
# updatedDatePrefix = "Updated"
|
||||
|
||||
# set all headings to their default size (depending on browser settings)
|
||||
# it's set to `true` by default
|
||||
# oneHeadingSize = false
|
||||
# oneHeadingSize = true # default
|
||||
|
||||
# whether to show a page's estimated reading time
|
||||
# readingTime = false # default
|
||||
|
||||
# whether to show a table of contents
|
||||
# can be overridden in a page's front-matter
|
||||
# Toc = false # default
|
||||
|
||||
# set title for the table of contents
|
||||
# can be overridden in a page's front-matter
|
||||
# TocTitle = "Table of Contents" # default
|
||||
|
||||
|
||||
[params.twitter]
|
||||
# set Twitter handles for Twitter cards
|
||||
@ -169,8 +236,12 @@ paginate = 5
|
||||
menuMore = "Show more"
|
||||
readMore = "Read more"
|
||||
readOtherPosts = "Read other posts"
|
||||
newerPosts = "Newer posts"
|
||||
olderPosts = "Older posts"
|
||||
missingContentMessage = "Page not found..."
|
||||
missingBackButtonLabel = "Back to home page"
|
||||
minuteReadingTime = "min read"
|
||||
words = "words"
|
||||
|
||||
[languages.en.params.logo]
|
||||
logoText = "Terminal"
|
||||
@ -185,6 +256,14 @@ paginate = 5
|
||||
identifier = "showcase"
|
||||
name = "Showcase"
|
||||
url = "/showcase"
|
||||
|
||||
[module]
|
||||
# In case you would like to make changes to the theme and keep it locally in you repository,
|
||||
# uncomment the line below (and correct the local path if necessary).
|
||||
# --
|
||||
# replacements = "github.com/panr/hugo-theme-terminal -> themes/terminal"
|
||||
[[module.imports]]
|
||||
path = 'github.com/panr/hugo-theme-terminal'
|
||||
```
|
||||
|
||||
to `config.toml` file in your Hugo root directory and change params fields. In case you need, here's [a YAML version](https://gist.github.com/panr/9eeea6f595c257febdadc11763e3a6d1).
|
||||
@ -193,7 +272,7 @@ to `config.toml` file in your Hugo root directory and change params fields. In c
|
||||
|
||||
## Post archetype
|
||||
|
||||
See the basic `post` file params supported by the theme — https://github.com/panr/hugo-theme-terminal/blob/master/archetypes/posts.md
|
||||
See the default `post` file params supported by the theme — https://github.com/panr/hugo-theme-terminal/blob/master/archetypes/posts.md
|
||||
|
||||
## Add-ons
|
||||
|
||||
@ -201,9 +280,11 @@ See the basic `post` file params supported by the theme — https://github.com/p
|
||||
- **Extended Head** — please take a look at `layouts/partials/extended_head.html` https://github.com/panr/hugo-theme-terminal/blob/master/layouts/partials/extended_head.html
|
||||
- **Extended Footer** — please take a look at `layouts/partials/extended_footer.html` https://github.com/panr/hugo-theme-terminal/blob/master/layouts/partials/extended_footer.html
|
||||
|
||||
## How to (safely) edit the theme <a id="how-to-edit" />
|
||||
## How to edit the theme <a id="how-to-edit" />
|
||||
|
||||
To change something in the theme, you have to go to `themes/terminal` and modify the files. You can also copy them (like `assets` folder) from the theme to your root directory and modify the files there (thanks to Hugo's lookup https://gohugo.io/templates/lookup-order). This will protect your changes from overriding when you update the theme.
|
||||
If you are using as a remote Hugo Module (you don't have the theme files in the `theme/terminal`) and you have to override only some of the styles, you can do this easily by adding `static/style.css` in your root directory and point things you want to change.
|
||||
|
||||
If you have the theme files in the theme directory, then you can directly edit anything in the theme, you just have to go to `themes/terminal` and modify the files. No compilation step needed.
|
||||
|
||||
## Found a bug? <a id="bug" />
|
||||
|
||||
@ -230,14 +311,9 @@ Sounds OK? Cool, let's rock! 🤘
|
||||
|
||||
I'd be happy to know more about you and what you are doing. If you want to share it, please make a contribution and [add your site to the list](https://github.com/panr/hugo-theme-terminal/blob/master/USERS.md)! 🤗
|
||||
|
||||
## Sponsoring
|
||||
|
||||
If you like my work and want to support the development of the project, now you can! Just:
|
||||
|
||||
<a href="https://www.buymeacoffee.com/panr" target="_blank"><img src="https://res.cloudinary.com/panr/image/upload/v1579374705/buymeacoffee_y6yvov.svg" alt="Buy Me A Coffee" ></a>
|
||||
|
||||
## License
|
||||
|
||||
Copyright © 2019-2020 Radosław Kozieł ([@panr](https://twitter.com/panr))
|
||||
Copyright © 2019-2022 Radosław Kozieł ([@panr](https://twitter.com/panr))
|
||||
|
||||
The theme is released under the MIT License. Check the [original theme license](https://github.com/panr/hugo-theme-terminal/blob/master/LICENSE.md) for additional licensing information.
|
||||
|
53
USERS.md
@ -1,28 +1,20 @@
|
||||
# Meet the users of Terminal theme!
|
||||
|
||||
- https://xicode.se **magistern** (Teacher)
|
||||
- https://devmaster64.com **devmaster64** (Software Developer)
|
||||
- https://mickie1.gitlab.io/blog/ **mickie** (Engineer)
|
||||
- https://calloc.net **Vaibhav Yenamandra** (Software Engineer)
|
||||
- https://potatofrom.space **Kevin Liu** (Software)
|
||||
- https://horochx.org **horochx** (Software Developer)
|
||||
- https://feng.si **Si Feng** (Software Engineer)
|
||||
- https://ben-on-vms.com **Benedikt Frenzel** (Technical Support Engineer)
|
||||
- https://johngazzini.com **John Gazzini** (Software Engineer)
|
||||
- https://geekx.tech/ **Sagar Ladla** (Student Developer & Cyber Security Specialist)
|
||||
- https://tears.io/ **Alex** (SRE)
|
||||
- https://ayushkarn.me/ **Ayush Karn** (Student Developer)
|
||||
- https://ssgram.dev **Ramaseshan Parthasarathy** (Software Developer)
|
||||
- https://zaine.me **Amine Zaine** (Cloud Engineer)
|
||||
- https://notes.dmaitre.phyip3.dur.ac.uk/computing-club/ **Ryan Moodie** (Physics PhD student)
|
||||
- https://thecodecousins.com **Stanley Nguyen** (Software Engineer) & **Hoang Do** (Software & IoT Engineer)
|
||||
- https://schacherbauer.dev **Markus Schacherbauer** (Student Developer)
|
||||
- https://rinma.dev **Marvin Dalheimer** (Software Developer)
|
||||
- https://lunar.computer **Lunar Computer** (DevOps Engineer)
|
||||
- https://naxxfish.net **Chris Roberts** (Broadcast Systems Engineer)
|
||||
- https://security.jtang.dev **Jonathan Tang** (Student & Software Engineer)
|
||||
- https://andreacaravano.net **Andrea Caravano** (Student)
|
||||
- https://dawsonverboven.com/ **Dawson Verboven** (Student & Software Developer)
|
||||
- https://www.rockyourcode.com **Sophia Brandt** (tax officer and hobby coder)
|
||||
- https://qbunt.com **Jeremy Bunting** (Software Engineer)
|
||||
- https://smeik.org **Smeik** (Embedded Developer)
|
||||
- https://code.willstocks.co.uk **Will Stocks** (Blogger & Developer)
|
||||
@ -30,14 +22,45 @@
|
||||
- https://m47r1x.github.io **Neo** (Citizen of Zion)
|
||||
- https://bgameiro.me/ **Bernardo Gameiro** (Engineer Physicist student)
|
||||
- https://return-to-libc.com/ **elraro** (Cyber Security Specialist)
|
||||
- https://waterloos.niflheimr.blue/ **niflheimr1011** (Aspiring Software Engineer)
|
||||
- https://pablart.com/ **Pablo Diaz-Gutierrez** (Software Engineer, General Tinkerer)
|
||||
- https://monocle.rpod.club/ **classx** (DevOps Engineer)
|
||||
- https://wjdevschool.com/ **Wojciech Bogócki** (Making Things & Teaching / W&J Dev School)
|
||||
- https://waterloos.niflheimr.blue/ **cindrmon** (Aspiring Software Engineer and Student)
|
||||
- https://erisianrite.com/ **ErisianRite** (Coding, Engineering, Tools for Thought)
|
||||
- https://isaes.com.tr/ **Isa Es** (Software Engineer)
|
||||
- https://blog.m5e.de/ **Christoph Miksche** (Software Developer)
|
||||
- https://mpostument.com/ **Maksym Postument** (DevOps Engineer)
|
||||
- https://mathiejosh.xyz **Josh Mathie** (Electrical Engineering Technology Student/Sales and Engineering Tech)
|
||||
- https://yuji.ne.jp/ **YUJI** (Student & Software Developer)
|
||||
- https://blog.puvvadi.me **KD Puvvadi** (Software Dev & Cloud Orchestrator)
|
||||
- https://hidden.land/ **Louisload** (Game Developer & Musician)
|
||||
- https://linuxbase.nl **Michael Trip** (DevOps Engineer)
|
||||
- https://blog.sethforprivacy.com **Seth For Privacy** (Security, privacy, and cryptocurrency writer, podcaster)
|
||||
- https://thesprawl.city **crish** (Software and stuff)
|
||||
- https://justinnuwin.com **Justin Nguyen** (Software & Hardware Developer)
|
||||
- https://blog.woosal.com/ **Vusal Ismayilov** (Computer Engineering Student)
|
||||
- https://itsembedded.com/ **Norbert Kremeris** (digital logic design and verification engineer)
|
||||
- https://nereuxofficial.github.io **Nereuxofficial** (Software Developer & Student)
|
||||
- https://biplav.xyz **Biplav's Blog** (Student)
|
||||
- https://santiago.wtf **Nicholas Santiago** (DevOps Engineer)
|
||||
- https://2200g.github.io/ **2200g** (Blogger/Student)
|
||||
- https://they.mint.lgbt **Joey Aliaga** (Software Developer & Student)
|
||||
- https://tatewilhelm.me **Tate Wilhelm** (Student, Programmer & Tinkerer)
|
||||
- https://mikefoden.com **Mike Foden** (Software Developer)
|
||||
- https://undemalum.github.io/portfolio/ **Mateusz Konat** (Student)
|
||||
- https://ku0hn.radio **Ben Kuhn** (Ham Radio Operator, InfoSec Engineer, Tinkerer)
|
||||
- https://www.grumpymetalguy.com **GrumpyMetalGuy** (General Grumper and Developer)
|
||||
- https://blog.jontes.page **Jonte** (general tech geek)
|
||||
- https://nazdarthegame.com/ **Michal Skoula** (Software Developer)
|
||||
- https://1mup.myorange.house **Antonio Garosi** (Street art gallery)
|
||||
- https://kitchvx.github.io **Nathan Kitching** (IT Student)
|
||||
- https://dgood.win **Dom Goodwin** (Platform Engineer)
|
||||
- https://sir-photch.xyz **Sir-Photch** (ComSci-student. German Blog)
|
||||
- https://drewmorris.info **Drew Morris** (Mathematician && Computer Scientist)
|
||||
- https://blog.darkiiiiiice.com **MarioMang** (Software Developer)
|
||||
|
||||
<!--
|
||||
TEMPLATE:
|
||||
TEMPLATE:
|
||||
|
||||
- https://radoslawkoziel.pl **Radek Kozieł** (Software Designer and Developer)
|
||||
- https://radoslawkoziel.pl **Radek Kozieł** (Software Designer and Developer)
|
||||
|
||||
-->
|
||||
|
||||
-->
|
||||
|
@ -1,6 +1,6 @@
|
||||
+++
|
||||
title = ""
|
||||
date = ""
|
||||
title = "{{ replace .TranslationBaseName "-" " " | title }}"
|
||||
date = "{{ .Date }}"
|
||||
author = ""
|
||||
authorTwitter = "" #do not include @
|
||||
cover = ""
|
||||
@ -8,4 +8,7 @@ tags = ["", ""]
|
||||
keywords = ["", ""]
|
||||
description = ""
|
||||
showFullContent = false
|
||||
readingTime = false
|
||||
hideComments = false
|
||||
color = "" #color from the theme settings
|
||||
+++
|
||||
|
@ -12,15 +12,23 @@ a.button {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 8px 18px;
|
||||
margin-bottom: 5px;
|
||||
margin: 5px 0;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
border-radius: 8px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8;
|
||||
border: 1px solid $accent;
|
||||
background: $accent;
|
||||
color: $background;
|
||||
font: inherit;
|
||||
font-weight: bold;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
|
||||
&:hover {
|
||||
background: transparentize($accent, .1);
|
||||
}
|
||||
|
||||
/* variants */
|
||||
|
||||
&.outline {
|
||||
@ -34,20 +42,11 @@ a.button {
|
||||
}
|
||||
}
|
||||
|
||||
&.primary {
|
||||
box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 2px 6px rgba(50, 50, 93, .21), 0 1px 3px rgba(0, 0, 0, .08);
|
||||
}
|
||||
}
|
||||
|
||||
&.link {
|
||||
background: none;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
|
||||
/* sizes */
|
||||
|
||||
&.small {
|
||||
@ -64,6 +63,8 @@ a.read-more,
|
||||
a.read-more:hover,
|
||||
a.read-more:active {
|
||||
display: inline-flex;
|
||||
border: none;
|
||||
color: $accent;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
@ -1,5 +1,5 @@
|
||||
.collapsable-code {
|
||||
--border-color: color-mod(var(--accent) blend(#999 90%));
|
||||
$border-color: mix($accent, #999, 90%);
|
||||
|
||||
position: relative;
|
||||
width: 100%;
|
||||
@ -39,13 +39,13 @@
|
||||
min-width: 30px;
|
||||
min-height: 30px;
|
||||
margin: 0;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
border-bottom: 1px solid $border-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__title {
|
||||
flex: 1;
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
padding: 3px 10px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@ -53,15 +53,15 @@
|
||||
}
|
||||
|
||||
&__language {
|
||||
color: var(--accent);
|
||||
border: 1px solid var(--border-color);
|
||||
color: $accent;
|
||||
border: 1px solid $border-color;
|
||||
border-bottom: none;
|
||||
text-transform: uppercase;
|
||||
padding: 3px 10px;
|
||||
}
|
||||
|
||||
&__toggle {
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
font-size: 16px;
|
||||
padding: 3px 10px;
|
||||
|
@ -1,14 +0,0 @@
|
||||
@import '../main.css';
|
||||
@import '../header.css';
|
||||
@import '../logo.css';
|
||||
@import '../pagination.css';
|
||||
@import '../post.css';
|
||||
@import '../syntax.css';
|
||||
@import '../variables.css';
|
||||
|
||||
:root {
|
||||
--accent: #23B0FF;
|
||||
--background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
--color: white;
|
||||
--border-color: rgba(255, 255, 255, .1);
|
||||
}
|
1
assets/css/color/blue.scss
Normal file
@ -0,0 +1 @@
|
||||
$accent: #23B0FF;
|
@ -1,14 +0,0 @@
|
||||
@import '../main.css';
|
||||
@import '../header.css';
|
||||
@import '../logo.css';
|
||||
@import '../pagination.css';
|
||||
@import '../post.css';
|
||||
@import '../syntax.css';
|
||||
@import '../variables.css';
|
||||
|
||||
:root {
|
||||
--accent: #78E2A0;
|
||||
--background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
--color: white;
|
||||
--border-color: rgba(255, 255, 255, .1);
|
||||
}
|
1
assets/css/color/green.scss
Normal file
@ -0,0 +1 @@
|
||||
$accent: #78E2A0;
|
1
assets/css/color/orange.scss
Normal file
@ -0,0 +1 @@
|
||||
$accent: #FFA86A;
|
@ -1,14 +0,0 @@
|
||||
@import '../main.css';
|
||||
@import '../header.css';
|
||||
@import '../logo.css';
|
||||
@import '../pagination.css';
|
||||
@import '../post.css';
|
||||
@import '../syntax.css';
|
||||
@import '../variables.css';
|
||||
|
||||
:root {
|
||||
--accent: #EE72F1;
|
||||
--background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
--color: white;
|
||||
--border-color: rgba(255, 255, 255, .1);
|
||||
}
|
1
assets/css/color/pink.scss
Normal file
@ -0,0 +1 @@
|
||||
$accent: #EE72F1;
|
@ -1,14 +0,0 @@
|
||||
@import '../main.css';
|
||||
@import '../header.css';
|
||||
@import '../logo.css';
|
||||
@import '../pagination.css';
|
||||
@import '../post.css';
|
||||
@import '../syntax.css';
|
||||
@import '../variables.css';
|
||||
|
||||
:root {
|
||||
--accent: #FF6266;
|
||||
--background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
--color: white;
|
||||
--border-color: rgba(255, 255, 255, .1);
|
||||
}
|
1
assets/css/color/red.scss
Normal file
@ -0,0 +1 @@
|
||||
$accent: #FF6266;
|
@ -1,4 +1,5 @@
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: 'Fira Code';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
@ -6,6 +7,7 @@
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
font-family: 'Fira Code';
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
@ -11,7 +11,7 @@
|
||||
width: 760px;
|
||||
max-width: 100%;
|
||||
|
||||
@media (--tablet) {
|
||||
@media ($tablet) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
@ -22,10 +22,11 @@
|
||||
|
||||
.copyright {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-flow: row wrap;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
font-size: 1rem;
|
||||
color: var(--light-color-secondary);
|
||||
justify-content: center;
|
||||
|
||||
&--user {
|
||||
margin: auto;
|
||||
@ -34,17 +35,10 @@
|
||||
|
||||
& > *:first-child:not(:only-child) {
|
||||
margin-right: 10px;
|
||||
|
||||
@media (--tablet) {
|
||||
border: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (--tablet) {
|
||||
flex-direction: column;
|
||||
margin-top: 10px;
|
||||
span {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
43
assets/css/form.scss
Normal file
@ -0,0 +1,43 @@
|
||||
input, textarea, select {
|
||||
background: transparent;
|
||||
color: $accent;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0;
|
||||
padding: 10px;
|
||||
margin: 5px 0;
|
||||
font: inherit;
|
||||
appearance: none;
|
||||
|
||||
&:focus, :active {
|
||||
border-color: $color;
|
||||
outline: 1px solid $color;
|
||||
}
|
||||
|
||||
&:active {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
select {
|
||||
background: $background;
|
||||
|
||||
option {
|
||||
background: $background;
|
||||
}
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
color: transparentize($accent, .5);
|
||||
}
|
||||
|
||||
input {
|
||||
&[type="checkbox"] {
|
||||
vertical-align: middle;
|
||||
padding: 10px;
|
||||
box-shadow: inset 0 0 0 3px $background;
|
||||
|
||||
&:checked {
|
||||
background: $accent;
|
||||
}
|
||||
}
|
||||
}
|
6
assets/css/gist.scss
Normal file
@ -0,0 +1,6 @@
|
||||
body .gist .blob-num /* line numbers */,
|
||||
body .gist .blob-code-inner
|
||||
{
|
||||
border: none;
|
||||
}
|
||||
|
@ -1,162 +0,0 @@
|
||||
@define-mixin menu {
|
||||
position: absolute;
|
||||
background: var(--background);
|
||||
box-shadow: var(--shadow);
|
||||
color: white;
|
||||
border: 2px solid;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
list-style: none;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
@media print {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&__inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&__logo {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
background: repeating-linear-gradient(90deg, var(--accent), var(--accent) 2px, transparent 0, transparent 10px);
|
||||
display: block;
|
||||
width: 100%;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
flex: 0 0 auto;
|
||||
max-width: 100%;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
--shadow-color: color-mod(var(--background) a(80%));
|
||||
--shadow: 0 10px var(--shadow-color), -10px 10px var(--shadow-color), 10px 10px var(--shadow-color);
|
||||
margin: 20px 0;
|
||||
|
||||
@media (--phone) {
|
||||
@mixin menu;
|
||||
top: 50px;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&__inner {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
&--desktop {
|
||||
@media (--phone) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&--mobile {
|
||||
display: none;
|
||||
|
||||
@media (--phone) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
&:not(:last-of-type) {
|
||||
margin-right: 20px;
|
||||
margin-bottom: 10px;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (--phone) {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__sub-inner {
|
||||
position: relative;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
&:not(:only-child) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
&-more {
|
||||
@mixin menu;
|
||||
top: 35px;
|
||||
left: 0;
|
||||
|
||||
&-trigger {
|
||||
color: var(--accent);
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.spacer {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.language-selector {
|
||||
position: relative;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
|
||||
&-current {
|
||||
list-style-type: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
color: var(--accent);
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__more {
|
||||
@mixin menu;
|
||||
top: 35px;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-trigger {
|
||||
color: var(--accent);
|
||||
border: 2px solid;
|
||||
margin-left: 10px;
|
||||
height: 100%;
|
||||
padding: 3px 8px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
34
assets/css/header.scss
Normal file
@ -0,0 +1,34 @@
|
||||
.header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
@media print {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&__inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&__logo {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
background: repeating-linear-gradient(90deg, $accent, $accent 2px, transparent 0, transparent 10px);
|
||||
display: block;
|
||||
width: 100%;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
flex: 0 0 auto;
|
||||
max-width: 100%;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
@ -2,7 +2,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-decoration: none;
|
||||
background: var(--accent);
|
||||
background: $accent;
|
||||
color: black;
|
||||
padding: 5px 10px;
|
||||
}
|
@ -15,16 +15,16 @@ body {
|
||||
font-size: 1rem;
|
||||
line-height: 1.54;
|
||||
letter-spacing: -0.02em;
|
||||
background-color: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
color: var(--color);
|
||||
background-color: $background;
|
||||
color: $color;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-feature-settings: "liga", "tnum", "case", "calt", "zero", "ss01", "locl";
|
||||
font-feature-settings: "liga", "tnum", "zero", "ss01", "locl";
|
||||
font-variant-ligatures: contextual;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
@ -61,7 +61,7 @@ a {
|
||||
|
||||
/* Waiting for a better times... */
|
||||
/* &:has(code) {
|
||||
text-decoration-color: var(--accent);
|
||||
text-decoration-color: $accent;
|
||||
} */
|
||||
}
|
||||
|
||||
@ -109,8 +109,8 @@ figure {
|
||||
font-size: 14px;
|
||||
padding: 5px 10px;
|
||||
margin-top: 5px;
|
||||
background: var(--accent);
|
||||
color: var(--background);
|
||||
background: $accent;
|
||||
color: $background;
|
||||
/* opacity: .8; */
|
||||
|
||||
&.left {
|
||||
@ -128,10 +128,10 @@ figure {
|
||||
}
|
||||
|
||||
code, kbd {
|
||||
font-family: 'Fira Code', Monaco, Consolas, Ubuntu Mono, monospace;
|
||||
font-family: 'Fira Code', Monaco, Consolas, Ubuntu Mono, monospace !important;
|
||||
font-feature-settings: normal;
|
||||
background: color-mod(var(--accent) a(20%));
|
||||
color: var(--accent);
|
||||
background: transparentize($accent, .8);
|
||||
color: $accent;
|
||||
padding: 1px 6px;
|
||||
margin: 0 2px;
|
||||
font-size: .95rem;
|
||||
@ -147,7 +147,7 @@ pre {
|
||||
background: transparent !important;
|
||||
padding: 20px 10px;
|
||||
margin: 40px 0;
|
||||
font-size: .95rem;
|
||||
font-size: .95rem !important;
|
||||
overflow: auto;
|
||||
border-top: 1px solid rgba(255, 255, 255, .1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
@ -157,7 +157,7 @@ pre {
|
||||
margin-top: -40px;
|
||||
}
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
@ -172,12 +172,12 @@ pre {
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-top: 1px solid var(--accent);
|
||||
border-bottom: 1px solid var(--accent);
|
||||
border-top: 1px solid $accent;
|
||||
border-bottom: 1px solid $accent;
|
||||
margin: 40px 0;
|
||||
padding: 25px;
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
@ -198,15 +198,15 @@ blockquote {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -25px;
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
&.twitter-tweet {
|
||||
position: relative;
|
||||
background: color-mod(var(--accent) a(10%));
|
||||
background: transparentize($accent, .9);
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
border: 1px solid var(--accent);
|
||||
border: 1px solid $accent;
|
||||
padding-top: 60px;
|
||||
|
||||
p:before {
|
||||
@ -217,18 +217,18 @@ blockquote {
|
||||
content: '> From Twitter:';
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
table-layout: fixed;
|
||||
table-layout: auto;
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin: 40px 0;
|
||||
@ -237,24 +237,24 @@ table {
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border: 1px dashed var(--accent);
|
||||
border: 1px dashed $accent;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
th {
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin-left: 30px;
|
||||
margin-left: 22px;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
@ -263,27 +263,35 @@ ol {
|
||||
list-style: none;
|
||||
counter-reset: li;
|
||||
|
||||
li {
|
||||
> li {
|
||||
counter-increment: li;
|
||||
}
|
||||
|
||||
li:before {
|
||||
content: counter(li);
|
||||
position: absolute;
|
||||
right: calc(100% + 10px);
|
||||
color: var(--accent);
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
&:before {
|
||||
content: counter(li);
|
||||
position: absolute;
|
||||
right: calc(100% + 10px);
|
||||
color: $accent;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
ol ol {
|
||||
list-style-type: lower-alpha;
|
||||
> ol {
|
||||
margin-left: 38px;
|
||||
|
||||
> li {
|
||||
counter-increment: li;
|
||||
|
||||
&:before {
|
||||
content: counters(li, ".") " ";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mark {
|
||||
background: var(--accent);
|
||||
color: var(--background);
|
||||
background: $accent;
|
||||
color: $background;
|
||||
}
|
||||
|
||||
.container {
|
||||
@ -304,7 +312,7 @@ mark {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@ -325,10 +333,14 @@ mark {
|
||||
hr {
|
||||
width: 100%;
|
||||
border: none;
|
||||
background: var(--border-color);
|
||||
background: $border-color;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
sup {
|
||||
line-height: 0;
|
||||
}
|
157
assets/css/menu.scss
Normal file
@ -0,0 +1,157 @@
|
||||
@mixin menu {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
$shadow-color: transparentize($background, .2);
|
||||
$shadow: 0 10px $shadow-color, -10px 10px $shadow-color, 10px 10px $shadow-color;
|
||||
position: absolute;
|
||||
background: $background;
|
||||
box-shadow: $shadow;
|
||||
color: white;
|
||||
border: 2px solid;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
top: 10px;
|
||||
left: 0;
|
||||
list-style: none;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
@mixin header-menu-trigger {
|
||||
color: $accent;
|
||||
border: 2px solid;
|
||||
margin-left: 10px;
|
||||
height: 100%;
|
||||
padding: 3px 8px;
|
||||
margin-bottom: 0 !important;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.navigation-menu {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin: 20px 1px;
|
||||
|
||||
@media ($phone) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__inner {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-wrap: wrap;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
> li {
|
||||
flex: 0 0 auto;
|
||||
margin-bottom: 10px;
|
||||
white-space: nowrap;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media ($phone) {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.spacer {
|
||||
flex-grow: 1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
&__trigger {
|
||||
margin-right: 0 !important;
|
||||
color: $accent;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__dropdown {
|
||||
@include menu;
|
||||
|
||||
.open & {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
> li {
|
||||
flex: 0 0 auto;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--desktop {
|
||||
@media ($phone) {
|
||||
display: none
|
||||
}
|
||||
}
|
||||
|
||||
&--mobile {
|
||||
.menu__trigger {
|
||||
@include header-menu-trigger;
|
||||
display: none;
|
||||
|
||||
@media ($phone) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.menu__dropdown {
|
||||
@media ($phone) {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
flex: 0 0 auto;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--language-selector {
|
||||
.menu__trigger {
|
||||
@include header-menu-trigger;
|
||||
|
||||
@media ($phone) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.menu__dropdown {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
@ -15,7 +15,8 @@
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
padding: 5px 10px;
|
||||
background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
background: $background;
|
||||
color: transparentize($color, .7);
|
||||
font-size: .8rem;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
@ -37,6 +38,8 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-flow: row wrap;
|
||||
gap: 10px;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
@ -47,22 +50,20 @@
|
||||
.button {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1rem;
|
||||
border-radius: 8px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
appearance: none;
|
||||
overflow: hidden;
|
||||
|
||||
+ .button {
|
||||
margin-left: 10px;
|
||||
@media($phone) {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
padding: 8px 16px;
|
||||
text-decoration: none;
|
||||
text-overflow: ellipsis;
|
@ -3,7 +3,7 @@
|
||||
}
|
||||
|
||||
.framed {
|
||||
border: 1px solid var(--accent);
|
||||
border: 1px solid $accent;
|
||||
padding: 20px;
|
||||
|
||||
*:first-child {
|
||||
@ -25,27 +25,31 @@
|
||||
margin: 20px auto;
|
||||
padding: 20px 0;
|
||||
|
||||
@media (--tablet) {
|
||||
max-width: 660px;
|
||||
}
|
||||
|
||||
&:not(:last-of-type) {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
border-bottom: 1px solid $border-color;
|
||||
}
|
||||
|
||||
&-meta {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 10px;
|
||||
color: color-mod(var(--accent) a(70%));
|
||||
color: transparentize($accent, .3);
|
||||
|
||||
& > *:not(:first-child) {
|
||||
&::before {
|
||||
content: "::";
|
||||
display: inline-block;
|
||||
margin: 0 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-title {
|
||||
--border: 3px dotted var(--accent);
|
||||
$border: 3px dotted $accent;
|
||||
position: relative;
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
margin: 0 0 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: var(--border);
|
||||
border-bottom: $border;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
@ -53,7 +57,7 @@
|
||||
bottom: 2px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
border-bottom: var(--border);
|
||||
border-bottom: $border;
|
||||
}
|
||||
|
||||
a {
|
||||
@ -77,12 +81,12 @@
|
||||
}
|
||||
|
||||
&-cover {
|
||||
border: 20px solid var(--accent);
|
||||
border: 20px solid $accent;
|
||||
background: transparent;
|
||||
margin: 40px 0;
|
||||
padding: 20px;
|
||||
|
||||
@media (--phone) {
|
||||
@media ($phone) {
|
||||
padding: 10px;
|
||||
border-width: 10px;
|
||||
}
|
||||
@ -95,7 +99,7 @@
|
||||
content: '-';
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
color: var(--accent);
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -117,7 +121,7 @@
|
||||
}
|
||||
|
||||
.hanchor {
|
||||
color: color-mod(var(--accent) alpha(90%));
|
||||
color: transparentize($accent, .1);
|
||||
text-decoration: none;
|
||||
margin-left: 10px;
|
||||
visibility: hidden;
|
||||
@ -128,5 +132,5 @@ h1:hover a, h2:hover a, h3:hover a, h4:hover a {
|
||||
}
|
||||
|
||||
.footnotes {
|
||||
color: color-mod(var(--color) alpha(50%));
|
||||
color: transparentize($color, .5);
|
||||
}
|
@ -1,204 +0,0 @@
|
||||
/* PrismJS 1.15.0
|
||||
https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+actionscript+apacheconf+applescript+c+csharp+bash+cpp+coffeescript+ruby+csp+css-extras+diff+django+docker+elixir+elm+markup-templating+erlang+fsharp+flow+git+go+graphql+less+handlebars+haskell+http+java+json+kotlin+latex+markdown+makefile+objectivec+ocaml+perl+php+php-extras+sql+processing+scss+python+jsx+typescript+reason+textile+rust+sass+stylus+scheme+pug+swift+yaml+haml+toml+twig+tsx+vim+visual-basic+wasm&plugins=line-numbers+toolbar+jsonp-highlight+command-line+copy-to-clipboard */
|
||||
/**
|
||||
* prism.js tomorrow night eighties for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/chriskempson/tomorrow-theme
|
||||
* @author Rose Pritchard
|
||||
*/
|
||||
|
||||
:root {
|
||||
--code-margin: 40px;
|
||||
}
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: none;
|
||||
font-family: inherit, monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
tab-size: 2;
|
||||
hyphens: none;
|
||||
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: 0;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers {
|
||||
position: relative;
|
||||
padding-left: 3.8em;
|
||||
counter-reset: linenumber;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers > code {
|
||||
position: relative;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
.line-numbers .line-numbers-rows {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
top: 0;
|
||||
font-size: 100%;
|
||||
left: -3.8em;
|
||||
width: 3em; /* works for line-numbers below 1000 lines */
|
||||
letter-spacing: -1px;
|
||||
border-right: 1px solid color-mod(var(--accent) blend(#999 90%) a(20%));
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.line-numbers-rows > span {
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
counter-increment: linenumber;
|
||||
}
|
||||
|
||||
.line-numbers-rows > span:before {
|
||||
content: counter(linenumber);
|
||||
color: color-mod(var(--accent) blend(#999 90%) a(40%));
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.code-toolbar {
|
||||
position: relative;
|
||||
margin: var(--code-margin) 0;
|
||||
padding: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
|
||||
+ .code-toolbar,
|
||||
+ .highlight,
|
||||
+ .highlight .code-toolbar {
|
||||
border-top: 0;
|
||||
margin-top: calc(-1 * var(--code-margin));
|
||||
}
|
||||
|
||||
pre, code {
|
||||
border: none;
|
||||
}
|
||||
|
||||
code {
|
||||
display: block;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight + .highlight .code-toolbar {
|
||||
border-top: 0;
|
||||
margin-top: calc(-1 * var(--code-margin));
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
div.code-toolbar:hover > .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar .toolbar-item {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar button {
|
||||
background: none;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
line-height: normal;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a,
|
||||
div.code-toolbar > .toolbar button,
|
||||
div.code-toolbar > .toolbar span {
|
||||
color: #bbb;
|
||||
font-size: .8em;
|
||||
padding: 10px;
|
||||
background: #f5f2f0;
|
||||
background: rgba(224, 224, 224, 0.2);
|
||||
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar a:hover,
|
||||
div.code-toolbar > .toolbar a:focus,
|
||||
div.code-toolbar > .toolbar button:hover,
|
||||
div.code-toolbar > .toolbar button:focus,
|
||||
div.code-toolbar > .toolbar span:hover,
|
||||
div.code-toolbar > .toolbar span:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.command-line-prompt {
|
||||
border-right: 1px solid #999;
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 100%;
|
||||
letter-spacing: -1px;
|
||||
margin-right: 1em;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.command-line-prompt > span:before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-user]:before {
|
||||
content: "[" attr(data-user) "@" attr(data-host) "] $";
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-user="root"]:before {
|
||||
content: "[" attr(data-user) "@" attr(data-host) "] #";
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-prompt]:before {
|
||||
content: attr(data-prompt);
|
||||
}
|
336
assets/css/prism.scss
Normal file
@ -0,0 +1,336 @@
|
||||
/* PrismJS 1.24.1
|
||||
https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+actionscript+apacheconf+applescript+bash+c+csharp+cpp+cmake+coffeescript+csp+css-extras+diff+django+docker+elixir+elm+erlang+fsharp+flow+git+go+graphql+haml+handlebars+haskell+http+java+json+kotlin+latex+less+llvm+makefile+markdown+markup-templating+nasm+objectivec+ocaml+perl+php+php-extras+powershell+processing+pug+python+r+jsx+tsx+reason+ruby+rust+sass+scss+scala+scheme+sql+stylus+swift+textile+toml+twig+typescript+vim+visual-basic+wasm+yaml&plugins=line-highlight+line-numbers+jsonp-highlight+highlight-keywords+command-line+toolbar+copy-to-clipboard */
|
||||
/**
|
||||
* prism.js tomorrow night eighties for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/chriskempson/tomorrow-theme
|
||||
* @author Rose Pritchard
|
||||
*/
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: #ccc;
|
||||
background: none;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #2d2d2d;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.token.tag,
|
||||
.token.attr-name,
|
||||
.token.namespace,
|
||||
.token.deleted {
|
||||
color: #e2777a;
|
||||
}
|
||||
|
||||
.token.function-name {
|
||||
color: #6196cc;
|
||||
}
|
||||
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.function {
|
||||
color: #f08d49;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.class-name,
|
||||
.token.constant,
|
||||
.token.symbol {
|
||||
color: #f8c555;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.important,
|
||||
.token.atrule,
|
||||
.token.keyword,
|
||||
.token.builtin {
|
||||
color: #cc99cd;
|
||||
}
|
||||
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.attr-value,
|
||||
.token.regex,
|
||||
.token.variable {
|
||||
color: #7ec699;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url {
|
||||
color: #67cdcc;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.token.inserted {
|
||||
color: green;
|
||||
}
|
||||
|
||||
pre[data-line] {
|
||||
position: relative;
|
||||
padding: 1em 0 1em 3em;
|
||||
}
|
||||
|
||||
.line-highlight {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: inherit 0;
|
||||
margin-top: 1em; /* Same as .prism’s padding-top */
|
||||
|
||||
background: hsla(24, 20%, 50%,.08);
|
||||
background: linear-gradient(to right, hsla(24, 20%, 50%,.1) 70%, hsla(24, 20%, 50%,0));
|
||||
|
||||
pointer-events: none;
|
||||
|
||||
line-height: inherit;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.line-highlight {
|
||||
/*
|
||||
* This will prevent browsers from replacing the background color with white.
|
||||
* It's necessary because the element is layered on top of the displayed code.
|
||||
*/
|
||||
-webkit-print-color-adjust: exact;
|
||||
color-adjust: exact;
|
||||
}
|
||||
}
|
||||
|
||||
.line-highlight:before,
|
||||
.line-highlight[data-end]:after {
|
||||
content: attr(data-start);
|
||||
position: absolute;
|
||||
top: .4em;
|
||||
left: .6em;
|
||||
min-width: 1em;
|
||||
padding: 0 .5em;
|
||||
background-color: hsla(24, 20%, 50%,.4);
|
||||
color: hsl(24, 20%, 95%);
|
||||
font: bold 65%/1.5 sans-serif;
|
||||
text-align: center;
|
||||
vertical-align: .3em;
|
||||
border-radius: 999px;
|
||||
text-shadow: none;
|
||||
box-shadow: 0 1px white;
|
||||
}
|
||||
|
||||
.line-highlight[data-end]:after {
|
||||
content: attr(data-end);
|
||||
top: auto;
|
||||
bottom: .4em;
|
||||
}
|
||||
|
||||
.line-numbers .line-highlight:before,
|
||||
.line-numbers .line-highlight:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows {
|
||||
pointer-events: all;
|
||||
}
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows > span:before {
|
||||
cursor: pointer;
|
||||
}
|
||||
pre[id].linkable-line-numbers span.line-numbers-rows > span:hover:before {
|
||||
background-color: rgba(128, 128, 128, .2);
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers {
|
||||
position: relative;
|
||||
padding-left: 3.8em;
|
||||
counter-reset: linenumber;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers > code {
|
||||
position: relative;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
.line-numbers .line-numbers-rows {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
top: 0;
|
||||
font-size: 100%;
|
||||
left: -3.8em;
|
||||
width: 3em; /* works for line-numbers below 1000 lines */
|
||||
letter-spacing: -1px;
|
||||
border-right: 1px solid #999;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.line-numbers-rows > span {
|
||||
display: block;
|
||||
counter-increment: linenumber;
|
||||
}
|
||||
|
||||
.line-numbers-rows > span:before {
|
||||
content: counter(linenumber);
|
||||
color: #999;
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.command-line-prompt {
|
||||
border-right: 1px solid #999;
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 100%;
|
||||
letter-spacing: -1px;
|
||||
margin-right: 1em;
|
||||
pointer-events: none;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.command-line-prompt > span:before {
|
||||
color: #999;
|
||||
content: ' ';
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-user]:before {
|
||||
content: "[" attr(data-user) "@" attr(data-host) "] $";
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-user="root"]:before {
|
||||
content: "[" attr(data-user) "@" attr(data-host) "] #";
|
||||
}
|
||||
|
||||
.command-line-prompt > span[data-prompt]:before {
|
||||
content: attr(data-prompt);
|
||||
}
|
||||
|
||||
div.code-toolbar {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar {
|
||||
position: absolute;
|
||||
top: .3em;
|
||||
right: .2em;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
div.code-toolbar:hover > .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Separate line b/c rules are thrown out if selector is invalid.
|
||||
IE11 and old Edge versions don't support :focus-within. */
|
||||
div.code-toolbar:focus-within > .toolbar {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button {
|
||||
background: none;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
line-height: normal;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
-webkit-user-select: none; /* for button */
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span {
|
||||
color: #bbb;
|
||||
font-size: .8em;
|
||||
padding: 0 .5em;
|
||||
background: #f5f2f0;
|
||||
background: rgba(224, 224, 224, 0.2);
|
||||
box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
|
||||
border-radius: .5em;
|
||||
}
|
||||
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > a:focus,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > button:focus,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span:hover,
|
||||
div.code-toolbar > .toolbar > .toolbar-item > span:focus {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
@ -1,16 +0,0 @@
|
||||
@import 'variables.css';
|
||||
|
||||
@import 'font.css';
|
||||
@import 'buttons.css';
|
||||
|
||||
@import 'header.css';
|
||||
@import 'logo.css';
|
||||
@import 'main.css';
|
||||
@import 'post.css';
|
||||
@import 'pagination.css';
|
||||
@import 'footer.css';
|
||||
|
||||
@import 'prism.css';
|
||||
@import 'syntax.css';
|
||||
@import 'code.css';
|
||||
@import 'terms.css';
|
19
assets/css/style.scss
Normal file
@ -0,0 +1,19 @@
|
||||
@import "variables";
|
||||
|
||||
@import "font";
|
||||
@import "buttons";
|
||||
@import "form";
|
||||
|
||||
@import "header";
|
||||
@import "menu";
|
||||
@import "logo";
|
||||
@import "main";
|
||||
@import "post";
|
||||
@import "pagination";
|
||||
@import "footer";
|
||||
|
||||
@import "prism";
|
||||
@import "syntax";
|
||||
@import "code";
|
||||
@import "terms";
|
||||
@import "gist";
|
@ -14,8 +14,10 @@ code.language-scss,
|
||||
.token.statement,
|
||||
.token.regex,
|
||||
.token.atrule,
|
||||
.token.number {
|
||||
color: var(--accent);
|
||||
.token.number,
|
||||
.token.inserted,
|
||||
.token.important {
|
||||
color: $accent !important;
|
||||
}
|
||||
|
||||
.token.tag-id,
|
||||
@ -24,16 +26,25 @@ code.language-scss,
|
||||
.token.unit,
|
||||
.token.placeholder,
|
||||
.token.variable,
|
||||
.token.attr-name {
|
||||
color: color-mod(var(--accent) a(70%));
|
||||
.token.tag,
|
||||
.token.attr-name,
|
||||
.token.namespace,
|
||||
.token.deleted,
|
||||
.token.property,
|
||||
.token.class-name,
|
||||
.token.constant,
|
||||
.token.symbol {
|
||||
color: transparentize($accent, .3) !important;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.function,
|
||||
.token.function-name,
|
||||
.token.deleted,
|
||||
code.language-javascript,
|
||||
code.language-html,
|
||||
.command-line-prompt > span:before {
|
||||
color: color-mod(var(--accent) blend(#999 90%));
|
||||
color: mix($accent, #999, .9) !important;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
@ -46,24 +57,30 @@ code.language-html,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: rgba(255, 255, 255, .3);
|
||||
color: rgba(255, 255, 255, .3) !important;
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
opacity: .7;
|
||||
opacity: .7 !important;
|
||||
}
|
||||
|
||||
pre[data-line] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
pre[class*="language-"] {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.line-highlight {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: color-mod(var(--accent) blend(#999 90%) a(8%));
|
||||
background: transparentize(mix($accent, #999, 90%), .92);
|
||||
pointer-events: none;
|
||||
line-height: inherit;
|
||||
white-space: pre;
|
||||
@ -97,3 +114,40 @@ pre[data-line] {
|
||||
.line-numbers .line-highlight:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.code-toolbar {
|
||||
$code-margin: 40px;
|
||||
position: relative;
|
||||
margin: $code-margin 0;
|
||||
padding: 20px;
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
|
||||
+ .code-toolbar,
|
||||
+ .highlight,
|
||||
+ .highlight .code-toolbar {
|
||||
border-top: 0;
|
||||
margin-top: calc(-1 * $code-margin);
|
||||
}
|
||||
|
||||
pre, code {
|
||||
border: none;
|
||||
}
|
||||
|
||||
code {
|
||||
display: block;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
> .toolbar {
|
||||
button {
|
||||
font-size: .8em !important;
|
||||
background: hsla(0,0%,87.8%,.2) !important;
|
||||
color: #bbb !important;
|
||||
box-shadow: 0 2px 0 0 rgba(0,0,0,.2) !important;
|
||||
border-radius: 0 !important;
|
||||
margin: 6px !important;
|
||||
padding: 10px !important;
|
||||
user-select:none
|
||||
}
|
||||
}
|
||||
}
|
@ -1,9 +0,0 @@
|
||||
.terms {
|
||||
h1 {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: initial;
|
||||
}
|
||||
}
|
22
assets/css/terms.scss
Normal file
@ -0,0 +1,22 @@
|
||||
.terms {
|
||||
h3 {
|
||||
font-size: initial;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
a {
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
li:not(:empty):before {
|
||||
content: '-';
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,13 +0,0 @@
|
||||
:root {
|
||||
--accent: #FFA86A;
|
||||
--background: color-mod(var(--accent) blend(#1D1E28 98%));
|
||||
--color: white;
|
||||
--border-color: rgba(255, 255, 255, .1);
|
||||
|
||||
/* variables for js, must be the same as these in @custom-media queries */
|
||||
--phoneWidth: (max-width: 684px);
|
||||
--tabletWidth: (max-width: 900px);
|
||||
}
|
||||
|
||||
@custom-media --phone (width < 684px);
|
||||
@custom-media --tablet (width < 900px);
|
8
assets/css/variables.scss
Normal file
@ -0,0 +1,8 @@
|
||||
/* COLOR VARIABLES */
|
||||
$background: mix($accent, #1D1E28, 2%);
|
||||
$color: white;
|
||||
$border-color: rgba(255, 255, 255, .1);
|
||||
|
||||
/* MEDIA QUERIES */
|
||||
$phone: "max-width: 684px";
|
||||
$tablet: "max-width: 900px";
|
@ -1,18 +0,0 @@
|
||||
const mobileQuery = getComputedStyle(document.body).getPropertyValue("--phoneWidth");
|
||||
const isMobile = () => window.matchMedia(mobileQuery).matches;
|
||||
|
||||
if(!isMobile()) {
|
||||
languageSelector = document.querySelector(".language-selector-current");
|
||||
moreLanguagesContainer = document.querySelector(".language-selector__more");
|
||||
|
||||
document.body.addEventListener("click", () => {
|
||||
if (moreLanguagesContainer && !moreLanguagesContainer.classList.contains("hidden")) {
|
||||
moreLanguagesContainer.classList.add("hidden");
|
||||
}
|
||||
});
|
||||
|
||||
languageSelector && languageSelector.addEventListener("click", e => {
|
||||
e.stopPropagation();
|
||||
moreLanguagesContainer.classList.toggle("hidden");
|
||||
});
|
||||
}
|
@ -1 +0,0 @@
|
||||
// Add your script here
|
@ -1,51 +1,44 @@
|
||||
const container = document.querySelector(".container");
|
||||
const menu = document.querySelector(".menu");
|
||||
const mobileMenuTrigger = document.querySelector(".menu-trigger");
|
||||
const desktopMenu = document.querySelector(".menu__inner--desktop");
|
||||
const desktopMenuTrigger = document.querySelector(".menu__sub-inner-more-trigger");
|
||||
const menuMore = document.querySelector(".menu__sub-inner-more");
|
||||
const mobileQuery = getComputedStyle(document.body).getPropertyValue("--phoneWidth");
|
||||
const isMobile = () => window.matchMedia(mobileQuery).matches;
|
||||
const handleMenuClasses = () => {
|
||||
mobileMenuTrigger && mobileMenuTrigger.classList.toggle("hidden", !isMobile());
|
||||
menu && menu.classList.toggle("hidden", isMobile());
|
||||
menuMore && menuMore.classList.toggle("hidden", !isMobile());
|
||||
};
|
||||
|
||||
// Common
|
||||
|
||||
menu && menu.addEventListener("click", e => e.stopPropagation());
|
||||
menuMore && menuMore.addEventListener("click", e => e.stopPropagation());
|
||||
|
||||
handleMenuClasses();
|
||||
const allMenus = document.querySelectorAll(".menu");
|
||||
|
||||
// Hide menus on body click
|
||||
document.body.addEventListener("click", () => {
|
||||
if (!isMobile() && menuMore && !menuMore.classList.contains("hidden")) {
|
||||
menuMore.classList.add("hidden");
|
||||
} else if (isMobile() && !menu.classList.contains("hidden")) {
|
||||
menu.classList.add("hidden");
|
||||
}
|
||||
});
|
||||
|
||||
window.addEventListener("resize", handleMenuClasses);
|
||||
|
||||
// Mobile menu
|
||||
|
||||
mobileMenuTrigger &&
|
||||
mobileMenuTrigger.addEventListener("click", e => {
|
||||
e.stopPropagation();
|
||||
menu && menu.classList.toggle("hidden");
|
||||
});
|
||||
|
||||
// Desktop menu
|
||||
|
||||
desktopMenuTrigger &&
|
||||
desktopMenuTrigger.addEventListener("click", e => {
|
||||
e.stopPropagation();
|
||||
menuMore && menuMore.classList.toggle("hidden");
|
||||
|
||||
if (menuMore.getBoundingClientRect().right > container.getBoundingClientRect().right) {
|
||||
menuMore.style.left = "auto";
|
||||
menuMore.style.right = 0;
|
||||
allMenus.forEach(menu => {
|
||||
if (menu.classList.contains("open")) {
|
||||
menu.classList.remove("open");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Reset menus on resize
|
||||
window.addEventListener("resize", () => {
|
||||
allMenus.forEach(menu => {
|
||||
menu.classList.remove("open");
|
||||
});
|
||||
});
|
||||
|
||||
// Handle desktop menu
|
||||
allMenus.forEach(menu => {
|
||||
const trigger = menu.querySelector(".menu__trigger");
|
||||
const dropdown = menu.querySelector(".menu__dropdown");
|
||||
|
||||
trigger.addEventListener("click", e => {
|
||||
e.stopPropagation();
|
||||
|
||||
if (menu.classList.contains("open")) {
|
||||
menu.classList.remove("open");
|
||||
} else {
|
||||
// Close all menus...
|
||||
allMenus.forEach(m => m.classList.remove("open"));
|
||||
// ...before opening the current one
|
||||
menu.classList.add("open");
|
||||
}
|
||||
|
||||
if (dropdown.getBoundingClientRect().right > container.getBoundingClientRect().right) {
|
||||
dropdown.style.left = "auto";
|
||||
dropdown.style.right = 0;
|
||||
}
|
||||
});
|
||||
|
||||
dropdown.addEventListener("click", e => e.stopPropagation());
|
||||
});
|
||||
|
4
config.toml
Normal file
@ -0,0 +1,4 @@
|
||||
[module]
|
||||
[module.hugoVersion]
|
||||
extended = true
|
||||
min = '0.90.0'
|
@ -4,7 +4,7 @@ theme = "hugo-theme-terminal"
|
||||
paginate = 5
|
||||
|
||||
[params]
|
||||
contentTypeName = "post"
|
||||
contentTypeName = "posts"
|
||||
themeColor = "orange"
|
||||
showMenuItems = 2
|
||||
fullWidthTheme = false
|
||||
|
@ -7,7 +7,7 @@
|
||||
{{ partial "head.html" . }}
|
||||
</head>
|
||||
<body class="{{- ( or .Params.color $.Site.Params.ThemeColor ) -}}">
|
||||
{{ $container := cond $.Site.Params.FullWidthTheme "container full" (cond $.Site.Params.CenterTheme "container center" "container") }}
|
||||
{{ $container := cond ($.Site.Params.FullWidthTheme | default false) "container full" (cond ($.Site.Params.CenterTheme | default false) "container center" "container") }}
|
||||
|
||||
<div class="{{- $container -}}{{- cond ($.Site.Params.oneHeadingSize | default true) " headings--one-size" "" }}">
|
||||
|
||||
|
@ -15,17 +15,20 @@
|
||||
{{ $paginator := .Paginate (where $PageContext.RegularPages "Type" $contentTypeName) }}
|
||||
|
||||
{{ range $paginator.Pages }}
|
||||
<div class="post on-list">
|
||||
<article class="post on-list">
|
||||
<h1 class="post-title">
|
||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
||||
</h1>
|
||||
|
||||
<div class="post-meta">
|
||||
<span class="post-date">
|
||||
{{ .Date.Format "2006-01-02" }}
|
||||
</span>
|
||||
{{ with .Params.Author }}
|
||||
<span class="post-author">:: {{ . }}</span>
|
||||
{{ end }}
|
||||
{{- if .Date -}}
|
||||
<time class="post-date">
|
||||
{{- .Date.Format "2006-01-02" -}}
|
||||
</time>
|
||||
{{- end -}}
|
||||
{{- with .Params.Author -}}
|
||||
<span class="post-author">{{ . }}</span>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
{{ if .Params.tags }}
|
||||
@ -38,30 +41,26 @@
|
||||
</span>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Params.Cover }}
|
||||
<img src="{{ .Params.Cover | absURL }}" class="post-cover" alt="{{ .Title | plainify | default " " }}" />
|
||||
{{ end }}
|
||||
{{ partial "cover.html" . }}
|
||||
|
||||
<div class="post-content">
|
||||
{{ if .Params.showFullContent }}
|
||||
{{ .Content | markdownify }}
|
||||
{{ .Content }}
|
||||
{{ else if .Description }}
|
||||
{{ .Description | markdownify }}
|
||||
{{ .Description | markdownify }}
|
||||
{{ else }}
|
||||
{{ if .Truncated }}
|
||||
{{ .Summary | markdownify }}
|
||||
{{ end }}
|
||||
{{ .Summary }}
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if not .Params.showFullContent }}
|
||||
<div>
|
||||
<a class="read-more button"
|
||||
href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →</a>
|
||||
</div>
|
||||
<div>
|
||||
<a class="read-more button" href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
{{ partial "pagination.html" . }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
@ -5,18 +5,20 @@
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="posts">
|
||||
{{ range .Pages }}
|
||||
<div class="post on-list">
|
||||
{{ range .Paginator.Pages }}
|
||||
<article class="post on-list">
|
||||
<h1 class="post-title">
|
||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
||||
</h1>
|
||||
<div class="post-meta">
|
||||
<span class="post-date">
|
||||
{{ .Date.Format "2006-01-02" }}
|
||||
</span>
|
||||
{{ with .Params.Author }}
|
||||
<span class="post-author">:: {{ . }}</span>
|
||||
{{ end }}
|
||||
{{- if .Date -}}
|
||||
<time class="post-date">
|
||||
{{- .Date.Format "2006-01-02" -}}
|
||||
</time>
|
||||
{{- end -}}
|
||||
{{- with .Params.Author -}}
|
||||
<span class="post-author">{{- . -}}</span>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
{{ if .Params.tags }}
|
||||
@ -29,30 +31,26 @@
|
||||
</span>
|
||||
{{ end }}
|
||||
|
||||
{{ if .Params.Cover }}
|
||||
<img src="{{ .Params.Cover | absURL }}" class="post-cover" alt="{{ .Title | plainify | default " " }}" />
|
||||
{{ end }}
|
||||
{{ partial "cover.html" . }}
|
||||
|
||||
<div class="post-content">
|
||||
{{ if .Params.showFullContent }}
|
||||
{{ .Content | markdownify }}
|
||||
{{ .Content }}
|
||||
{{ else if .Description }}
|
||||
{{ .Description | markdownify }}
|
||||
{{ .Description | markdownify }}
|
||||
{{ else }}
|
||||
{{ if .Truncated }}
|
||||
{{ .Summary | markdownify }}
|
||||
{{ end }}
|
||||
{{ .Summary }}
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if not .Params.showFullContent }}
|
||||
<div>
|
||||
<a class="read-more button"
|
||||
href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →</a>
|
||||
</div>
|
||||
<div>
|
||||
<a class="read-more button" href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
{{ partial "pagination.html" . }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
40
layouts/_default/rss.xml
Normal file
@ -0,0 +1,40 @@
|
||||
{{- $pctx := . -}}
|
||||
{{- if .IsHome -}}{{ $pctx = .Site }}{{- end -}}
|
||||
{{- $pages := slice -}}
|
||||
{{- if or $.IsHome $.IsSection -}}
|
||||
{{- $pages = $pctx.RegularPages -}}
|
||||
{{- else -}}
|
||||
{{- $pages = $pctx.Pages -}}
|
||||
{{- end -}}
|
||||
{{- $limit := .Site.Config.Services.RSS.Limit -}}
|
||||
{{- if ge $limit 1 -}}
|
||||
{{- $pages = $pages | first $limit -}}
|
||||
{{- end -}}
|
||||
{{- printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
|
||||
<link>{{ .Permalink }}</link>
|
||||
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
|
||||
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
|
||||
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
|
||||
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
|
||||
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
|
||||
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
|
||||
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
|
||||
{{- with .OutputFormats.Get "RSS" -}}
|
||||
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
|
||||
{{- end -}}
|
||||
{{ range $pages }}
|
||||
<item>
|
||||
<title>{{ .Title }}</title>
|
||||
<link>{{ .Permalink }}</link>
|
||||
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
|
||||
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
|
||||
<guid>{{ .Permalink }}</guid>
|
||||
<description>{{ .Summary | html }}</description>
|
||||
<content>{{ .Content | html }}</content>
|
||||
</item>
|
||||
{{ end }}
|
||||
</channel>
|
||||
</rss>
|
@ -1,40 +1,38 @@
|
||||
{{ define "main" }}
|
||||
<div class="post">
|
||||
<article class="post">
|
||||
<h1 class="post-title">
|
||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h1>
|
||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
||||
</h1>
|
||||
<div class="post-meta">
|
||||
{{ if .Params.Date }}
|
||||
<span class="post-date">
|
||||
{{ .Date.Format "2006-01-02" }} {{ if $.Site.Params.showLastUpdated }}[{{or $.Site.Params.updatedDatePrefix "Updated"}}: {{ .Lastmod.Format "2006-01-02" }}]{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ with .Params.Author }}
|
||||
<span class="post-author">:: {{ . }}</span>
|
||||
{{ end }}
|
||||
{{- if .Date -}}
|
||||
<time class="post-date">
|
||||
{{- .Date.Format "2006-01-02" -}}
|
||||
{{- if $.Site.Params.showLastUpdated -}}
|
||||
[{{- or $.Site.Params.updatedDatePrefix "Updated" -}} :: {{- .Lastmod.Format "2006-01-02" -}}]
|
||||
{{- end -}}
|
||||
</time>
|
||||
{{- end -}}
|
||||
{{- with .Params.Author -}}
|
||||
<span class="post-author">{{ . }}</span>
|
||||
{{- end -}}
|
||||
{{- if and (.Param "readingTime") (eq (.Param "readingTime") true) -}}
|
||||
<span class="post-reading-time">{{ .ReadingTime }} {{ $.Site.Params.minuteReadingTime | default "min read" }} ({{ .WordCount }} {{ $.Site.Params.words | default "words" }})</span>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
{{ if .Params.tags }}
|
||||
<span class="post-tags">
|
||||
{{ range .Params.tags }}
|
||||
#<a href="{{ (urlize (printf "tags/%s/" .)) | absLangURL }}">{{ . }}</a>
|
||||
{{ end }}
|
||||
</span>
|
||||
<span class="post-tags">
|
||||
{{ range .Params.tags }}
|
||||
#<a href="{{ (urlize (printf "tags/%s/" .)) | absLangURL }}">{{ . }}</a>
|
||||
{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ partial "cover.html" . }}
|
||||
|
||||
{{ if .Params.Cover }}
|
||||
<img src="{{ .Params.Cover | absURL }}" class="post-cover" alt="{{ .Title | plainify | default " " }}" />
|
||||
{{ end }}
|
||||
|
||||
{{ if .Params.Toc }}
|
||||
{{ if (.Params.Toc | default .Site.Params.Toc) }}
|
||||
<div class="table-of-contents">
|
||||
<h2>
|
||||
{{ if .Params.TocTitle }}
|
||||
{{ .Params.TocTitle }}
|
||||
{{ else if $.Site.Params.TocTitle }}
|
||||
{{ $.Site.Params.TocTitle }}
|
||||
{{ else }}
|
||||
Table of Contents
|
||||
{{ end }}
|
||||
{{ (.Params.TocTitle | default .Site.Params.TocTitle) | default "Table of Contents" }}
|
||||
</h2>
|
||||
{{ .TableOfContents }}
|
||||
</div>
|
||||
@ -49,9 +47,11 @@
|
||||
</div>
|
||||
|
||||
{{ if eq .Type $.Site.Params.contentTypeName }}
|
||||
{{ partial "posts_pagination.html" . }}
|
||||
{{ partial "posts_pagination.html" . }}
|
||||
{{ end }}
|
||||
|
||||
{{ partial "comments.html" . }}
|
||||
</div>
|
||||
{{ if not (.Params.hideComments | default false) }}
|
||||
{{ partial "comments.html" . }}
|
||||
{{ end }}
|
||||
</article>
|
||||
{{ end }}
|
||||
|
57
layouts/_default/term.html
Normal file
@ -0,0 +1,57 @@
|
||||
{{ define "main" }}
|
||||
<h1>Posts for: #{{ .Title }}</h1>
|
||||
{{ with .Content }}
|
||||
<div class="index-content">
|
||||
{{ . }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="posts">
|
||||
{{ range .Paginator.Pages }}
|
||||
<article class="post on-list">
|
||||
<h1 class="post-title">
|
||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
||||
</h1>
|
||||
<div class="post-meta">
|
||||
{{- if .Date -}}
|
||||
<time class="post-date">
|
||||
{{- .Date.Format "2006-01-02" -}}
|
||||
</time>
|
||||
{{- end -}}
|
||||
{{- with .Params.Author -}}
|
||||
<span class="post-author">{{- . -}}</span>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
{{ if .Params.tags }}
|
||||
<span class="post-tags">
|
||||
{{ range .Params.tags }}
|
||||
#<a href="{{ (urlize (printf "tags/%s/" . )) | absLangURL }}">
|
||||
{{- . -}}
|
||||
</a>
|
||||
{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
|
||||
{{ partial "cover.html" . }}
|
||||
|
||||
<div class="post-content">
|
||||
{{ if .Params.showFullContent }}
|
||||
{{ .Content }}
|
||||
{{ else if .Description }}
|
||||
{{ .Description | markdownify }}
|
||||
{{ else }}
|
||||
{{ .Summary }}
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if not .Params.showFullContent }}
|
||||
<div>
|
||||
<a class="read-more button" href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
{{ partial "pagination.html" . }}
|
||||
</div>
|
||||
{{ end }}
|
@ -1,6 +1,11 @@
|
||||
{{ define "main" }}
|
||||
<div class="terms">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ with .Content }}
|
||||
<div class="index-content">
|
||||
{{ . }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<ul>
|
||||
{{ $type := .Type }}
|
||||
{{ range $key, $value := .Data.Terms.Alphabetical }}
|
||||
@ -8,7 +13,7 @@
|
||||
{{ $count := .Count }}
|
||||
{{ with $.Site.GetPage (printf "/%s/%s" $type $name) }}
|
||||
<li>
|
||||
<a class="terms-title" href="{{ .Permalink }}">{{ .Name }} ({{ $count }})</a>
|
||||
<a class="terms-title" href="{{ .Permalink }}">{{ .Name }} [{{ $count }}]</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
24
layouts/partials/cover.html
Normal file
@ -0,0 +1,24 @@
|
||||
{{- $cover := false -}}
|
||||
{{- $autoCover := default $.Site.Params.autoCover false }}
|
||||
|
||||
{{- if index .Params "cover" -}}
|
||||
{{- if .Resources.GetMatch .Params.Cover }}
|
||||
{{- $cover = (.Resources.GetMatch .Params.Cover).RelPermalink -}}
|
||||
{{- else -}}
|
||||
{{- $cover = absURL .Params.Cover -}}
|
||||
{{- end -}}
|
||||
{{- else if $.Site.Params.AutoCover -}}
|
||||
{{- if (not .Params.Cover) -}}
|
||||
{{- if .Resources.GetMatch "cover.*" -}}
|
||||
{{- $cover = (.Resources.GetMatch "cover.*").RelPermalink -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{if $cover -}}
|
||||
<!-- Cover image found -->
|
||||
<img src="{{ $cover }}"
|
||||
class="post-cover"
|
||||
alt="{{ .Title | plainify | default " " }}"
|
||||
title="{{ .Params.CoverCredit |plainify|default "Cover Image" }}" />
|
||||
{{- end }}
|
@ -3,22 +3,21 @@
|
||||
{{ if $.Site.Copyright }}
|
||||
<div class="copyright copyright--user">
|
||||
<span>{{ $.Site.Copyright | safeHTML }}</span>
|
||||
{{else}}
|
||||
{{ else }}
|
||||
<div class="copyright">
|
||||
<span>© {{ now.Year }} Powered by <a href="http://gohugo.io">Hugo</a></span>
|
||||
{{end}}
|
||||
<span>:: Theme made by <a href="https://twitter.com/panr">panr</a></span>
|
||||
<span>© {{ now.Year }} Powered by <a href="https://gohugo.io">Hugo</a></span>
|
||||
{{ end }}
|
||||
<span>:: <a href="https://github.com/panr/hugo-theme-terminal" target="_blank">Theme</a> made by <a href="https://github.com/panr" target="_blank">panr</a></span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
{{ $js := resources.Get "js/main.js" | js.Build }}
|
||||
{{ $js := resources.Get "js/prism.js" | js.Build }}
|
||||
{{ $opts := dict "noComments" true "minified" true "compact" true }}
|
||||
{{ $menu := resources.Get "js/menu.js" | js.Build | babel $opts }}
|
||||
{{ $prism := resources.Get "js/prism.js" | js.Build | babel $opts }}
|
||||
<script src="{{ $menu.Permalink }}"></script>
|
||||
<script src="{{ $prism.Permalink }}"></script>
|
||||
{{ $menu := resources.Get "js/menu.js" | js.Build }}
|
||||
{{ $prism := resources.Get "js/prism.js" | js.Build }}
|
||||
|
||||
{{ $bundle := slice $menu $prism | resources.Concat "bundle.js" | resources.Minify }}
|
||||
|
||||
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
|
||||
|
||||
<!-- Extended footer section-->
|
||||
{{ partial "extended_footer.html" . }}
|
||||
|
@ -1,22 +1,32 @@
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="{{ if .IsHome }}{{ .Site.Params.Subtitle }}{{ else }}{{ .Summary | plainify }}{{ end }}" />
|
||||
<meta name="description" content="{{ if .IsHome }}{{ $.Site.Params.Subtitle }}{{ else if .Description}}{{ .Description | plainify }}{{ else }}{{ .Summary | plainify }}{{ end }}" />
|
||||
<meta name="keywords" content="{{ with .Params.Keywords }}{{ delimit . ", " }}{{ else }}{{ $.Site.Params.Keywords }}{{ end }}" />
|
||||
<meta name="robots" content="noodp" />
|
||||
{{ if .Params.noindex }}
|
||||
{{ if or (eq (.Param "noindex") true) (eq (.Param "noindex") "true") }}
|
||||
<meta name="robots" content="noindex" />
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<meta name="robots" content="noodp" />
|
||||
{{ end }}
|
||||
<link rel="canonical" href="{{ .Permalink }}" />
|
||||
|
||||
{{ template "_internal/google_analytics.html" . }}
|
||||
|
||||
<!-- Theme CSS -->
|
||||
{{ $css := resources.Get "css/style.css" }}
|
||||
{{ $opts := dict "inlineImports" true }}
|
||||
{{ $style := $css | resources.PostCSS $opts | minify }}
|
||||
<link rel="stylesheet" href="{{ $style.Permalink }}">
|
||||
|
||||
{{ if (or (isset .Params "color") (ne $.Site.Params.ThemeColor "orange")) }}
|
||||
{{ $colorCss := resources.Get (printf "css/color/%s.css" (or .Params.color $.Site.Params.ThemeColor)) }}
|
||||
{{ $color := $colorCss | resources.PostCSS $opts | minify }}
|
||||
<link rel="stylesheet" href="{{ $color.Permalink }}">
|
||||
{{ $defaultStyles := resources.Get "css/style.scss" }}
|
||||
<!-- Local Theme Variables -->
|
||||
{{ if and (isset .Params "color") (not (eq .Params.color "")) }}
|
||||
{{ $localColorCss := resources.Get (printf "css/color/%s.scss" .Params.color) }}
|
||||
{{ $localCss := slice $localColorCss $defaultStyles | resources.Concat (printf "css/%s-local.scss" .Params.color) }}
|
||||
{{ $localColorStyles := $localCss | resources.ToCSS }}
|
||||
<link rel="stylesheet" href="{{ $localColorStyles.Permalink }}">
|
||||
{{ else }}
|
||||
<!-- Theme Variables -->
|
||||
{{ $colorCss := resources.Get (printf "css/color/%s.scss" ($.Site.Params.ThemeColor | default "orange")) }}
|
||||
{{ $css := slice $colorCss $defaultStyles | resources.Concat "css/base.scss" }}
|
||||
{{ $options := (dict "targetPath" "styles.css" "outputStyle" "compressed" "enableSourceMap" true "precision" 6 "includePaths" (slice "node_modules")) }}
|
||||
{{ $styles := $css | resources.ToCSS $options }}
|
||||
<link rel="stylesheet" href="{{ $styles.Permalink }}">
|
||||
{{ end }}
|
||||
|
||||
<!-- Custom CSS to override theme properties (/static/style.css) -->
|
||||
@ -25,29 +35,35 @@
|
||||
{{- end }}
|
||||
|
||||
<!-- Icons -->
|
||||
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{ "img/apple-touch-icon-144-precomposed.png" | absURL }}">
|
||||
{{ if isset $.Site.Params "favicon" }}
|
||||
<link rel="shortcut icon" href="{{ $.Site.Params.favicon | absURL }}">
|
||||
{{ else }}
|
||||
<link rel="shortcut icon" href="{{ printf "img/favicon/%s.png" $.Site.Params.ThemeColor | absURL }}">
|
||||
<link rel="shortcut icon" href="{{ printf "img/theme-colors/%s.png" (or .Params.color $.Site.Params.ThemeColor | default "orange") | absURL }}">
|
||||
<link rel="apple-touch-icon" href="{{ printf "img/theme-colors/%s.png" (or .Params.color $.Site.Params.ThemeColor | default "orange") | absURL }}">
|
||||
{{ end }}
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary" />
|
||||
{{ if (isset $.Site.Params.Twitter "site") }}
|
||||
<meta name="twitter:site" content="{{ $.Site.Params.Twitter.site }}" />
|
||||
{{ if (isset $.Site.Params "twitter") }}
|
||||
{{ if (isset $.Site.Params.Twitter "site") }}
|
||||
<meta name="twitter:site" content="{{ $.Site.Params.Twitter.site }}" />
|
||||
{{ end }}
|
||||
<meta name="twitter:creator" content="{{ if .IsHome }}{{ $.Site.Params.Twitter.creator }}{{ else if isset .Params "authortwitter" }}{{ .Params.authorTwitter }}{{ else }}{{ .Params.Author }}{{ end }}" />
|
||||
{{ end }}
|
||||
<meta name="twitter:creator" content="{{ if .IsHome }}{{ $.Site.Params.Twitter.creator }}{{ else if isset .Params "authortwitter" }}{{ .Params.authorTwitter }}{{ else }}{{ .Params.Author }}{{ end }}" />
|
||||
|
||||
<!-- OG data -->
|
||||
<meta property="og:locale" content="{{ $.Site.Language.Lang }}" />
|
||||
<meta property="og:type" content="{{ if .IsPage }}article{{ else }}website{{ end }}" />
|
||||
<meta property="og:title" content="{{ if .IsHome }}{{ $.Site.Title }}{{ else }}{{ .Title }} :: {{ $.Site.Title }}{{ end }}">
|
||||
<meta property="og:title" content="{{ if .IsHome }}{{ $.Site.Title }}{{ else }}{{ .Title }}{{ end }}">
|
||||
<meta property="og:description" content="{{ if .IsHome }}{{ $.Site.Params.Subtitle }}{{ else if .Description}}{{ .Description | plainify }}{{ else }}{{ .Summary | plainify }}{{ end }}" />
|
||||
<meta property="og:url" content="{{ .Permalink }}" />
|
||||
<meta property="og:site_name" content="{{ .Title }}" />
|
||||
{{ if and (not .IsHome) (isset .Params "cover") }}
|
||||
<meta property="og:image" content="{{ .Param "cover" | absURL }}">
|
||||
<meta property="og:site_name" content="{{ $.Site.Title }}" />
|
||||
{{ if (isset .Params "cover") }}
|
||||
{{ $pageCover := .Param "cover" }}
|
||||
{{ with (.Resources.GetMatch (.Param "cover")) }}
|
||||
{{ $pageCover = .RelPermalink }}
|
||||
{{ end }}
|
||||
<meta property="og:image" content="{{ $pageCover | absURL }}">
|
||||
{{ else }}
|
||||
{{ if isset $.Site.Params "favicon" }}
|
||||
<meta property="og:image" content="{{ $.Site.Params.favicon | absURL }}">
|
||||
@ -55,8 +71,8 @@
|
||||
<meta property="og:image" content="{{ printf "img/favicon/%s.png" $.Site.Params.ThemeColor | absURL }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<meta property="og:image:width" content="2048">
|
||||
<meta property="og:image:height" content="1024">
|
||||
<meta property="og:image:width" content="1200">
|
||||
<meta property="og:image:height" content="627">
|
||||
{{ range .Params.categories }}
|
||||
<meta property="article:section" content="{{ . }}" />
|
||||
{{ end }}
|
||||
|
@ -3,7 +3,12 @@
|
||||
<div class="header__logo">
|
||||
{{ partial "logo.html" . }}
|
||||
</div>
|
||||
<div class="menu-trigger">menu</div>
|
||||
{{ if len $.Site.Menus }}
|
||||
{{ partial "mobile-menu.html" . }}
|
||||
{{ end }}
|
||||
{{ if and $.Site.Params.showLanguageSelector (len $.Site.Home.AllTranslations) }}
|
||||
{{ partial "language-menu.html" . }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if len $.Site.Menus }}
|
||||
{{ partial "menu.html" . }}
|
||||
|
10
layouts/partials/language-menu.html
Normal file
@ -0,0 +1,10 @@
|
||||
<ul class="menu menu--desktop menu--language-selector">
|
||||
<li class="menu__trigger">{{ .Language.LanguageName }} ▾</li>
|
||||
<li>
|
||||
<ul class="menu__dropdown">
|
||||
{{ range $.Site.Home.AllTranslations }}
|
||||
<li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
@ -1,60 +1,33 @@
|
||||
<nav class="menu">
|
||||
<ul class="menu__inner menu__inner--desktop">
|
||||
<nav class="navigation-menu">
|
||||
<ul class="navigation-menu__inner menu--desktop">
|
||||
{{ if or $.Site.Params.showMenuItems ( eq .Site.Params.showMenuItems 0 ) }}
|
||||
{{ range first $.Site.Params.showMenuItems $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
||||
<li><a href="{{ .URL }}" {{ if .Params.NewTab -}} target="_blank" {{- end }}>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if gt (len $.Site.Menus.main) $.Site.Params.showMenuItems }}
|
||||
<ul class="menu__sub-inner">
|
||||
<li class="menu__sub-inner-more-trigger">{{ $.Site.Params.MenuMore }} ▾</li>
|
||||
|
||||
<ul class="menu__sub-inner-more hidden">
|
||||
{{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<li>
|
||||
<ul class="menu">
|
||||
<li class="menu__trigger">{{ $.Site.Params.MenuMore }} ▾</li>
|
||||
<li>
|
||||
<ul class="menu__dropdown">
|
||||
{{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}" {{ if .Params.NewTab -}} target="_blank" {{- end }}>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</ul>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
{{ range $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
||||
<li><a href="{{ .URL }}" {{ if .Params.NewTab -}} target="_blank" {{- end }}>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
{{ if $.Site.Params.showLanguageSelector }}
|
||||
<div class="spacer"></div>
|
||||
<ul class="language-selector">
|
||||
<ul class="language-selector-current">
|
||||
<li>{{ .Language.LanguageName }} ▾</li>
|
||||
</ul>
|
||||
<ul class="language-selector__more hidden">
|
||||
{{ range $.Site.Home.AllTranslations }}
|
||||
<li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</ul>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
||||
<ul class="menu__inner menu__inner--mobile">
|
||||
{{ range $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if $.Site.Params.showLanguageSelector }}
|
||||
<hr />
|
||||
{{ range $.Site.Home.AllTranslations }}
|
||||
<li>
|
||||
<a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
|
20
layouts/partials/mobile-menu.html
Normal file
@ -0,0 +1,20 @@
|
||||
<ul class="menu menu--mobile">
|
||||
<li class="menu__trigger">Menu ▾</li>
|
||||
<li>
|
||||
<ul class="menu__dropdown">
|
||||
{{ range $.Site.Menus.main }}
|
||||
{{ if not .HasChildren }}
|
||||
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if and $.Site.Params.showLanguageSelector (len $.Site.Home.AllTranslations) }}
|
||||
<hr />
|
||||
{{ range $.Site.Home.AllTranslations }}
|
||||
<li>
|
||||
<a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
@ -1,20 +1,16 @@
|
||||
<div class="pagination">
|
||||
<div class="pagination__buttons">
|
||||
{{ if .Paginator.HasPrev }}
|
||||
<span class="button previous">
|
||||
<a href="{{ .Paginator.Prev.URL }}">
|
||||
<span class="button__icon">←</span>
|
||||
<span class="button__text">Newer posts</span>
|
||||
</a>
|
||||
</span>
|
||||
<a href="{{ .Paginator.Prev.URL }}" class="button previous">
|
||||
<span class="button__icon">←</span>
|
||||
<span class="button__text">{{ $.Site.Params.newerPosts | default "Newer posts" }}</span>
|
||||
</a>
|
||||
{{ end }}
|
||||
{{ if .Paginator.HasNext }}
|
||||
<span class="button next">
|
||||
<a href="{{ .Paginator.Next.URL }}">
|
||||
<span class="button__text">Older posts</span>
|
||||
<span class="button__icon">→</span>
|
||||
</a>
|
||||
</span>
|
||||
<a href="{{ .Paginator.Next.URL }}" class="button next">
|
||||
<span class="button__text">{{ $.Site.Params.olderPosts | default "Older posts" }}</span>
|
||||
<span class="button__icon">→</span>
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -2,7 +2,7 @@
|
||||
<figure class="{{ with .Get "position"}}{{ . }}{{ else -}} left {{- end }}" >
|
||||
<img src="{{ .Get "src" | safeURL }}" {{ with .Get "alt" }} alt="{{ . | plainify }}" {{ end }} {{ with .Get "style" }} style="{{ . | safeCSS }}" {{ end }} />
|
||||
{{ if .Get "caption" }}
|
||||
<figcaption class="{{ with .Get "captionPosition"}}{{ . }}{{ else -}} center {{- end }}" {{ with .Get "captionStyle" }} style="{{ . | safeCSS }}" {{ end }}>{{ .Get "caption" }}</figcaption>
|
||||
<figcaption class="{{ with .Get "captionPosition"}}{{ . }}{{ else -}} center {{- end }}" {{ with .Get "captionStyle" }} style="{{ . | safeCSS }}" {{ end }}>{{ .Get "caption" | safeHTML }}</figcaption>
|
||||
{{ end }}
|
||||
</figure>
|
||||
{{ end }}
|
||||
|
@ -1,3 +1,3 @@
|
||||
{{ if .Get "src" }}
|
||||
<img src="{{ .Get "src" | safeURL }}" {{ with .Get "alt" }} alt="{{ . | plainify }}" {{ end }} class="{{ with .Get "position"}}{{ . }}{{ else -}} left {{- end }}" {{ with .Get "style" }} style="{{ . | safeCSS }}" {{ end }} />
|
||||
<img src="{{ .Get "src" | safeURL }}" {{ with .Get "alt" }} alt="{{ . | plainify }}" {{ end }} class="{{ with .Get "position"}}{{ . }}{{ else -}} left {{- end }}" {{ with .Get "style" }} style="{{ . | safeCSS }}" {{ end }} {{ with .Get "width" }} width="{{ . | plainify }}" {{ end }} {{ with .Get "height" }} height="{{ . | plainify }}" {{ end }} />
|
||||
{{ end }}
|
||||
|
@ -1,4 +1,4 @@
|
||||
{{ $inner := replaceRE "^\n" "" .Inner | string }}
|
||||
{{ $inner := replaceRE "^\r?\n" "" .Inner | string }}
|
||||
{{ if len .Params | eq 0 }}
|
||||
<pre><code>{{ $inner }}</code></pre>
|
||||
{{ else }}
|
||||
@ -20,6 +20,7 @@
|
||||
>{{ $inner }}</code></pre>
|
||||
{{ else }}
|
||||
<pre class="language-{{ .Get 0 }}">
|
||||
<code class="language-{{ .Get 0 }}">{{ $inner }}</code></pre>
|
||||
<code class="language-{{ .Get 0 }}">{{ $inner }}</code>
|
||||
</pre>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
6743
package-lock.json
generated
Normal file
39
package.hugo.json
Normal file
@ -0,0 +1,39 @@
|
||||
{
|
||||
"author": "Radosław Kozieł <@panr> <radoslaw.koziel@gmail.com>",
|
||||
"browserslist": [
|
||||
"last 2 versions",
|
||||
">1%",
|
||||
"not dead"
|
||||
],
|
||||
"comments": {
|
||||
"dependencies": {
|
||||
"yarn": "project"
|
||||
},
|
||||
"devDependencies": {
|
||||
"browserslist": "project",
|
||||
"clipboard": "project",
|
||||
"eslint-config-airbnb": "project",
|
||||
"eslint-config-prettier": "project",
|
||||
"eslint-plugin-jsx-a11y": "project",
|
||||
"husky": "project"
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"yarn": "^1.22.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
"browserslist": "^4.16.5",
|
||||
"clipboard": "^2.0.4",
|
||||
"eslint-config-airbnb": "^18.2.0",
|
||||
"eslint-config-prettier": "^8.1.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.2.1",
|
||||
"husky": "^5.1.3"
|
||||
},
|
||||
"license": "MIT",
|
||||
"main": "index.js",
|
||||
"name": "terminal",
|
||||
"scripts": {
|
||||
"test": "echo 'Test'"
|
||||
},
|
||||
"version": "2.1.0"
|
||||
}
|
54
package.json
@ -1,37 +1,43 @@
|
||||
{
|
||||
"name": "terminal",
|
||||
"version": "2.0.0",
|
||||
"main": "index.js",
|
||||
"version": "3.1.0",
|
||||
"author": "Radosław Kozieł <@panr> <radoslaw.koziel@gmail.com>",
|
||||
"main": "index.js",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"test": "echo 'Test'"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 2 versions",
|
||||
">1%",
|
||||
"not dead"
|
||||
],
|
||||
"comments": {
|
||||
"dependencies": {
|
||||
"yarn": "project"
|
||||
},
|
||||
"devDependencies": {
|
||||
"browserslist": "project",
|
||||
"clipboard": "project",
|
||||
"eslint-config-airbnb": "project",
|
||||
"eslint-config-prettier": "project",
|
||||
"eslint-plugin-jsx-a11y": "project",
|
||||
"husky": "project"
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"yarn": "^1.22.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.10.5",
|
||||
"@babel/core": "^7.10.5",
|
||||
"@babel/parser": "^7.4.2",
|
||||
"@babel/plugin-transform-runtime": "^7.2.0",
|
||||
"@babel/preset-env": "^7.3.1",
|
||||
"@babel/preset-stage-2": "^7.0.0",
|
||||
"babel-eslint": "^8.2.1",
|
||||
"browserslist": "^4.0.1",
|
||||
"browserslist": "^4.16.5",
|
||||
"clipboard": "^2.0.4",
|
||||
"cssnano": "^4.1.8",
|
||||
"eslint-config-prettier": "^2.10.0",
|
||||
"postcss": "^7.0.0",
|
||||
"postcss-browser-reporter": "^0.5.0",
|
||||
"postcss-cli": "^7.1.1",
|
||||
"postcss-color-mod-function": "^3.0.3",
|
||||
"postcss-import": "^12.0.1",
|
||||
"postcss-loader": "^3.0.0",
|
||||
"postcss-mixins": "^6.2.3",
|
||||
"postcss-nested": "^4.2.3",
|
||||
"postcss-preset-env": "^6.7.0",
|
||||
"postcss-reporter": "^6.0.1",
|
||||
"postcss-url": "^8.0.0",
|
||||
"prettier-eslint-cli": "^4.7.1"
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-airbnb": "^18.2.0",
|
||||
"eslint-config-prettier": "^8.1.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.2.1",
|
||||
"husky": "^5.1.3",
|
||||
"stylelint": "^14.14.1",
|
||||
"stylelint-config-prettier-scss": "^0.0.1",
|
||||
"stylelint-config-standard-scss": "^6.1.0"
|
||||
}
|
||||
}
|
||||
|
@ -1,28 +0,0 @@
|
||||
const url = require("postcss-url");
|
||||
const imports = require("postcss-import");
|
||||
const nested = require("postcss-nested");
|
||||
const postCSSPresetEnv = require("postcss-preset-env");
|
||||
const browsers = require("browserslist");
|
||||
const cssnano = require("cssnano");
|
||||
const color = require("postcss-color-mod-function");
|
||||
const mixins = require("postcss-mixins");
|
||||
|
||||
module.exports = () => ({
|
||||
plugins: [
|
||||
url,
|
||||
imports,
|
||||
mixins,
|
||||
nested,
|
||||
postCSSPresetEnv({
|
||||
stage: 1,
|
||||
preserve: true,
|
||||
features: {
|
||||
"custom-properties": true,
|
||||
},
|
||||
}),
|
||||
cssnano({
|
||||
preset: "default",
|
||||
}),
|
||||
color,
|
||||
],
|
||||
});
|
Before Width: | Height: | Size: 189 B After Width: | Height: | Size: 189 B |
Before Width: | Height: | Size: 190 B After Width: | Height: | Size: 190 B |
Before Width: | Height: | Size: 190 B After Width: | Height: | Size: 190 B |
Before Width: | Height: | Size: 190 B After Width: | Height: | Size: 190 B |
Before Width: | Height: | Size: 189 B After Width: | Height: | Size: 189 B |
@ -5,7 +5,7 @@ description = "A simple, retro theme for Hugo."
|
||||
homepage = "https://github.com/panr/hugo-theme-terminal/"
|
||||
tags = ["blog", "clean", "customizable", "dark", "highlighting", "minimal", "monotone", "multilingual", "personal", "responsive", "simple", "technical", "retro"]
|
||||
features = ["blog", "shortcode", "syntax highlighting"]
|
||||
min_version = 0.57
|
||||
min_version = 0.90
|
||||
|
||||
[author]
|
||||
name = "panr"
|
||||
|
@ -1,99 +0,0 @@
|
||||
const Webpack = require("webpack");
|
||||
const ExtractTextPlugin = require("extract-text-webpack-plugin");
|
||||
const CleanPlugin = require("clean-webpack-plugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
|
||||
|
||||
const path = require("path");
|
||||
|
||||
const join = (...paths) => path.join(__dirname, ...paths);
|
||||
|
||||
module.exports = {
|
||||
resolve: {
|
||||
extensions: [".js", ".css"],
|
||||
modules: ["source", "node_modules"],
|
||||
},
|
||||
entry: {
|
||||
"main.js": [
|
||||
join("source", "js", "main.js"),
|
||||
join("source", "js", "menu.js"),
|
||||
join("source", "js", "languageSelector.js")
|
||||
],
|
||||
"prism.js": join("source", "js", "prism.js"),
|
||||
"style.css": join("source", "css", "style.css"),
|
||||
"red.css": join("source", "css", "color", "red.css"),
|
||||
"blue.css": join("source", "css", "color", "blue.css"),
|
||||
"green.css": join("source", "css", "color", "green.css"),
|
||||
"pink.css": join("source", "css", "color", "pink.css"),
|
||||
},
|
||||
output: {
|
||||
filename: "[name]",
|
||||
path: join("static/assets"),
|
||||
publicPath: "",
|
||||
},
|
||||
performance: {
|
||||
hints: false,
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: {
|
||||
loader: "babel-loader",
|
||||
options: {
|
||||
presets: ["@babel/preset-env"],
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpg|woff|woff2|ttf|eot|svg)$/,
|
||||
use: [
|
||||
{
|
||||
loader: "url-loader",
|
||||
options: {
|
||||
limit: 8192,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: ExtractTextPlugin.extract({
|
||||
fallback: "style-loader",
|
||||
use: [
|
||||
{
|
||||
loader: "css-loader",
|
||||
options: {
|
||||
minimize: true,
|
||||
modules: true,
|
||||
importLoaders: 1,
|
||||
localIdentName: "[local]",
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: "postcss-loader",
|
||||
options: {
|
||||
config: {
|
||||
path: "postcss.config.js",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
optimization: {
|
||||
splitChunks: {
|
||||
name: "vendor",
|
||||
minChunks: 2,
|
||||
},
|
||||
minimizer: [
|
||||
new UglifyJsPlugin({
|
||||
sourceMap: true,
|
||||
}),
|
||||
],
|
||||
},
|
||||
plugins: [new CleanPlugin(join("static/assets")), new ExtractTextPlugin("[name]")],
|
||||
};
|