2022-09-05 14:17:07 +02:00
|
|
|
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
|
|
<head>
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<title>{{ .Translate "Customize Homepage" }}</title>
|
2022-09-05 14:46:00 +02:00
|
|
|
<link rel="stylesheet" type="text/css" href="/static/style.css" />
|
|
|
|
<script src="/static/customize.js"></script>
|
2022-09-05 14:17:07 +02:00
|
|
|
|
|
|
|
<style>
|
|
|
|
:root {
|
|
|
|
--bookmark-border-radius: {{ .Settings.BorderRadius }};
|
2022-09-07 11:27:35 +02:00
|
|
|
--bookmark-width: {{ .Settings.BookmarkSize }};
|
|
|
|
--bookmark-height: {{ .Settings.BookmarkSize }};
|
2022-09-05 14:17:07 +02:00
|
|
|
}
|
|
|
|
body {
|
|
|
|
background-color: {{ .Settings.Background }};
|
|
|
|
color: {{ .Settings.Foreground }};
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<datalist id="image-sizes">
|
|
|
|
<option value="cover">cover</option>
|
|
|
|
<option value="contain">contain</option>
|
|
|
|
<option value="100%">100%</option>
|
|
|
|
<option value="0px">0px</option>
|
|
|
|
</datalist>
|
2022-09-07 11:27:35 +02:00
|
|
|
<datalist id="bookmark-sizes">
|
|
|
|
<option value="200px">200px</option>
|
|
|
|
<option value="10em">10em</option>
|
|
|
|
<option value="5cm">5cm</option>
|
|
|
|
<option value="50mm">50mm</option>
|
|
|
|
<option value="2in">2in</option>
|
|
|
|
</datalist>
|
2022-09-05 14:17:07 +02:00
|
|
|
<datalist id="image-paddings">
|
|
|
|
<option value="10%">10%</option>
|
|
|
|
<option value="0px">0px</option>
|
|
|
|
<option value="10px">10px</option>
|
|
|
|
<option value="1em">1em</option>
|
|
|
|
</datalist>
|
|
|
|
<datalist id="search-strings">
|
|
|
|
<option value="https://www.google.de/search?q=%s">Google</option>
|
|
|
|
<option value="https://duckduckgo.com/?q=%s">DuckDuckGo</option>
|
|
|
|
<option value="https://www.startpage.com/do/search?query=%s">Startpage</option>
|
|
|
|
<option value="https://www.bing.com/search?q=%s">Bing</option>
|
|
|
|
<option value="https://de.search.yahoo.com/search?p=%s">Yahoo</option>
|
|
|
|
</datalist>
|
|
|
|
<main>
|
|
|
|
<a id="button" class="fixed" href="#">
|
|
|
|
<span class="material-icons">save</span>
|
|
|
|
</a>
|
|
|
|
<div id="top-panel">
|
|
|
|
<h1>{{ .Translate "Settings" }}</h1>
|
|
|
|
<form>
|
|
|
|
<label for="search-string">{{ .Translate "Search engine" }}</label>
|
|
|
|
<input list="search-strings" id="search-string" name="search-string" value="{{ .Settings.Search }}" />
|
|
|
|
|
|
|
|
<label for="bg-color">{{ .Translate "Background color" }}</label>
|
|
|
|
<input type="color" id="bg-color" name="bg-color" value="{{ .Settings.Background }}" />
|
|
|
|
|
|
|
|
<label for="fg-color">{{ .Translate "Foreground color" }}</label>
|
|
|
|
<input type="color" id="fg-color" name="fg-color" value="{{ .Settings.Foreground }}" />
|
|
|
|
|
2022-09-07 11:27:35 +02:00
|
|
|
<label for="bookmark-size">{{ .Translate "Bookmark size" }}</label>
|
|
|
|
<input list="bookmark-sizes" id="bookmark-size" name="bookmark-size" value="{{ .Settings.BookmarkSize }}" />
|
|
|
|
|
2022-09-05 14:17:07 +02:00
|
|
|
<label for="border-radius">{{ .Translate "Border radius" }}</label>
|
|
|
|
<input type="text" id="border-radius" name="border-radius" value="{{ .Settings.BorderRadius }}" />
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<section id="customize-container">
|
|
|
|
{{ range .Bookmarks }}
|
|
|
|
{{ template "customize-bookmark.html" . }}
|
|
|
|
{{ end }}
|
|
|
|
|
|
|
|
<a id="add-bookmark"><span class="material-icons">add</span></a>
|
|
|
|
</section>
|
|
|
|
</main>
|
|
|
|
</body>
|
|
|
|
</html>
|