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

+

dns-watch.org

by tjdev.de
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

\ No newline at end of file +

dns-watch.org

by tjdev.de
\ 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)