hugo-theme-terminal

My Fork of the Terminal Hugo Theme
git clone https://git.repetitions.de/hugo-theme-terminal

README.md (5895B)


  1 Hugo Theme for my Personal Website. Adapted from Panrs [Terminal Theme](https://github.com/panr/hugo-theme-terminal/)
  2 
  3 ---
  4 
  5 - [Features](#features)
  6 - [Built-in shortcodes](#built-in-shortcodes)
  7 - [Code highlighting](#code-highlighting)
  8 - [How to start](#how-to-start)
  9 - [How to run your site](#how-to-run-your-site)
 10 - [How to configure](#how-to-configure)
 11 - [Post archetype](#post-archetype)
 12 - [Add-ons](#add-ons)
 13 - [How to edit the theme](#how-to-edit)
 14 - [Found a bug?](#bug)
 15 - [New cool idea or feature](#feature)
 16 - [Terminal theme user?](#terminal-theme-user)
 17 - [License](#license)
 18 
 19 ## Features
 20 
 21 - **5 duotone themes**, depending on your preferences (orange is default, red, blue, green, pink)
 22 - [**Fira Code**](https://github.com/tonsky/FiraCode) as default monospaced font. It's gorgeous!
 23 - custom serverside syntax highlighting using Hugos default Chroma.
 24 - minimal JS.
 25 - fully responsive
 26 - fully based on Hugo ecosystem (Pipes and Modules)
 27 
 28 #### Built-in shortcodes
 29 
 30 - **`framed`** 
 31   - e.g.
 32   ```go
 33   {{%framed%}}
 34   This text will be framed.
 35   {{%/framed%}}
 36   ```
 37 - **`image`** (props required: **`src`**; props optional: **`alt`**, **`position`** (**left** is default | center | right), **`style`**)
 38   - e.g.
 39   ```go
 40   {{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}
 41   ```
 42 - **`figure`** (same as `image`, plus few optional props: **`caption`**, **`captionPosition`** (left | **center** is default | right), **`captionStyle`**)
 43   - e.g.
 44   ```go
 45   {{< figure src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" caption="Hello Friend!" captionPosition="right" captionStyle="color: red;" >}}
 46   ```
 47 - **`code`** (props required: **`language`**; props optional: **`title`**, **`id`**, **`expand`** (default "△"), **`collapse`** (default "▽"), **`isCollapsed`**)
 48   - e.g.
 49   ```go
 50   {{< code language="css" title="Really cool snippet" id="1" expand="Show" collapse="Hide" isCollapsed="true" >}}
 51   pre {
 52     background: #1a1a1d;
 53     padding: 20px;
 54     border-radius: 8px;
 55     font-size: 1rem;
 56     overflow: auto;
 57 
 58     @media (--phone) {
 59       white-space: pre-wrap;
 60       word-wrap: break-word;
 61     }
 62 
 63     code {
 64       background: none !important;
 65       color: #ccc;
 66       padding: 0;
 67       font-size: inherit;
 68     }
 69   }
 70   {{< /code >}}
 71   ```
 72 
 73 #### Code highlighting
 74 
 75 A custom syntax highlighting based on Chroma. All you need to do is to wrap you code like this:
 76 
 77 ````
 78 ```html
 79   // your code here
 80 ```
 81 ````
 82 
 83 ## How to start
 84 
 85 You can download the theme manually by going to [https://git.repetitions.de/hugo-theme-terminal](https://git.repetitions.de/hugo-theme-terminal) and pasting it to `themes/terminal` in your root directory.
 86 
 87 You can also choose **one of the 3 possibilities** to install the theme:
 88 
 89 1. as Hugo Module
 90 2. as a standalone local directory
 91 3. as a git submodule
 92 
 93 ### Install theme as Hugo Module
 94 
 95 ```bash
 96 # If this is the first time you're using Hugo Modules
 97 # in your project. You have to initiate your own module before
 98 # you fetch the theme module.
 99 #
100 # hugo mod init [your website/module name]
101 hugo mod get github.com/panr/hugo-theme-terminal/v3
102 ```
103 
104 and in your config file add:
105 
106 ```toml
107 [module]
108   # this is needed when you fetch the theme as a submodule to your repo.
109   # replacements = "github.com/panr/hugo-theme-terminal -> themes/terminal"
110 [[module.imports]]
111   path = 'github.com/panr/hugo-theme-terminal/v3'
112 ```
113 
114 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/).
115 
116 ### Install theme locally
117 
118 ```bash
119 git clone https://git.repetitions.de/hugo-theme-terminal.git themes/terminal
120 ```
121 
122 This will clone the repository directly to the `themes/terminal` directory.
123 
124 ### Install theme as a submodule
125 
126 ```bash
127 git submodule add -f https://git.repetitions.de/hugo-theme-terminal.git themes/terminal
128 ```
129 
130 This will install the repository as a sumbodule in the `themes/terminal` directory.
131 
132 ⚠️ If you encounter any issues with:
133 
134 ```bash
135 Error: module "terminal" not found; either add it as a Hugo Module or store it in "[...your custom path]/themes".: module does not exist
136 ```
137 
138 then please try to remove `theme = "terminal"` from your config file.
139 
140 ## How to run your site
141 
142 ```bash
143 hugo server -t terminal
144 ```
145 
146 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.
147 
148 ## How to configure
149 
150 The theme doesn't require any advanced configuration. Just copy the `config.toml` of the example site.
151 
152 ## Add-ons
153 
154 - **Comments** — for adding comments to your blog posts please take a look at `layouts/partials/comments.html`.
155 - **Extended Head** — please take a look at `layouts/partials/extended_head.html`.
156 - **Extended Footer** — please take a look at `layouts/partials/extended_footer.html`.
157 
158 ## How to edit the theme <a id="how-to-edit" />
159 
160 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.
161 
162 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.
163 
164 ## License
165 
166 Copyright © 2019-2022 Radosław Kozieł ([@panr](https://twitter.com/panr))
167 
168 Copyright ©      2024 Lou Woell
169 
170 The theme is released under the MIT License. Check the [original theme license](https://git.repetitions.de/hugo-theme-terminal/file/LICENSE.md.html) for additional licensing information.
171