blob: aef92605287f1e4fc2d92abef897cf636f2b7217 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
# Colordrop
Customizable, monochromatic and minimalist [hugo](https://gohugo.io/) theme for personal blogs.
## Installation (with git)
To install colordrop theme using git you first must ensure your blog folder is already a git repository:
```
git init
```
Then add it as submodule of your repository:
```
git submodule add git@github.com:humrochagf/colordrop.git themes/colordrop
```
OR
```
git submodule add https://github.com/humrochagf/colordrop.git themes/colordrop
```
And add this configuration to your blog config.
- yaml:
```yaml
theme: colordrop
```
- toml:
```toml
theme = "colordrop"
```
### Version pinning
You can pin a version of the theme by checking to a version tag:
```
cd themes/colordrop
git checkout v1.5.0
cd ../..
git commit -m "Pinning theme to version 1.5.0"
```
## Installation (without git)
You just need to download it at the version you want from the [release](https://github.com/humrochagf/colordrop/tags) page and extract it to the `themes` folder of your blog making sure it has the following structure:
```
.
└── themes
└── colordrop
```
And add this configuration to your blog config.
- yaml:
```yaml
theme: colordrop
```
- toml:
```toml
theme = "colordrop"
```
## Customize Colors
The theme colors can be customized by changing the `themeColor` and `themeInverseColor` variables at params.
- yaml:
```yaml
params:
themeColor: "#000000"
themeInverseColor: "#ffffff"
```
- toml:
```toml
[params]
themeColor = "#000000"
themeInverseColor = "#ffffff"
```
## Home page and Logo
The website logo can be set with the variable `siteLogo` while the variable `description` will be the displayed at the website home page.
- yaml:
```yaml
params:
description: Welcome to my blog...
siteLogo: "logo-photo.png"
```
- toml:
```toml
[params]
description = "Welcome to my blog..."
siteLogo = "logo-photo.png"
```
## Custom CSS
You can load your custom CSS files by adding them under the `static` folder, e.g. `static/css/custom.css` and then defining the parameters as a list.
- yaml:
```yaml
params:
custom_css: ["css/custom.css"]
```
- toml:
```toml
[params]
custom_css = ["css/custom.css"]
```
## Website Example
You check [my blog](https://humberto.io) to see the theme fully running.
**Obs:** This theme uses pipes to compile sass so you'll have to use hugo extensions.
|
