diff --git a/ui/html/index.css b/ui/html/index.css
index 0d1d3b6..ec6c4b5 100644
--- a/ui/html/index.css
+++ b/ui/html/index.css
@@ -7,14 +7,19 @@ html, body {
color: #d3d7de;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Inter", "Segoe UI", "Helvetica Neue", "Helvetica", sans-serif;
margin: 0;
- padding: 0;
overflow-x: hidden;
+ padding: 0;
+ scrollbar-color: #4d5765 #21252b !important;
}
input, button {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Inter", "Segoe UI", "Helvetica Neue", "Helvetica", sans-serif;
}
+#content {
+ min-height: calc(100vh - 9rem);
+}
+
#header {
height: 4rem;
padding: 0.5rem;
@@ -35,6 +40,9 @@ input, button {
background-color: #2c3139;
color: #99a2b2;
}
+#header button.spaceleft {
+ margin-left: 1rem;
+}
#title {
margin-bottom: 5rem;
@@ -44,10 +52,17 @@ input, button {
#title h1 {
font-size: 4rem;
font-weight: 200;
+ margin-bottom: 1rem;
}
#title h1 span {
color: #4c5666;
}
+#title span {
+ color: #7c889c;
+}
+#title span a {
+ color: #7c889c;
+}
#search {
text-align: center;
@@ -213,6 +228,16 @@ input, button {
width: 1.2rem;
}
+#footer {
+ color: #7c889c;
+ height: 9rem;
+ padding-top: 5rem;
+ text-align: center;
+}
+#footer a {
+ color: #7c889c;
+}
+
.uncolored-svg {
filter: invert(0.8);
}
diff --git a/ui/html/index.css.map b/ui/html/index.css.map
index a3967ac..23afff7 100644
--- a/ui/html/index.css.map
+++ b/ui/html/index.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../raw/index.sass"],"names":[],"mappings":"AAUA;EACC;;;AAED;EACC,kBAbU;EAcV,OAZU;EAaV,aATU;EAUV;EACA;EACA;;;AAED;EACC,aAfU;;;AAiBX;EACC;EACA;EACA;;AACA;EACC,kBA5BS;EA6BT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;;AAEH;EACC;EACA;EACA;;AACA;EACC;EACA;;AACA;EACC;;;AAEH;EACC;EACA;;AAEC;EACC;EACA;;AACD;EACC;EACA;EACA;EACA,OA5DQ;EA6DR;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACF;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;EACA,OAnFM;;AAoFR;EACC;EACA;EACA;EACA;;AACA;EACC;EACA;;AAEJ;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACD;EACC,OAhHQ;EAiHR;;AAEF;EACC,OAhHS;EAiHT;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACC;EACA;;AACA;EACC;;AACA;EACC;;AACA;EACC,OAjJM;;AAkJP;EACC,OAjJM;;AAkJP;EACC,OAvJM;;AAwJP;EACC,OAtJM;;AAuJR;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;;AACA;EACC,OA/JM;;AAgKP;EACC,OArKM;;AAsKR;EACC;EACA;;AACA;EACC,kBA3KM;EA4KN;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;EACA;EACA;;;AAEN;EACC;;;AAED;EACC;IACC;;EACD;IACC","file":"index.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../raw/index.sass"],"names":[],"mappings":"AAUA;EACC;;;AAED;EACC,kBAbU;EAcV,OAZU;EAaV,aATU;EAUV;EACA;EACA;EACA;;;AAED;EACC,aAhBU;;;AAkBX;EACC;;;AAED;EACC;EACA;EACA;;AACA;EACC,kBAhCS;EAiCT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;;;AAEH;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;;AACF;EACC;;AACA;EACC;;;AAEH;EACC;EACA;;AAEC;EACC;EACA;;AACD;EACC;EACA;EACA;EACA,OAvEQ;EAwER;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACF;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;EACA,OA9FM;;AA+FR;EACC;EACA;EACA;EACA;;AACA;EACC;EACA;;AAEJ;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACD;EACC,OA3HQ;EA4HR;;AAEF;EACC,OA3HS;EA4HT;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACC;EACA;;AACA;EACC;;AACA;EACC;;AACA;EACC,OA5JM;;AA6JP;EACC,OA5JM;;AA6JP;EACC,OAlKM;;AAmKP;EACC,OAjKM;;AAkKR;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;;AACA;EACC,OA1KM;;AA2KP;EACC,OAhLM;;AAiLR;EACC;EACA;;AACA;EACC,kBAtLM;EAuLN;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;EACA;EACA;;;AAEN;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAEF;EACC;;;AAED;EACC;IACC;;EACD;IACC","file":"index.css"}
diff --git a/ui/html/index.html b/ui/html/index.html
index a2b496c..f28a9a2 100644
--- a/ui/html/index.html
+++ b/ui/html/index.html
@@ -6,4 +6,4 @@
-
dns-watch.org
Try "gnu.org", "wikipedia.org", "s.to" or your own website!invalid domain.
+Try "gnu.org", "wikipedia.org", "s.to" or your own website!invalid domain.
diff --git a/ui/jhtml-compat/index.css b/ui/jhtml-compat/index.css
index 763a795..7546559 100644
--- a/ui/jhtml-compat/index.css
+++ b/ui/jhtml-compat/index.css
@@ -8,14 +8,19 @@ html, body {
color: #d3d7de;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Inter", "Segoe UI", "Helvetica Neue", "Helvetica", sans-serif;
margin: 0;
- padding: 0;
overflow-x: hidden;
+ padding: 0;
+ scrollbar-color: #4d5765 #21252b !important;
}
input, button {
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Inter", "Segoe UI", "Helvetica Neue", "Helvetica", sans-serif;
}
+#content {
+ min-height: calc(100vh - 9rem);
+}
+
#header {
height: 4rem;
padding: 0.5rem;
@@ -36,6 +41,9 @@ input, button {
background-color: #2c3139;
color: #99a2b2;
}
+#header button.spaceleft {
+ margin-left: 1rem;
+}
#title {
margin-bottom: 5rem;
@@ -45,10 +53,17 @@ input, button {
#title h1 {
font-size: 4rem;
font-weight: 200;
+ margin-bottom: 1rem;
}
#title h1 span {
color: #4c5666;
}
+#title span {
+ color: #7c889c;
+}
+#title span a {
+ color: #7c889c;
+}
#search {
text-align: center;
@@ -214,6 +229,16 @@ input, button {
width: 1.2rem;
}
+#footer {
+ color: #7c889c;
+ height: 9rem;
+ padding-top: 5rem;
+ text-align: center;
+}
+#footer a {
+ color: #7c889c;
+}
+
.uncolored-svg {
filter: invert(0.8);
}
diff --git a/ui/jhtml-compat/index.css.map b/ui/jhtml-compat/index.css.map
index a3967ac..23afff7 100644
--- a/ui/jhtml-compat/index.css.map
+++ b/ui/jhtml-compat/index.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../raw/index.sass"],"names":[],"mappings":"AAUA;EACC;;;AAED;EACC,kBAbU;EAcV,OAZU;EAaV,aATU;EAUV;EACA;EACA;;;AAED;EACC,aAfU;;;AAiBX;EACC;EACA;EACA;;AACA;EACC,kBA5BS;EA6BT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;;AAEH;EACC;EACA;EACA;;AACA;EACC;EACA;;AACA;EACC;;;AAEH;EACC;EACA;;AAEC;EACC;EACA;;AACD;EACC;EACA;EACA;EACA,OA5DQ;EA6DR;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACF;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;EACA,OAnFM;;AAoFR;EACC;EACA;EACA;EACA;;AACA;EACC;EACA;;AAEJ;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACD;EACC,OAhHQ;EAiHR;;AAEF;EACC,OAhHS;EAiHT;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACC;EACA;;AACA;EACC;;AACA;EACC;;AACA;EACC,OAjJM;;AAkJP;EACC,OAjJM;;AAkJP;EACC,OAvJM;;AAwJP;EACC,OAtJM;;AAuJR;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;;AACA;EACC,OA/JM;;AAgKP;EACC,OArKM;;AAsKR;EACC;EACA;;AACA;EACC,kBA3KM;EA4KN;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;EACA;EACA;;;AAEN;EACC;;;AAED;EACC;IACC;;EACD;IACC","file":"index.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../raw/index.sass"],"names":[],"mappings":"AAUA;EACC;;;AAED;EACC,kBAbU;EAcV,OAZU;EAaV,aATU;EAUV;EACA;EACA;EACA;;;AAED;EACC,aAhBU;;;AAkBX;EACC;;;AAED;EACC;EACA;EACA;;AACA;EACC,kBAhCS;EAiCT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;;;AAEH;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;;AACF;EACC;;AACA;EACC;;;AAEH;EACC;EACA;;AAEC;EACC;EACA;;AACD;EACC;EACA;EACA;EACA,OAvEQ;EAwER;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACF;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;EACA,OA9FM;;AA+FR;EACC;EACA;EACA;EACA;;AACA;EACC;EACA;;AAEJ;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACD;EACC,OA3HQ;EA4HR;;AAEF;EACC,OA3HS;EA4HT;EACA;EACA;;AACA;EACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACC;EACA;;AACA;EACC;;AACA;EACC;;AACA;EACC,OA5JM;;AA6JP;EACC,OA5JM;;AA6JP;EACC,OAlKM;;AAmKP;EACC,OAjKM;;AAkKR;EACC;EACA;;AACD;EACC;EACA;;AACD;EACC;;AACA;EACC,OA1KM;;AA2KP;EACC,OAhLM;;AAiLR;EACC;EACA;;AACA;EACC,kBAtLM;EAuLN;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACD;EACC;EACA;EACA;;;AAEN;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAEF;EACC;;;AAED;EACC;IACC;;EACD;IACC","file":"index.css"}
diff --git a/ui/jhtml-compat/index.php b/ui/jhtml-compat/index.php
index 161b38c..38bfa02 100644
--- a/ui/jhtml-compat/index.php
+++ b/ui/jhtml-compat/index.php
@@ -5,4 +5,4 @@
*js("///index.js")
*js("https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js")
*postjs("///feather.js")
-dns-watch.org
Try "gnu.org", "wikipedia.org", "s.to" or your own website!invalid domain.
\ No newline at end of file
+Try "gnu.org", "wikipedia.org", "s.to" or your own website!invalid domain.
\ No newline at end of file
diff --git a/ui/raw/index.pug b/ui/raw/index.pug
index 8e1c1ec..b17d990 100644
--- a/ui/raw/index.pug
+++ b/ui/raw/index.pug
@@ -1,22 +1,35 @@
-#header
- button: i( data-feather='globe' )
- button: i( data-feather='sun' )
-
-#title
- h1 dns-watch.org
+#content
-#search
- #searchbar
- .buttonspacer
- input#dnswatch-search( type='text' placeholder='Search...' autofocus )
- button#dnswatch-search-submit: i( data-feather='search' )
- button#help: i( data-feather='help-circle' )
- small Try "gnu.org", "wikipedia.org", "s.to" or your own website!
- #loadani
- #spinner
- span loading...
- #invaliddomain
- i( data-feather='x' )
- span invalid domain.
+ #header
+ a( href='https://github.com/tjdev-de/dns-watch' )
+ button.spaceleft: i( data-feather='github' )
+ button: i( data-feather='globe' )
+ button: i( data-feather='sun' )
+
+ #title
+ h1 dns-watch
+ span .org
+ span by
+ a( href='https://www.tjdev.de' ) tjdev.de
-#results
+ #search
+ #searchbar
+ .buttonspacer
+ input#dnswatch-search( type='text' placeholder='Search...' autofocus )
+ button#dnswatch-search-submit: i( data-feather='search' )
+ button#help: i( data-feather='help-circle' )
+ small Try "gnu.org", "wikipedia.org", "s.to" or your own website!
+ #loadani
+ #spinner
+ span loading...
+ #invaliddomain
+ i( data-feather='x' )
+ span invalid domain.
+
+ #results
+
+#footer
+ span dns-watch.org by
+ a( href='https://www.tjdev.de' ) tjdev.de
+ span |
+ a( href='/imprint' ) imprint
diff --git a/ui/raw/index.sass b/ui/raw/index.sass
index 2c4a2c2..be95743 100644
--- a/ui/raw/index.sass
+++ b/ui/raw/index.sass
@@ -16,12 +16,16 @@ html, body
color: $c-fg
font-family: $f-sans
margin: 0
- padding: 0
overflow-x: hidden
+ padding: 0
+ scrollbar-color: lighten($c-bg, 20%) $c-bg !important
input, button
font-family: $f-sans
+#content
+ min-height: calc(100vh - 9rem)
+
#header
height: 4rem
padding: .5rem
@@ -39,6 +43,8 @@ input, button
&:hover
background-color: lighten($c-bg, 5%)
color: darken($c-fg, 20%)
+ &.spaceleft
+ margin-left: 1rem
#title
margin-bottom: 5rem
@@ -47,8 +53,13 @@ input, button
h1
font-size: 4rem
font-weight: 200
+ margin-bottom: 1rem
span
color: darken($c-fg, 50%)
+ span
+ color: darken($c-fg, 30%)
+ a
+ color: darken($c-fg, 30%)
#search
text-align: center
@@ -187,6 +198,14 @@ input, button
vertical-align: -.2rem
width: 1.2rem
+#footer
+ color: darken($c-fg, 30%)
+ height: 9rem
+ padding-top: 5rem
+ text-align: center
+ a
+ color: darken($c-fg, 30%)
+
.uncolored-svg
filter: invert(.8)