Like 0
Fork 0

Last active 1747743560 • Unlisted

xe's Avatar xe revised this gist 1747743560. Go to revision

1 file changed, 1 insertion, 1 deletion

botstopper.md

@@ -19,7 +19,7 @@ Install BotStopper like you would Anubis, but replace the image reference. EG:
19 19
20 20 ### Binary packages
21 21
22 - Binary packages will be available by request, the main difference is that the package name is `techaro-botstopper`, the binary is `/usr/bin/botstopper`, and the configuration is in `/etc/techaro-botstopper`. Otherwise [everything here applies](https://anubis.techaro.lol/docs/admin/native-install).
22 + Binary packages will be available by request, the main difference is that the package name is `techaro-botstopper`, the systemd service is `techaro-botstopper@your-instance.service`, the binary is `/usr/bin/botstopper`, and the configuration is in `/etc/techaro-botstopper`. Otherwise [everything here applies](https://anubis.techaro.lol/docs/admin/native-install).
23 23
24 24 ### Docker / Podman
25 25

xe's Avatar xe revised this gist 1747743414. Go to revision

1 file changed, 270 insertions

botstopper.md(file created)

@@ -0,0 +1,270 @@
1 + # BotStopper
2 +
3 + The commercial patchset for Anubis.
4 +
5 + Everything in [the upstream Anubis docs](https://anubis.techaro.lol/docs) applies here, with the exceptions of these settings only exposed via BotStopper:
6 +
7 + - Custom images and CSS
8 + - Custom message titles
9 + - Many instances of "Anubis" replaced with "BotStopper"
10 +
11 + ## Installation
12 +
13 + Install BotStopper like you would Anubis, but replace the image reference. EG:
14 +
15 + ```diff
16 + -ghcr.io/techarohq/anubis:latest
17 + +ghcr.io/techarohq/botstopper/anubis:latest
18 + ```
19 +
20 + ### Binary packages
21 +
22 + Binary packages will be available by request, the main difference is that the package name is `techaro-botstopper`, the binary is `/usr/bin/botstopper`, and the configuration is in `/etc/techaro-botstopper`. Otherwise [everything here applies](https://anubis.techaro.lol/docs/admin/native-install).
23 +
24 + ### Docker / Podman
25 +
26 + In order to pull the BotStopper image, you need to [authenticate with GitHub's Container Registry](https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-container-registry#authenticating-to-the-container-registry).
27 +
28 + ```text
29 + docker login ghcr.io -u your-username --password-stdin
30 + ```
31 +
32 + Then you can use the image as normal.
33 +
34 + ### Kubernetes
35 +
36 + If you are using Kubernetes, you will need to create an image pull secret:
37 +
38 + ```text
39 + kubectl create secret docker-registry \
40 + techarohq-botstopper \
41 + --docker-server ghcr.io \
42 + --docker-username your-username \
43 + --docker-password your-access-token \
44 + --docker-email your@email.address
45 + ```
46 +
47 + Then attach it to your Deployment:
48 +
49 + ```diff
50 + spec:
51 + securityContext:
52 + fsGroup: 1000
53 + + imagePullSecrets:
54 + + - name: techarohq-botstopper
55 + ```
56 +
57 + ## Configuration
58 +
59 + ### Docker compose
60 +
61 + Follow [the upstream Docker compose directions](https://anubis.techaro.lol/docs/admin/environments/docker-compose) with the following additional options:
62 +
63 + ```diff
64 + anubis:
65 + image: ghcr.io/techarohq/botstopper/anubis:latest
66 + environment:
67 + BIND: ":8080"
68 + DIFFICULTY: "4"
69 + METRICS_BIND: ":9090"
70 + SERVE_ROBOTS_TXT: "true"
71 + TARGET: "http://nginx"
72 + OG_PASSTHROUGH: "true"
73 + OG_EXPIRY_TIME: "24h"
74 +
75 + + # botstopper config here
76 + + CHALLENGE_TITLE: "Doing math for your connnection!"
77 + + ERROR_TITLE: "Something went wrong!"
78 + + OVERLAY_FOLDER: /assets
79 + + volumes:
80 + + - "./your_folder:/assets"
81 + ```
82 +
83 + #### Example
84 +
85 + There is an example in [docker-compose.yaml](./docker-compose.yaml). Start the example with `docker compose up`:
86 +
87 + ```text
88 + docker compose up -d
89 + ```
90 +
91 + And then open [https://botstopper.local.cetacean.club:8443](https://botstopper.local.cetacean.club:8443) in your browser.
92 +
93 + > [!NOTE]
94 + > This uses locally signed sacrificial TLS certificates stored in `./demo/pki`. Your browser will rightly reject these. Here is what the example looks like:
95 + >
96 + > ![](./demo/www/img/example-screenshot.webp)
97 +
98 + ## Custom images and CSS
99 +
100 + Anubis uses an internal filesystem that contains CSS, JavaScript, and images. The BotStopper variant of Anubis lets you specify an overlay folder with the environment variable `OVERLAY_FOLDER`. The contents of this folder will be overlaid on top of Anubis' internal filesystem, allowing you to easily customize the images and CSS.
101 +
102 + Your directory tree should look like this, assuming your data is in `./your_folder`:
103 +
104 + ```text
105 + ./your_folder
106 + └── static
107 + ├── css
108 + │ └── custom.css
109 + └── img
110 + ├── happy.webp
111 + ├── pensive.webp
112 + └── reject.webp
113 + ```
114 +
115 + For an example directory tree using some off-the-shelf images the Tango icon set, see the [testdata](./testdata) folder.
116 +
117 + ### Custom CSS
118 +
119 + CSS customization is done mainly with CSS variables. Here is an example that sets Anubis to use a very neutral white-on-black theme:
120 +
121 + ```css
122 + :root {
123 + /* Font customization
124 + */
125 + --body-sans-font: sans-serif;
126 + --body-preformatted-font: monospace;
127 + --body-title-font: serif;
128 +
129 + /* To use the default fonts:
130 +
131 + --body-sans-font: Geist, sans-serif;
132 + --body-preformatted-font: Iosevka Curly Iaso, monospace;
133 + --body-title-font: Podkova, serif;
134 +
135 + @font-face {
136 + font-family: "Geist";
137 + font-style: normal;
138 + font-weight: 100 900;
139 + font-display: swap;
140 + src: url("/.within.website/x/xess/static/geist.woff2") format("woff2");
141 + }
142 +
143 + @font-face {
144 + font-family: "Podkova";
145 + font-style: normal;
146 + font-weight: 400 800;
147 + font-display: swap;
148 + src: url("/.within.website/x/xess/static/podkova.woff2") format("woff2");
149 + }
150 +
151 + @font-face {
152 + font-family: "Iosevka Curly";
153 + font-style: monospace;
154 + font-display: swap;
155 + src: url("/.within.website/x/xess/static/iosevka-curly.woff2") format("woff2");
156 + }
157 +
158 + */
159 +
160 + /* Color customization, these correlate to the locations in `xess.css` in the upstream
161 + Anubis repo: https://github.com/TecharoHQ/anubis/blob/main/xess/xess.css
162 +
163 + Experimentation may be required.
164 + */
165 + --background: #000000;
166 + --text: #ffffff;
167 + --text-selection: #d3869b;
168 + --preformatted-background: #3c3836;
169 + --link-foreground: #0000ee;
170 + --link-background: inherit;
171 + --blockquote-border-left: 1px solid #bdae93;
172 +
173 + /* Customization of the progress bar colors.
174 +
175 + Experimentation may be required.
176 + */
177 + --progress-bar-outline: #b16286 solid 4px;
178 + --progress-bar-fill: #b16286;
179 + }
180 + @media (prefers-color-scheme: light) {
181 + /* BotStopper's CSS is responsive to both light and dark mode. Be sure to support both
182 + of these in your configuration.
183 + */
184 + :root {
185 + --background: #ffffff;
186 + --text: #000000;
187 + --text-selection: #d3869b;
188 + --preformatted-background: #ebdbb2;
189 + --link-foreground: #0000ff;
190 + --link-background: inherit;
191 + --blockquote-border-left: 1px solid #655c54;
192 + }
193 + }
194 + ```
195 +
196 + ### Custom fonts
197 +
198 + If you want to add custom fonts, copy the `woff2` files alongside your `custom.css` file and then include them with the [`@font-face` CSS at-rule](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face):
199 +
200 + ```css
201 + @font-face {
202 + font-family: "Oswald";
203 + font-style: normal;
204 + font-weight: 200 900;
205 + font-display: swap;
206 + src: url("./fonts/oswald.woff2") format("woff2");
207 + }
208 + ```
209 +
210 + Then adjust your CSS variables accordingly:
211 +
212 + ```css
213 + :root {
214 + --body-sans-font: Oswald, sans-serif;
215 + --body-preformatted-font: monospace;
216 + --body-title-font: serif;
217 + }
218 + ```
219 +
220 + To convert `.ttf` fonts to [Web-optimized woff2 fonts](https://www.w3.org/TR/WOFF2/), use the `woff2_compress` command from the `woff2` or `woff2-tools` package:
221 +
222 + ```console
223 + $ woff2_compress oswald.ttf
224 + Processing oswald.ttf => oswald.woff2
225 + Compressed 159517 to 70469.
226 + ```
227 +
228 + Then you can import and use it as normal.
229 +
230 + ### Customizing images
231 +
232 + Anubis uses three images to visually communicate the state of the program. These are:
233 +
234 + | Image name | Intended message | Example |
235 + | :------------- | :----------------------------------------------- | :--------------------------------- |
236 + | `happy.webp` | You have passed validation, all is good | ![](https://files.xeiaso.net/dl/botstopper/img/happy.webp) |
237 + | `pensive.webp` | Checking is running, hold steady until it's done | ![](https://files.xeiaso.net/dl/botstopper/img/pensive.webp) |
238 + | `reject.webp` | Something went wrong, this is a terminal state | ![](https://files.xeiaso.net/dl/botstopper/img/reject.webp) |
239 +
240 + To make your own images at the optimal quality, use the following ffmpeg command:
241 +
242 + ```text
243 + ffmpeg -i /path/to/image -vf scale=-1:384 happy.webp
244 + ```
245 +
246 + `ffprobe` should report something like this on the generated images:
247 +
248 + ```text
249 + Input #0, webp_pipe, from 'happy.webp':
250 + Duration: N/A, bitrate: N/A
251 + Stream #0:0: Video: webp, none, 25 fps, 25 tbr, 25 tbn
252 + ```
253 +
254 + In testing 384 by 384 pixels gives the best balance between filesize, quality, and clarity.
255 +
256 + ```text
257 + $ du -hs *
258 + 4.0K happy.webp
259 + 12K pensive.webp
260 + 8.0K reject.webp
261 + ```
262 +
263 + ## Customizing messages
264 +
265 + You can customize messages using the following environment variables:
266 +
267 + | Message | Environment variable | Default |
268 + | :------------------- | :------------------- | :----------------------------------------- |
269 + | Challenge page title | `CHALLENGE_TITLE` | `Ensuring the security of your connection` |
270 + | Error page title | `ERROR_TITLE` | `Error` |
Newer Older

Powered by Opengist ⋅ Load: 12ms⋅

English
⋅ Blog