--- /dev/null
+window.onload = function() {
+ var _useragent = navigator.userAgent;
+ var _lang = navigator.language.replace("-", "_");
+ var _info = "\n == Debug Info ==\n\n"
+ + "User Agent:\n\t" + _useragent + "\n"
+ + "Language:\n\t" + _lang + "\n";
+
+ //console.log("User Agent: "+_useragent);
+ //console.log("Language: "+_lang);
+ console.debug(_info);
+
+ /**
+ * Greeting
+ */
+ greeting.init(
+ "header h1",
+ "greeting",
+ );
+ console.info("You can set a new greeting via JavaScript:\n\tgreeting.set(\"Foo bar\")");
+ greeting.hide();
+
+ /*
+ * Set focus to search <input>
+ */
+ document.querySelector("input[type=search]").focus();
+
+ /**
+ * Redirect if an URL was entered in the search form
+ */
+ document.querySelector("#search form").addEventListener('submit', (event) => {
+ if (document.querySelector("input[type=search]").value.startsWith("http://") || document.querySelector("input[type=search]").value.startsWith("https://")) {
+ console.info('location.href = document.querySelector("input[type=search]").value;')
+ location.href = document.querySelector("input[type=search]").value;
+ event.preventDefault();
+ }
+ });
+};
\ No newline at end of file
--- /dev/null
+<?php
+
+
+
+?><!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+ <title>Neuer Tab</title>
+
+ <link rel="stylesheet" type="text/css" href="style.css">
+ <link rel="icon" type="image/png" sizes="512x512" href="//dev.malte70.de/tango-icons/img/go-home-512.png">
+ <link rel="shortcut icon" type="image/png" sizes="512x512" href="//dev.malte70.de/tango-icons/img/go-home-512.png">
+ </head>
+ <body id="top">
+ <header>
+ <h1>hello world</h1>
+ </header>
+ <main>
+ <section id="search">
+ <form action="https://google.com/search" method="GET">
+ <input type="hidden" name="hl" value="de">
+ <!--<input type="text" name="q" placeholder="Google-Suche">-->
+ <input type="search" name="q" placeholder="Google-Suche">
+ <button type="submit">Suchen</button>
+ </form>
+ </section>
+ </main>
+
+ <script type="text/javascript" src="../js/greeting.js"></script>
+<?php
+print("\t\t<script type=\"text/javascript\">");
+require("../js/new-tab.js");
+print("\t\t</script>");
+?>
+ </body>
+</html>
--- /dev/null
+@charset "UTF-8";
+
+/**
+ * New Tab page
+ *
+ * <https://startseite.malte70.de/new-tab/>
+ *
+ * Farbpalette:
+ * Mountain Living // <https://www.colourlovers.com/palette/3334174/Mountain_Living>
+ * Hintergrund:
+ * Flat Bone // #EDEBE6 // rgb(237,235,230)
+ * Highlight:
+ * Rigor Mortis // #403B33 // rgb(64,59,51)
+ * Text:
+ * waitress // #A40114 // rgb(164,1,20)
+ * Highlight (secondary):
+ * G 445 // #94C7B6 // rgb(148,199,182)
+ *
+ * EDIT 2021-05-22:
+ * Es werden die Farben von tiny[1] verwendet, da sie
+ * nicht so unangenehm grell sind.
+ *
+ * [1]: https://dev.malte70.de/webdesigns/Startseiten/tiny/
+ */
+
+@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,400;1,400&display=swap');
+
+@import url('https://xyz.malte70.de/css/normalize.min.css');
+
+/**
+ * @url https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties
+ */
+:root {
+ --color-background: #EDEBE6;
+ --color-foreground: #403B33;
+ --color-highlight: #A40114;
+ --color-highlight-secodary: #94C7B6;
+ --font-body: 'Source Sans Pro', sans-serif;
+ --font-input: 'Inconsolata-g', 'Inconsolata', monospace;
+}
+
+*, *:before, *:after {
+ box-sizing: border-box;
+}
+
+*:focus {
+ outline: none;
+}
+
+body {
+ background: var(--color-background);
+ color: var(--color-foreground);
+ font: 20px var(--font-body);
+}
+
+/* =============== Page Header =============== */
+header {
+ margin-top: 3.5em;
+ text-align: center;
+}
+header h1 {
+ font-size: 4em;
+ font-weight: 200;
+ color: var(--color-highlight);
+}
+
+/* =============== Main Area :: Search Widget =============== */
+main {
+ margin-top: 3.25em;
+ text-align: center;
+}
+main #search {
+ width: 40em;
+ margin: 20em auto 2em;
+ padding: 0;
+}
+main #search input[type=text],
+main #search input[type=search] {
+ display: inline-block;
+ border: 1px solid var(--color-highlight);
+ /*border-right: 0;*/
+ background: var(--color-background);
+ margin: 0;
+ /*margin-right: -5px;*/
+ padding: 0.6em;
+ width: 100%;
+ /*font: 16px "Source Sans Pro",sans-serif;*/
+ font: 1em var(--font-input);
+
+}
+main #search input[type=text]::placeholder,
+main #search input[type=text]::-moz-placeholder,
+main #search input[type=search]::placeholder,
+main #search input[type=search]::-moz-placeholder {
+ color: var(--color-highlight);
+ font-style: italic;
+ text-align: center;
+}
+
+main #search input[type=text]:active,
+main #search input[type=text]:focus,
+main #search input[type=search]:active,
+main #search input[type=search]:focus {
+ border-color: var(--color-highlight);
+ font-style: normal;
+}
+main #search button[type=submit] {
+ display: inline-block;
+ border: 1px solid var(--color-highlight);
+ background: var(--color-highlight);
+ color: var(--color-background);
+ margin: .5em 0;
+ padding: 5px;
+ width: 27%;
+ font: 1em "Source Sans Pro",sans-serif;
+ display: none;
+}
+main #search button[type=submit]:hover,
+main #search button[type=submit]:active {
+ cursor: pointer;
+ background: none;
+ color: var(--color-foreground);
+}
projects / startseite.malte70.de.git / commitdiff