├── icon.png ├── images ├── background.png └── screenshot.png ├── README.md ├── LICENSE ├── scripts └── timer.js ├── styles └── style.css └── index.html /icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/YaN-3k/startpage/HEAD/icon.png -------------------------------------------------------------------------------- /images/background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/YaN-3k/startpage/HEAD/images/background.png -------------------------------------------------------------------------------- /images/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/YaN-3k/startpage/HEAD/images/screenshot.png -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Startpage 2 | 3 | This is a custom browser startpage / new tab page. Based on the Iceberg colorscheme. 4 | 5 | ## How does it look? 6 | 7 | ![Screenshot](images/screenshot.png) 8 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 mamg22 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /scripts/timer.js: -------------------------------------------------------------------------------- 1 | function get_time_clock() { 2 | current_date = new Date(); 3 | 4 | var minute = current_date.getMinutes(); 5 | var hour = current_date.getHours(); 6 | 7 | minute = minute < 10 ? "0" + minute : minute; 8 | 9 | indicator = hour < 12 ? "am" : "pm"; 10 | 11 | hour = hour < 13 ? hour : hour - 12; 12 | 13 | if (hour == 0) { 14 | hour = 12; 15 | } 16 | 17 | return hour + ":" + minute + indicator; 18 | } 19 | 20 | function get_time_log() { 21 | current_date = new Date(); 22 | 23 | var day = current_date.getDate(); 24 | var month = current_date.getMonth() + 1; 25 | var year = current_date.getFullYear(); 26 | var hour = current_date.getHours(); 27 | var minute = current_date.getMinutes(); 28 | var second = current_date.getSeconds(); 29 | 30 | if (hour < 10) hour = "0" + hour; 31 | if (minute < 10) minute = "0" + minute; 32 | if (second < 10) second = "0" + second; 33 | if (day < 10) day = "0" + day; 34 | if (month < 10) month = "0" + month; 35 | 36 | return ( 37 | day + "/" + month + "/" + year + " " + hour + ":" + minute + ":" + second 38 | ); 39 | } 40 | 41 | function welcome() { 42 | current_date = new Date(); 43 | var hour = current_date.getHours(); 44 | if (hour <= 12) { 45 | var phrase = "Good Morning"; 46 | } else if (hour > 12 && hour <= 18) { 47 | var phrase = "Good Aftermoon"; 48 | } else { 49 | var phrase = "Good Evening"; 50 | } 51 | return phrase; 52 | } 53 | 54 | function update_clock() { 55 | document.getElementById("clock").innerText = get_time_clock(); 56 | document.getElementById("title").innerText = welcome(); 57 | } 58 | 59 | window.onload = function() { 60 | document.getElementById("log_time").innerText = get_time_log(); 61 | update_clock(); 62 | setInterval(update_clock, 60000); 63 | }; 64 | -------------------------------------------------------------------------------- /styles/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: monospace; 3 | font-size: 12pt; 4 | color: #d2d4de; 5 | background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)) repeat, 6 | url("../images/background.png") no-repeat center fixed; 7 | background-color: #161821; 8 | -webkit-background-size: cover; 9 | -moz-background-size: cover; 10 | -o-background-size: cover; 11 | background-size: cover; 12 | } 13 | 14 | a { 15 | color: inherit; 16 | text-decoration: none; 17 | } 18 | 19 | .container { 20 | display: flex; 21 | flex-direction: column; 22 | } 23 | 24 | #title { 25 | margin-top: 24px; 26 | margin-bottom: 12px; 27 | font-size: 24pt; 28 | text-align: center; 29 | } 30 | 31 | #clock { 32 | text-align: center; 33 | font-size: 24pt; 34 | color: #b4be82; 35 | } 36 | 37 | #log_time { 38 | padding-left: 5px; 39 | text-align: center; 40 | color: #e27878; 41 | } 42 | 43 | .search-bar { 44 | text-align: center; 45 | margin-top: 20px; 46 | margin-bottom: 20px; 47 | } 48 | 49 | .search-bar input { 50 | min-width: 500px; 51 | border-radius: 5px; 52 | color: #d2d4de; 53 | background-color: rgb(22, 24, 33, 0.8); 54 | border: 0px solid #161821; 55 | width: 50%; 56 | padding: 5px; 57 | } 58 | 59 | ::-webkit-input-placeholder { 60 | text-align: center; 61 | } 62 | :-moz-placeholder { 63 | text-align: center; 64 | } 65 | ::-moz-placeholder { 66 | text-align: center; 67 | } 68 | :-ms-input-placeholder { 69 | text-align: center; 70 | } 71 | 72 | .search-bar input:focus::-webkit-input-placeholder { 73 | color: transparent; 74 | } 75 | .search-bar input:focus:-moz-placeholder { 76 | color: transparent; 77 | } 78 | .search-bar input:focus::-moz-placeholder { 79 | color: transparent; 80 | } 81 | .search-bar input:focus:-ms-input-placeholder { 82 | color: transparent; 83 | } 84 | 85 | .terminal-container { 86 | width: 50%; 87 | min-width: 500px; 88 | padding-top: 20px; 89 | padding-bottom: 20px; 90 | border-radius: 5px; 91 | background-color: rgb(22, 24, 33, 0.8); 92 | margin: 0 auto; 93 | } 94 | 95 | .bookmark-container { 96 | display: flex; 97 | flex-direction: row; 98 | justify-content: space-evenly; 99 | flex-wrap: wrap; 100 | width: 100%; 101 | } 102 | 103 | .bookmark-set { 104 | border: 1px solid #91acd1; 105 | flex: 1 0 100px; 106 | margin-right: 20px; 107 | margin-top: 10px; 108 | margin-bottom: 10px; 109 | padding-bottom: 10px; 110 | } 111 | 112 | .bookmark-title { 113 | font-size: 12pt; 114 | font-weight: bold; 115 | text-align: center; 116 | margin-bottom: 5px; 117 | color: #161821; 118 | background-color: #91acd1; 119 | } 120 | 121 | .bookmark { 122 | font-size: 11pt; 123 | margin-bottom: 2px; 124 | text-align: center; 125 | color: #95c4ce; 126 | } 127 | 128 | .bookmark a:focus { 129 | font-weight: bold; 130 | } 131 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | New Tab 6 | 7 | 8 | 9 | 10 | 11 |
12 |
Welcome Back
13 |
--:----
14 |
15 | 16 |
17 | 18 |
19 |
20 | ---------------------------------
21 |
 Last login:
--:--:--
22 |  Welcome to your Arch Linux.
23 | ---------------------------------
24 | 25 | ╭─jan@arch ~/.script/pager ‹master*›
26 | ╰─$ ls -la
27 | 28 |
29 |
30 |
Entertainment
31 |
32 |
Reddit
33 |
Youtube
34 |
35 |
36 |
37 |
Social
38 |
39 |
Riot.im
40 |
Discord
41 |
Facebook
42 |
43 |
44 |
45 |
Dev
46 |
47 |
Github
48 |
Arch Linux
49 |
50 |
51 |
52 | 53 | ╭─jan@arch ~/.script/pager ‹master*›
54 | ╰─$ lsb_release -a
55 | LSB Version: 1.4
56 | Distributor ID: Arch
57 | Description: Arch Linux
58 | Release: rolling
59 | Codename: n/a
60 | 61 |
62 |
63 |
64 | 65 | 66 | 67 | --------------------------------------------------------------------------------