mirror of https://github.com/mue/mue.git
settings done
This commit is contained in:
David Ralph
parent
7f4716f637
commit
8b268d680b
59
.eslintrc
59
.eslintrc
|
|
@ -1,59 +0,0 @@
|
|||
{
|
||||
"env": {
|
||||
"es6": true,
|
||||
"amd": true,
|
||||
"node": true,
|
||||
"browser": true,
|
||||
"commonjs": true
|
||||
},
|
||||
"parserOptions": {
|
||||
"ecmaVersion": 9,
|
||||
"sourceType": "module",
|
||||
"ecmaFeatures": {
|
||||
"jsx": true,
|
||||
"forOf": true,
|
||||
"spread": true,
|
||||
"modules": true,
|
||||
"classes": true,
|
||||
"generators": true,
|
||||
"restParams": true,
|
||||
"regexUFlag": true,
|
||||
"regexYFlag": true,
|
||||
"globalReturn": true,
|
||||
"destructuring": true,
|
||||
"impliedStrict": true,
|
||||
"blockBindings": true,
|
||||
"defaultParams": true,
|
||||
"octalLiterals": true,
|
||||
"arrowFunctions": true,
|
||||
"binaryLiterals": true,
|
||||
"templateStrings": true,
|
||||
"superInFunctions": true,
|
||||
"unicodeCodePointEscapes": true,
|
||||
"objectLiteralShorthandMethods": true,
|
||||
"objectLiteralComputedProperties": true,
|
||||
"objectLiteralDuplicateProperties": true,
|
||||
"objectLiteralShorthandProperties": true
|
||||
}
|
||||
},
|
||||
"plugins": [],
|
||||
"rules": {
|
||||
"semi": "error",
|
||||
"indent": [ 0, 2 ],
|
||||
"strict": "off",
|
||||
"eqeqeq": "error",
|
||||
"no-var": "warn",
|
||||
"no-undef": "warn",
|
||||
"comma-dangle": "warn",
|
||||
"no-dupe-args": "warn",
|
||||
"no-dupe-keys": "warn",
|
||||
"require-await": "warn",
|
||||
"no-global-assign": "warn",
|
||||
"no-duplicate-imports": "error",
|
||||
"no-dupe-class-members": "error"
|
||||
},
|
||||
"globals": {
|
||||
"_config": false,
|
||||
"console": false
|
||||
}
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
patreon: ohlookitsderpy
|
||||
ko_fi: ohlookitsderpy
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
# Directories
|
||||
.vscode/
|
||||
node_modules/
|
||||
|
||||
# Files
|
||||
yarn.lock
|
||||
yarn-error.log
|
||||
package-lock.json
|
||||
21
LICENSE
21
LICENSE
|
|
@ -1,21 +0,0 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2018-2019 David Ralph (ohlookitsderpy)
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
128
README.md
128
README.md
|
|
@ -1,128 +0,0 @@
|
|||
<img src='assets/logo/logo_horizontal.png'>
|
||||
|
||||
# Mue
|
||||
[](https://www.codacy.com/app/ohlookitsderpy/Mue?utm_source=github.com&utm_medium=referral&utm_content=ohlookitsderpy/Mue&utm_campaign=Badge_Grade)
|
||||
[](https://discord.gg/HJmmmTB)
|
||||
|
||||
<a href='https://ko-fi.com/ohlookitsderpy' target='_blank'><img height='36' src='assets/kofi.png' alt='Buy me a coffee at ko-fi.com' /></a>
|
||||
<a href='https://patreon.com/ohlookitsderpy' target='_blank'><img height='36' src='assets/patreon.png' alt='Become a patron on patreon.com' /></a>
|
||||
|
||||
Fast, open and free-to-use new tab page for most modern browsers.
|
||||
|
||||
## Features
|
||||
* Fast and free
|
||||
* Supports multiple browsers
|
||||
* Actively developed and opensource
|
||||
* Multiple language support
|
||||
|
||||
## Installation
|
||||
### Chrome
|
||||
<a href='https://chrome.google.com/webstore/detail/mue/bngmbednanpcfochchhgbkookpiaiaid'><img src='assets/chrome.png' target='_blank'></a>
|
||||
|
||||
Link: [Chrome Web Store](https://chrome.google.com/webstore/detail/mue/bngmbednanpcfochchhgbkookpiaiaid)
|
||||
|
||||
Development: Read the [Development](#development) section.
|
||||
### Firefox
|
||||
<a href='https://addons.mozilla.org/firefox/addon/mue'><img src='assets/firefox.png' target='_blank'></a>
|
||||
|
||||
Link: [Firefox Add-ons](https://addons.mozilla.org/firefox/addon/mue)
|
||||
|
||||
Development: Read the [Development](#development) section.
|
||||
### Opera/Other
|
||||
Link: [GitHub Releases](https://github.com/ohlookitsderpy/Mue/releases)
|
||||
|
||||
Development: Read the [Development](#development) section.
|
||||
|
||||
### Development
|
||||
<h5>Requirements</h5>
|
||||
<ol>
|
||||
<li>Git (optional)</li>
|
||||
<li>Node.js</li>
|
||||
<li>A suitable browser</li>
|
||||
</ol>
|
||||
<h5>Starting</h5>
|
||||
<ol>
|
||||
<li> <code>git clone https://github.com/ohlookitsderpy/Mue</code> (If you don't have Git just go to <b>Clone or
|
||||
download</b> and click <b>Download ZIP</b>)
|
||||
<li> Open a terminal and run these commands: (in the Mue directory)
|
||||
<li> <code>yarn</code> (or <code>npm install</code>)
|
||||
<li> <code>yarn run sass-watch</code> (or <code>npm run sass-watch</code>)
|
||||
<li> Open another terminal and run this command: (in the Mue directory)
|
||||
<li> <code>yarn run js-watch</code> (or <code>npm run js-watch</code>)
|
||||
<li> Start developing! (See the sections below for how to set it up with your browser)
|
||||
</ol>
|
||||
<details>
|
||||
<summary><b>Chrome</b> (Click to expand)</summary>
|
||||
<ol>
|
||||
<li> Rename <code>manifest-chrome.json</code> to <code>manifest.json</code>
|
||||
<li> Visit <code>chrome://extensions</code> in Chrome
|
||||
<li> Click <b>Load unpacked</b> (Make sure <b>Developer Mode</b> is on)
|
||||
<li> Go to the directory containing Mue and click <b>ok</b>
|
||||
<li> Enjoy your new tab!
|
||||
</details>
|
||||
<details>
|
||||
<summary><b>Opera</b> (Click to expand)</summary>
|
||||
<ol>
|
||||
<li> Rename <code>manifest-opera.json</code> to <code>manifest.json</code>
|
||||
<li> Visit <code>about://extensions</code> in Opera
|
||||
<li> Click <b>Load unpacked extension...</b> (Make sure <b>Developer Mode</b> is on)
|
||||
<li> Go to the directory containing Mue and click <b>ok</b>
|
||||
<li> Enjoy your new tab!
|
||||
</details>
|
||||
<details>
|
||||
<summary><b>Firefox</b> (Click to expand)</summary>
|
||||
<i>Note: I'm currently trying to find a better method to do this, but this works for now.</i>
|
||||
<ol>
|
||||
<li> Rename <code>manifest-firefox.json</code> to <code>manifest.json</code>
|
||||
<li> Visit <code>about:debugging#addons</code> in Firefox
|
||||
<li> Click <b>Load Temporary Add-on</b>
|
||||
<li> Go to the directory containing Mue and click on the <b>manifest.json</b>
|
||||
<li> Enjoy your new tab!
|
||||
</ol>
|
||||
</details>
|
||||
<details>
|
||||
<summary><b>Other</b> (Click to expand)</summary>
|
||||
<i>Note: To get the full new tab experience, set your browser to open the <code>index.html</code> on startup and tab open!</i>
|
||||
<ol>
|
||||
<li> Open the <code>index.html</code> in your browser
|
||||
<li> Enjoy your new tab!
|
||||
</ol>
|
||||
</details>
|
||||
|
||||
## Screenshot
|
||||
*Will be updated if needed*
|
||||
|
||||
<img src='assets/screenshot.jpg'>
|
||||
|
||||
## Credits
|
||||
|
||||
[TurboMarshmello](https://github.com/TurboMarshmello) - Portions of original code, name idea
|
||||
|
||||
[Pexels](https://pexels.com) - Stock photos used
|
||||
|
||||
[Opera Forum](https://forums.opera.com/topic/25046/how-to-disable-completely-the-speed-dial/14) - Portions of code to add Opera support
|
||||
|
||||
[Animate.css](https://daneden.github.io/animate.css) - Portions of code used to add animations
|
||||
|
||||
### Translations
|
||||
[ohlookitsderpy](https://github.com/ohlookitsderpy) - English (Quotes and Messages)
|
||||
|
||||
[Yanderella](https://github.com/Chivi19) - Italian (Quotes and Messages)
|
||||
|
||||
Pepehound - Spanish (Quotes and Messages)
|
||||
|
||||
Candystick - Portuguese (Some Quotes)
|
||||
|
||||
[PassTheWessel](https://github.com/PassTheWessel) - Dutch (Messages)
|
||||
|
||||
[Yanderella](https://github.com/Chivi19) and [ohlookitsderpy](https://github.com/ohlookitsderpy) - French (Messages)
|
||||
|
||||
[untocodes](https://github.com/untocodes) - Finnish and German (Messages)
|
||||
|
||||
[dondish](https://github.com/dondish) - Hebrew and Russian (Messages)
|
||||
|
||||
[MrSheldon](https://github.com/MrSheldon) - Arabic and Swedish (Messages)
|
||||
|
||||
*Feel free to pull request with other translations!*
|
||||
|
||||
and all the contributors <3
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.7 KiB |
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../scss/modules/_bg.scss","../scss/modules/_font.scss","../scss/modules/_misc.scss","../scss/modules/_quote.scss","../scss/modules/_search.scss","../scss/modules/_buttons.scss","../scss/modules/_settings-modal.scss","../scss/modules/_time-greeting.scss"],"names":[],"mappings":"CAkBA,gDACA,+CACA,iDACA,8CACA,6CACA,2CACA,6CACA,2CACA,iDACA,6CACA,+CACA,+CACA,+CACA,6CACA,+CACA,+CACA,+CACA,+CACA,+CACA,gDACA,gDACA,8CACA,8CACA,kDACA,8CCvBA,WACI,6BACA,kBACA,gBACA,+DAGJ,gBACI,6BACA,mBACA,kBACA,eACA,cACA,sBACA,oBACA,qBACA,mBACA,iBACA,cACA,kCACA,6BACA,kCAGJ,WACI,wBACA,8HAEA,kEAGJ,iBACI,eACA,eACA,WCpDJ,sBACA,KAEC,aACA,sBACA,6BACA,mBAEA,SAEA,sBACA,wBACA,sBAEA,wBACA,WAEA,gBAEG,sBACH,iBAID,MACC,0BAGD,sBAGC,kBACA,kFAID,YACI,mBACA,WCrBJ,OACI,iBAEA,yBAEA,YACA,kBAEA,iBACA,kBAEA,kBACI,oBACA,kBAEA,2BACI,YACA,mBAGJ,0BACI,YACA,kBAIR,YACI,iBC3BR,YACI,kBACA,UACA,SACA,aACA,mBACA,mBACI,cACA,YACA,eACA,gBACA,uBAIA,eAHA,oCACI,oCAIR,6BACI,aACA,eACA,WACA,WACA,WACA,iBACA,gBACA,mBACA,eAIR,kBACI,YACA,YACA,mCAGJ,eACI,aACA,mBCxDJ,4BAEI,uBACA,YACA,WACA,kBACA,kBACA,qBACA,eACA,eACA,kBACA,mBAGJ,SACI,kBACA,WACA,SACA,0BACI,oCACA,cAIR,YACI,kBACA,WACA,QAGJ,kBACI,uBACA,YACA,WACA,kBACA,kBACA,qBACA,eACA,eACA,kBACA,mBCxCJ,gBACI,uBACA,YACA,WACA,kBACA,kBACA,qBACA,eACA,eACA,kBACA,mBAGJ,SACI,kBACA,WACA,SAGJ,iBACI,eACA,eACA,WAGJ,SACI,gBACA,SACA,iBAGJ,OACI,aAIJ,QACI,kBACA,qBACA,WACA,YAEA,cACI,UACA,QACA,SAIR,QACI,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,uBACA,eAEA,gBACI,kBACA,WACA,YACA,WACA,SACA,WACA,sBACA,uBACA,eAIR,sBACI,yBAGJ,oBACI,2BAGJ,6BACI,mCACA,+BACA,2BAGJ,QACI,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,uBACA,eACA,mBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,sBACA,uBACA,eACA,kBAGJ,OACI,WAGJ,YACI,eACA,wBACA,YACA,YACA,kBACA,mBACA,aACA,YAEA,mCACI,wBACA,gBACA,WACA,YACA,kBACA,mBACA,eAGJ,+BACI,WACA,YACA,kBACA,mBACA,eAIR,UACI,kBACA,cACA,YACA,aACA,YACA,mBAGJ,sBAEI,eAGJ,aACI,YAGJ,SACI,gBACA,SACA,iBAGJ,OACI,aAGJ,eACI,iBAGJ,IACI,eACA,gBChKJ,UACC,oCACA,kBACG,oBACA,iBACA,mBAKJ,KACC,oCACA,gBACA,iBAGD,2CACK,wBACE,sBACC,qBACI","file":"base.css"}
|
||||
|
|
@ -1,8 +1,4 @@
|
|||
body {
|
||||
font-family: 'Noto Sans HK', sans-serif;
|
||||
background: #2d3436;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: #ffffff;
|
||||
|
|
@ -19,11 +15,6 @@ a {
|
|||
overflow: auto; /* Enable scroll if needed */
|
||||
background-color: rgb(0,0,0); /* Fallback color */
|
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
|
||||
font-family: 'Noto Sans HK', sans-serif;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
h1, h2, h3, p {
|
||||
|
|
@ -35,7 +26,7 @@ h1, h2, h3, p {
|
|||
margin: auto;
|
||||
padding: 30px;
|
||||
width: 450px;
|
||||
max-height: 600px;
|
||||
max-height: 800px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
|
|
@ -67,9 +58,6 @@ p.subtitle {
|
|||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
label.switch, p.switch {
|
||||
display: inline;
|
||||
|
|
@ -91,10 +79,6 @@ label.switch {
|
|||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.close2:hover,
|
||||
.close2:focus {
|
||||
color: #bdc3c7;
|
||||
|
|
@ -121,62 +105,11 @@ label.switch {
|
|||
background: #2c3e50;
|
||||
}
|
||||
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
left: 4px;
|
||||
bottom: 4px;
|
||||
background-color: white;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #2196F3;
|
||||
}
|
||||
|
||||
input:focus + .slider {
|
||||
box-shadow: 0 0 1px #2196F3;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(26px);
|
||||
-ms-transform: translateX(26px);
|
||||
transform: translateX(26px);
|
||||
}
|
||||
|
||||
/* Rounded sliders */
|
||||
.slider.round {
|
||||
border-radius: 34px;
|
||||
}
|
||||
|
||||
.slider.round:before {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.drop-btn {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
background: #2d3436;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
|
||||
.modal {
|
||||
display: none; /* Hidden by default */
|
||||
position: fixed; /* Stay in place */
|
||||
z-index: 1; /* Sit on top */
|
||||
padding-top: 100px; /* Location of the box */
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%; /* Full width */
|
||||
height: 100%; /* Full height */
|
||||
overflow: auto; /* Enable scroll if needed */
|
||||
background-color: rgb(0,0,0); /* Fallback color */
|
||||
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
|
||||
}
|
||||
|
||||
h1, h2, h3, p {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: #ecf0f1;
|
||||
margin: auto;
|
||||
padding: 30px;
|
||||
width: 450px;
|
||||
max-height: 800px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.title, .close {
|
||||
display: inline;
|
||||
}
|
||||
.settingsTitle, .close2 {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #000000;
|
||||
float: left;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.settingsTitle {
|
||||
color: #000000;
|
||||
float: left;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p.subtitle {
|
||||
color: #000000;
|
||||
float: left;
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.close {
|
||||
color: #aaaaaa;
|
||||
float: right;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.close:hover,
|
||||
.close:focus {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.close2 {
|
||||
color: #aaaaaa;
|
||||
float: right;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.close2:hover,
|
||||
.close2:focus {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
/* Track */
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
}
|
||||
|
||||
/* Handle */
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #888;
|
||||
}
|
||||
|
||||
/* Handle on hover */
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
.drop-btn {
|
||||
color: #555;
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
a{color:#fff}.modal{display:none;position:fixed;z-index:1;padding-top:100px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4)}img{max-width:100%;margin-top:20px}h1,h2,h3,p{color:#fff}.modal-content{background-color:#2d3436;margin:auto;padding:30px;width:450px;max-height:600px;overflow-y:auto}.title,.close,.settingsTitle,.close2{display:inline}.title{color:#fff;float:left;font-size:20px;font-weight:bold}.settingsTitle{color:#fff;float:left;font-size:30px;font-weight:bold}p.subtitle{color:#fff;float:left;font-size:10px;font-weight:bold;margin-top:10px}.close{color:#fff;float:right;font-size:30px;font-weight:bold}.title{float:left}label.switch,p.switch{display:inline}label.switch{float:right}.close:hover,.close:focus{color:#bdc3c7;text-decoration:none;cursor:pointer}.close2{color:#fff;float:right;font-size:30px;font-weight:bold}.close2:hover,.close2:focus{color:#bdc3c7;text-decoration:none;cursor:pointer}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:#2d3436}::-webkit-scrollbar-thumb{background:#34495e}::-webkit-scrollbar-thumb:hover{background:#2c3e50}/*# sourceMappingURL=dark.css.map */
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../scss/themes/dark.scss"],"names":[],"mappings":"AAAA,EACI,WAGJ,OACI,aACA,eACA,UACA,kBACA,OACA,MACA,WACA,YACA,cACA,sBACA,gCAGJ,IACI,eACA,gBAGJ,WAII,WAGJ,eACI,yBACA,YACA,aACA,YACA,iBACA,gBAGJ,qCAII,eAGJ,OACI,WACA,WACA,eACA,iBAGJ,eACI,WACA,WACA,eACA,iBAGJ,WACI,WACA,WACA,eACA,iBACA,gBAGJ,OACI,WACA,YACA,eACA,iBAGJ,OACI,WAGJ,sBAEI,eAGJ,aACI,YAGJ,0BAEI,cACA,qBACA,eAGJ,QACI,WACA,YACA,eACA,iBAGJ,4BAEI,cACA,qBACA,eAGJ,oBACI,UAGJ,0BACI,mBAGJ,0BACI,mBAGJ,gCACI","file":"dark.css"}
|
||||
|
|
@ -0,0 +1 @@
|
|||
body{font-family:"Noto Sans HK",sans-serif;background:#fff;font-size:20px}.modal{display:none;position:fixed;z-index:1;padding-top:100px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4);font-family:"Noto Sans HK",sans-serif}img{max-width:100%;margin-top:20px}h1,h2,h3,p{color:#000}.modal-content{background-color:#ecf0f1;margin:auto;padding:30px;width:450px;max-height:600px;overflow-y:auto}.title,.close{display:inline}.settingsTitle,.close2{display:inline}.title{color:#000;float:left;font-size:20px;font-weight:bold}.settingsTitle{color:#000;float:left;font-size:30px;font-weight:bold}label.switch,p.switch{display:inline}label.switch{float:right}p.subtitle{color:#000;float:left;font-size:10px;font-weight:bold;margin-top:10px}.close{color:#aaa;float:right;font-size:30px;font-weight:bold}.title{float:left}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.close2{color:#aaa;float:right;font-size:30px;font-weight:bold}.title{float:left}.close2:hover,.close2:focus{color:#000;text-decoration:none;cursor:pointer}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888}::-webkit-scrollbar-thumb:hover{background:#555}.switch{position:relative;display:inline-block;width:60px;height:34px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}/*# sourceMappingURL=light.css.map */
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../scss/themes/light.scss"],"names":[],"mappings":"AAAA,KACI,sCACA,gBACA,eAEJ,OACI,aACA,eACA,UACA,kBACA,OACA,MACA,WACA,YACA,cACA,sBACA,gCACA,sCAEJ,IACI,eACA,gBAGJ,WACI,WAGJ,eACI,yBACA,YACA,aACA,YACA,iBACA,gBAGJ,cACE,eAEF,uBACE,eAGF,OACI,WACA,WACA,eACA,iBAGJ,eACE,WACA,WACA,eACA,iBAGF,sBACE,eAEF,aACE,YAGF,WACI,WACA,WACA,eACA,iBACA,gBAEJ,OACI,WACA,YACA,eACA,iBAEJ,OACI,WAGJ,0BAEI,WACA,qBACA,eAGJ,QACE,WACA,YACA,eACA,iBAEF,OACE,WAGF,4BAEE,WACA,qBACA,eAEF,oBACI,UAIJ,0BACI,mBAIJ,0BACI,gBAIJ,gCACI,gBAEJ,QACI,kBACA,qBACA,WACA,YAGF,cACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,uBACA,eAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,sBACA,uBACA,eAGF,sBACE,yBAGF,oBACE,2BAGF,6BACE,mCACA,+BACA,2BAIF,cACE,mBAGF,qBACE","file":"light.css"}
|
||||
|
|
@ -0,0 +1,438 @@
|
|||
.mountain {
|
||||
background-image: url("../img/1.jpeg")
|
||||
}
|
||||
|
||||
.sunrise {
|
||||
background-image: url("../img/2.jpeg")
|
||||
}
|
||||
|
||||
.butterfly {
|
||||
background-image: url("../img/3.jpeg")
|
||||
}
|
||||
|
||||
.leaves {
|
||||
background-image: url("../img/4.jpeg")
|
||||
}
|
||||
|
||||
.river {
|
||||
background-image: url("../img/5.jpeg")
|
||||
}
|
||||
|
||||
.sea {
|
||||
background-image: url("../img/6.jpeg")
|
||||
}
|
||||
|
||||
.space {
|
||||
background-image: url("../img/7.jpeg")
|
||||
}
|
||||
|
||||
.ice {
|
||||
background-image: url("../img/8.jpeg")
|
||||
}
|
||||
|
||||
.waterfall {
|
||||
background-image: url("../img/9.jpeg")
|
||||
}
|
||||
|
||||
.lake {
|
||||
background-image: url("../img/10.jpeg")
|
||||
}
|
||||
|
||||
.sunset {
|
||||
background-image: url("../img/11.jpeg")
|
||||
}
|
||||
|
||||
.desert {
|
||||
background-image: url("../img/12.jpeg")
|
||||
}
|
||||
|
||||
.canyon {
|
||||
background-image: url("../img/13.jpeg")
|
||||
}
|
||||
|
||||
.rose {
|
||||
background-image: url("../img/14.jpeg")
|
||||
}
|
||||
|
||||
.forest {
|
||||
background-image: url("../img/15.jpeg")
|
||||
}
|
||||
|
||||
.cherry {
|
||||
background-image: url("../img/16.jpeg")
|
||||
}
|
||||
|
||||
.clouds {
|
||||
background-image: url("../img/17.jpeg")
|
||||
}
|
||||
|
||||
.winter {
|
||||
background-image: url("../img/18.jpeg")
|
||||
}
|
||||
|
||||
.autumn {
|
||||
background-image: url("../img/19.jpeg")
|
||||
}
|
||||
|
||||
.flowers {
|
||||
background-image: url("../img/20.jpeg")
|
||||
}
|
||||
|
||||
.sunrise {
|
||||
background-image: url("../img/21.jpeg")
|
||||
}
|
||||
|
||||
.rocks {
|
||||
background-image: url("../img/22.jpeg")
|
||||
}
|
||||
|
||||
.trees {
|
||||
background-image: url("../img/23.jpeg")
|
||||
}
|
||||
|
||||
.mountains {
|
||||
background-image: url("../img/24.jpeg")
|
||||
}
|
||||
|
||||
.beach {
|
||||
background-image: url("../img/25.jpeg")
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("../font/MaterialIcons-Regular.woff2") format("woff2")
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-moz-font-feature-settings: "liga";
|
||||
font-feature-settings: "liga";
|
||||
-moz-osx-font-smoothing: grayscale
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Open Sans";
|
||||
src: url("../font/opensans-regular-webfont.woff2") format("woff2"),
|
||||
url("../font/opensans-regular-webfont.woff") format("woff");
|
||||
src: url("../font/roboto-v18-latin-regular.woff2") format("woff2"),
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
margin: 0;
|
||||
background-size: cover;
|
||||
background-position: 50%;
|
||||
background-color: #000;
|
||||
font-family: "Open Sans";
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
:root {
|
||||
--shadow-color: #111111CC
|
||||
}
|
||||
#withSeconds, #withoutSeconds, #greetingText {
|
||||
-webkit-touch-callout: none; /* iOS Safari */
|
||||
-webkit-user-select: none; /* Safari */
|
||||
-khtml-user-select: none; /* Konqueror HTML */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* Internet Explorer/Edge */
|
||||
user-select: none; /* Non-prefixed version, currently
|
||||
supported by Chrome and Opera */
|
||||
}
|
||||
.greeting,
|
||||
time,
|
||||
.quote {
|
||||
position: absolute;
|
||||
filter: drop-shadow(var(--shadow-shift) var(--shadow-shift) 0 var(--shadow-color))
|
||||
}
|
||||
|
||||
.quote {
|
||||
padding-top: 15em;
|
||||
--shadow-shift: 0.125rem;
|
||||
width: 37.5%;
|
||||
max-width: 37.5rem;
|
||||
font-size: 1.5rem;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.quote blockquote {
|
||||
margin: 0 0 .25rem 0;
|
||||
line-height: 1.125
|
||||
}
|
||||
|
||||
.quote blockquote ::before {
|
||||
content: "“";
|
||||
margin-right: .25ch
|
||||
}
|
||||
|
||||
.quote blockquote ::after {
|
||||
content: "”";
|
||||
margin-left: .25ch
|
||||
}
|
||||
|
||||
.quote cite {
|
||||
font-size: 83.33%
|
||||
}
|
||||
|
||||
button.settings,
|
||||
button.news {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
padding: 20px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
display: table-cell
|
||||
}
|
||||
|
||||
.buttons {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px
|
||||
}
|
||||
|
||||
button.news {
|
||||
position: absolute;
|
||||
right: 60px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 20px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
i.material-icons {
|
||||
font-size: 30px;
|
||||
display: inline;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
li.items {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding-top: 30px
|
||||
}
|
||||
|
||||
.modal {
|
||||
display: none
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
max-height: 500px;
|
||||
}
|
||||
|
||||
.greeting {
|
||||
text-shadow: 0 0 25px rgba(0,0,0,0.3);
|
||||
font-size: 3.25rem;
|
||||
padding-bottom: 10em;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
time {
|
||||
font-size: 12rem;
|
||||
font-weight: bold;
|
||||
text-shadow: 0 0 25px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.search-bar input[type=text] {
|
||||
padding: 10px;
|
||||
font-size: 15px;
|
||||
border: 5px;
|
||||
opacity: 0.5;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
margin-left: 5px;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.search-bar button {
|
||||
font-size: 1px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
background: none;
|
||||
--shadow-shift: 0.4rem;
|
||||
|
||||
}
|
||||
|
||||
.search-bar button i.material-icons {
|
||||
text-shadow: 0 0 25px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.buttons i.material-icons {
|
||||
text-shadow: 0 0 20px rgba(0,0,0,0.3);
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.search-bar input[type=text], .search-bar button {
|
||||
display: inline
|
||||
}
|
||||
|
||||
.input.searchText {
|
||||
flex-grow:2;
|
||||
border:none;
|
||||
box-shadow: 0 0 20px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.searchbarform {
|
||||
display:flex;
|
||||
flex-direction:row;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: block;
|
||||
float: right;
|
||||
padding: 10px;
|
||||
border: none;
|
||||
background: #ecf0f1;
|
||||
}
|
||||
label.switch, p.switch {
|
||||
display: inline;
|
||||
}
|
||||
label.switch {
|
||||
float: right;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
left: 4px;
|
||||
bottom: 4px;
|
||||
background-color: white;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
input:checked + .slider {
|
||||
background-color: #FF4F4E;
|
||||
}
|
||||
|
||||
input:focus + .slider {
|
||||
box-shadow: 0 0 1px #FF4F4E;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(26px);
|
||||
-ms-transform: translateX(26px);
|
||||
transform: translateX(26px);
|
||||
}
|
||||
|
||||
/* Rounded sliders */
|
||||
.slider.round {
|
||||
border-radius: 34px;
|
||||
}
|
||||
|
||||
.slider.round:before {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.blurslider {
|
||||
margin-top: 7px;
|
||||
-webkit-appearance: none;
|
||||
width: 200px;
|
||||
height: 15px;
|
||||
border-radius: 5px;
|
||||
background: #d3d3d3;
|
||||
outline: none;
|
||||
float: right;
|
||||
}
|
||||
|
||||
|
||||
.blurslider::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
background: #FF4F4E;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.blurslider::-moz-range-thumb {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
background: #FF4F4E;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #FF4F4E;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #FF4F4E;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=base.css.map */
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 128 KiB After Width: | Height: | Size: 128 KiB |
|
Before Width: | Height: | Size: 280 KiB After Width: | Height: | Size: 280 KiB |
|
Before Width: | Height: | Size: 200 KiB After Width: | Height: | Size: 200 KiB |
|
Before Width: | Height: | Size: 146 KiB After Width: | Height: | Size: 146 KiB |
|
Before Width: | Height: | Size: 230 KiB After Width: | Height: | Size: 230 KiB |
|
Before Width: | Height: | Size: 161 KiB After Width: | Height: | Size: 161 KiB |
|
Before Width: | Height: | Size: 135 KiB After Width: | Height: | Size: 135 KiB |
|
Before Width: | Height: | Size: 174 KiB After Width: | Height: | Size: 174 KiB |
|
Before Width: | Height: | Size: 55 KiB After Width: | Height: | Size: 55 KiB |
|
Before Width: | Height: | Size: 401 KiB After Width: | Height: | Size: 401 KiB |
|
Before Width: | Height: | Size: 737 KiB After Width: | Height: | Size: 737 KiB |
|
Before Width: | Height: | Size: 94 KiB After Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 92 KiB After Width: | Height: | Size: 92 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 390 KiB After Width: | Height: | Size: 390 KiB |
|
Before Width: | Height: | Size: 225 KiB After Width: | Height: | Size: 225 KiB |
|
Before Width: | Height: | Size: 251 KiB After Width: | Height: | Size: 251 KiB |
|
Before Width: | Height: | Size: 300 KiB After Width: | Height: | Size: 300 KiB |
|
Before Width: | Height: | Size: 148 KiB After Width: | Height: | Size: 148 KiB |
|
Before Width: | Height: | Size: 290 KiB After Width: | Height: | Size: 290 KiB |
|
Before Width: | Height: | Size: 324 KiB After Width: | Height: | Size: 324 KiB |
|
Before Width: | Height: | Size: 264 KiB After Width: | Height: | Size: 264 KiB |
|
Before Width: | Height: | Size: 495 KiB After Width: | Height: | Size: 495 KiB |
|
Before Width: | Height: | Size: 322 KiB After Width: | Height: | Size: 322 KiB |
|
Before Width: | Height: | Size: 472 KiB After Width: | Height: | Size: 472 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 746 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
File diff suppressed because one or more lines are too long
|
|
@ -16,7 +16,8 @@
|
|||
█████████████████████████████████████████████████████████████
|
||||
*/
|
||||
|
||||
const func = require('./modules/func.js');
|
||||
const func = require('./modules/func.js');
|
||||
const settings = require('./modules/settings.js');
|
||||
|
||||
const init = () => {
|
||||
// init() gets executed only when the page is fully loaded
|
||||
|
|
@ -24,8 +25,10 @@ const init = () => {
|
|||
func.setRandBg();
|
||||
func.setRandQuote();
|
||||
func.setTime();
|
||||
// set interval to update time every second
|
||||
setInterval(func.setTime, 1000);
|
||||
func.setWithoutSeconds();
|
||||
|
||||
if (!localStorage.getItem('seconds') === 'on') return setInterval(func.setWithoutSeconds, 60000);
|
||||
else return setInterval(func.setTime, 1000);
|
||||
};
|
||||
|
||||
// initialize on page load through a listener
|
||||
|
|
@ -34,6 +37,13 @@ document.addEventListener('DOMContentLoaded', init);
|
|||
// Disable right click
|
||||
document.oncontextmenu = () => { return false; };
|
||||
|
||||
// Update modal
|
||||
const modal = document.getElementById('updateModal');
|
||||
const btn = document.getElementById('openUpdateModal');
|
||||
const span = document.getElementsByClassName('close')[0];
|
||||
btn.onclick = () => { modal.style.display = 'block'; };
|
||||
span.onclick = () => { modal.style.display = 'none'; };
|
||||
window.onclick = (event) => { if (event.target === modal) modal.style.display = 'none'; };
|
||||
|
||||
// Copy quote text
|
||||
/*const copybtn = document.getElementById('copybtn');
|
||||
|
|
@ -43,19 +53,36 @@ copybtn.onclick = () => {
|
|||
document.execCommand('copy');
|
||||
};*/
|
||||
|
||||
// News Modal
|
||||
/*const btn = document.getElementById('openModal');
|
||||
const span = document.getElementsByClassName('close')[0];
|
||||
const modal = document.getElementById('updateModal');
|
||||
function copyQuote() {
|
||||
const quote = document.createRange();
|
||||
quote.selectNode(document.getElementById('quoteText'));
|
||||
window.getSelection().removeAllRanges();
|
||||
window.getSelection().addRange(quote);
|
||||
document.execCommand("copy");
|
||||
window.getSelection().removeAllRanges();
|
||||
}
|
||||
|
||||
btn.onclick = () => { modal.style.display = 'block'; }
|
||||
span.onclick = () => { modal.style.display = 'none'; }
|
||||
window.onclick = (event) => { if (event.target === modal) modal.style.display = 'none'; }*/
|
||||
|
||||
// Settings Modal
|
||||
const modal2 = document.getElementById('settingsModal');
|
||||
const btn2 = document.getElementById('openSettingsModal');
|
||||
const span2 = document.getElementsByClassName('close2')[0];
|
||||
btn2.onclick = () => { modal2.style.display = 'block'; };
|
||||
span2.onclick = () => { modal2.style.display = 'none'; };
|
||||
window.onclick = (event) => { if (event.target === modal2) modal2.style.display = 'none'; };
|
||||
|
||||
// Search bar
|
||||
const search = () => {
|
||||
const services = {
|
||||
duckduckgo: 'https://duckduckgo.com/?q=',
|
||||
google: 'https://google.com/search?q=',
|
||||
bing: 'https://bing.com/search?q=',
|
||||
yahoo: 'https://search.yahoo.com/search?p=',
|
||||
ask: 'https://ask.com/web?q=',
|
||||
ecosia: 'https://ecosia.org/search?q='
|
||||
}
|
||||
const searchvalue = document.getElementById('searchText').value;
|
||||
windows.open(services[localStorage.getItem('engine')] + searchvalue, '_self');
|
||||
return false;
|
||||
}
|
||||
|
||||
var slider = document.getElementById("slider");
|
||||
var output = document.getElementById("blurValue");
|
||||
output.innerHTML = slider.value;
|
||||
|
||||
slider.oninput = function() {
|
||||
output.innerHTML = this.value;
|
||||
};
|
||||
|
|
@ -42,34 +42,40 @@ module.exports = class Func {
|
|||
|
||||
static setRandBg() {
|
||||
document.body.classList.add(util.pickFromArray(bg));
|
||||
/*var getJSON = function(url, callback) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', url, true);
|
||||
xhr.responseType = 'json';
|
||||
xhr.onload = function() {
|
||||
var status = xhr.status;
|
||||
if (status === 200) {
|
||||
callback(null, xhr.response);
|
||||
} else {
|
||||
callback(status, xhr.response);
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
};
|
||||
/*util.getJSON(`https://api.muetab.xyz/getImage?category=Outdoors`,
|
||||
(err, data) => {
|
||||
document.body.style.background = `#f3f3f3 url('${data.file}') !important`;
|
||||
});*/
|
||||
}
|
||||
|
||||
getJSON(`https://mueapi.derpyenterprises.org/getImage?category=Outdoors`,
|
||||
function(err, data) {
|
||||
document.body.style.background = `url('${data.file}') !important`;
|
||||
});*/
|
||||
static setWithoutSeconds() {
|
||||
const dateNoSec = new Date(),
|
||||
time = [
|
||||
util.formatTimeUnit(dateNoSec.getHours()),
|
||||
util.formatTimeUnit(dateNoSec.getMinutes())
|
||||
];
|
||||
document.getElementById('withoutSeconds').innerHTML = time.join(':');
|
||||
}
|
||||
|
||||
static setRandQuote() {
|
||||
const id = util.getRandIndex(quotes.authors);
|
||||
if (util.contains.call(codes.itcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.it[id]}"`; // Italian
|
||||
if (util.contains.call(codes.ptcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.pt[id]}"` || `"${quotes.eng[id]}"`; // Portuguese
|
||||
if (util.contains.call(codes.spcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.sp[id]}"`; // Spanish
|
||||
else document.querySelector('blockquote').innerHTML = `"${quotes.eng[id]}"`; // English
|
||||
document.querySelector('cite').innerHTML = quotes.authors[id];
|
||||
/*util.getJSON(`https://api.muetab.xyz/getQuote`,
|
||||
(err, data) => {
|
||||
if (err) {
|
||||
if (util.contains.call(codes.itcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.it[id]}"`; // Italian
|
||||
if (util.contains.call(codes.ptcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.pt[id]}"` || `"${quotes.eng[id]}"`; // Portuguese
|
||||
if (util.contains.call(codes.spcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.sp[id]}"`; // Spanish
|
||||
else document.querySelector('blockquote').innerHTML = `"${quotes.eng[id]}"`; // English
|
||||
document.querySelector('cite').innerHTML = quotes.authors[id];
|
||||
}
|
||||
document.querySelector('blockquote').innerHTML = `"${data.quote}"`;
|
||||
document.querySelector('cite').innerHTML = data.author;
|
||||
});*/
|
||||
if (util.contains.call(codes.itcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.it[id]}"`; // Italian
|
||||
if (util.contains.call(codes.ptcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.pt[id]}"` || `"${quotes.eng[id]}"`; // Portuguese
|
||||
if (util.contains.call(codes.spcodes, nal)) document.querySelector('blockquote').innerHTML = `"${quotes.sp[id]}"`; // Spanish
|
||||
else document.querySelector('blockquote').innerHTML = `"${quotes.eng[id]}"`; // English
|
||||
document.querySelector('cite').innerHTML = quotes.authors[id];
|
||||
}
|
||||
|
||||
static setTime() {
|
||||
|
|
@ -81,6 +87,6 @@ function(err, data) {
|
|||
];
|
||||
// Joins all of the array elements into a string using the ':' separator
|
||||
// Example: [16, 32, 03] -> "16:32:03"
|
||||
document.querySelector('time').innerHTML = time.join(':');
|
||||
document.getElementById('withSeconds').innerHTML = time.join(':');
|
||||
}
|
||||
};
|
||||
};
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
// Settings Modal
|
||||
const modal2 = document.getElementById('settingsModal');
|
||||
const btn2 = document.getElementById('openSettingsModal');
|
||||
const span2 = document.getElementsByClassName('close2')[0];
|
||||
btn2.onclick = () => { modal2.style.display = 'block'; };
|
||||
span2.onclick = () => { modal2.style.display = 'none'; };
|
||||
window.onclick = (event) => { if (event.target === modal2) modal2.style.display = 'none'; };
|
||||
|
||||
// Change theme code
|
||||
const changeCSS = (cssFile, cssLinkIndex) => {
|
||||
let oldlink = document.getElementsByTagName('link').item(cssLinkIndex);
|
||||
let newlink = document.createElement('link');
|
||||
|
||||
newlink.setAttribute('rel', 'stylesheet');
|
||||
newlink.setAttribute('type', 'text/css');
|
||||
newlink.setAttribute('href', cssFile);
|
||||
|
||||
document.getElementsByTagName('head').item(0).replaceChild(newlink, oldlink);
|
||||
};
|
||||
|
||||
// Load settings
|
||||
changeCSS(`./assets/css/${localStorage.getItem('theme')}.css`);
|
||||
if (localStorage.getItem('quotes') === 'off') document.getElementById('quoteText').style.display = 'none', document.getElementById("quoteCheck").checked = true;
|
||||
if (localStorage.getItem('greeting') === 'off') document.getElementById('greetingText').style.display = 'none', document.getElementById("greetingCheck").checked = true;
|
||||
if (localStorage.getItem('searchbar') === 'off') document.getElementById('searchBar').style.display = 'none', document.getElementById("searchBarCheck").checked = true;
|
||||
if (localStorage.getItem('seconds') === 'off') {
|
||||
document.getElementById('withSeconds').style.display = 'block';
|
||||
document.getElementById('withoutSeconds').style.display = 'none';
|
||||
}
|
||||
if (localStorage.getItem('seconds') === 'on') {
|
||||
document.getElementById('withSeconds').style.display = 'none';
|
||||
document.getElementById('withoutSeconds').style.display = 'block';
|
||||
document.getElementById("secondsCheck").checked = true;
|
||||
}
|
||||
if (localStorage.getItem('theme') === 'light') {
|
||||
document.getElementById("check").checked = true;
|
||||
}
|
||||
|
||||
// Settings functions
|
||||
|
||||
// Theme Option
|
||||
const changeTheme = () => {
|
||||
if (document.getElementById('check').checked === true) {
|
||||
changeCSS('./assets/css/light.css');
|
||||
localStorage.setItem('theme', 'light');
|
||||
} else {
|
||||
changeCSS('./assets/css/dark.css');
|
||||
localStorage.setItem('theme', 'dark');
|
||||
}
|
||||
}
|
||||
|
||||
window.changeTheme = changeTheme;
|
||||
|
||||
// Quotes Option
|
||||
const hideQuotes = () => {
|
||||
let quoteText = document.getElementById('quoteText');
|
||||
|
||||
if (document.getElementById('quoteCheck').checked === true) {
|
||||
quoteText.style.display = 'none';
|
||||
localStorage.setItem('quotes', 'off');
|
||||
}
|
||||
else {
|
||||
quoteText.style.display = 'block';
|
||||
localStorage.setItem('quotes', 'on');
|
||||
}
|
||||
}
|
||||
|
||||
window.hideQuotes = hideQuotes;
|
||||
|
||||
// Greeting Option
|
||||
const hideGreeting = () => {
|
||||
let greetingText = document.getElementById('greetingText');
|
||||
|
||||
if (document.getElementById('greetingCheck').checked === true) {
|
||||
greetingText.style.display = 'none';
|
||||
localStorage.setItem('greeting', 'off');
|
||||
}
|
||||
else {
|
||||
greetingText.style.display = 'block';
|
||||
localStorage.setItem('greeting', 'on');
|
||||
}
|
||||
}
|
||||
|
||||
window.hideGreeting = hideGreeting;
|
||||
|
||||
// Seconds Option
|
||||
const hideSeconds = () => {
|
||||
let withSecondsText = document.getElementById('withSeconds');
|
||||
let withoutSecondsText = document.getElementById('withoutSeconds');
|
||||
|
||||
if (document.getElementById('secondsCheck').checked === false) {
|
||||
withoutSecondsText.style.display = 'none';
|
||||
withSecondsText.style.display = 'block';
|
||||
localStorage.setItem('seconds', 'off');
|
||||
} if (document.getElementById('secondsCheck').checked === true) {
|
||||
withoutSecondsText.style.display = 'block';
|
||||
withSecondsText.style.display = 'none';
|
||||
localStorage.setItem('seconds', 'on');
|
||||
}
|
||||
else console.log();
|
||||
}
|
||||
|
||||
window.hideSeconds = hideSeconds;
|
||||
|
||||
// Search Bar Option
|
||||
const hideSearchBar = () => {
|
||||
let searchBar = document.getElementById('searchBar');
|
||||
|
||||
if (document.getElementById('searchBarCheck').checked === true) {
|
||||
searchBar.style.display = 'none';
|
||||
localStorage.setItem('searchbar', 'off');
|
||||
}
|
||||
else {
|
||||
searchBar.style.display = 'block';
|
||||
localStorage.setItem('searchbar', 'on');
|
||||
}
|
||||
}
|
||||
window.hideSearchBar = hideSearchBar;
|
||||
|
||||
// Set Engine
|
||||
const setSearchEngine = (engine) => { localStorage.setItem('engine', engine); };
|
||||
|
||||
window.setSearchEngine = setSearchEngine;
|
||||
|
|
@ -52,4 +52,16 @@ module.exports = class Util {
|
|||
}
|
||||
return indexOf.call(this, needle) > -1;
|
||||
}
|
||||
|
||||
static getJSON(url, callback) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', url, true);
|
||||
xhr.responseType = 'json';
|
||||
xhr.onload = () => {
|
||||
var status = xhr.status;
|
||||
if (status === 200) callback(null, xhr.response);
|
||||
else callback(status, xhr.response);
|
||||
};
|
||||
xhr.send();
|
||||
};
|
||||
};
|
||||
BIN
assets/kofi.png
BIN
assets/kofi.png
Binary file not shown.
|
Before Width: | Height: | Size: 4.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 925 B |
Binary file not shown.
|
Before Width: | Height: | Size: 351 KiB |
|
|
@ -17,7 +17,10 @@
|
|||
*/
|
||||
|
||||
@import 'modules/bg';
|
||||
@import 'modules/font';
|
||||
@import 'modules/misc';
|
||||
@import 'modules/quote';
|
||||
@import 'modules/time-greeting';
|
||||
@import 'modules/settings';
|
||||
@import 'modules/search';
|
||||
@import 'modules/buttons';
|
||||
@import 'modules/settings-modal';
|
||||
@import 'modules/time-greeting';
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
button.settings,
|
||||
button.news {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
padding: 20px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
display: table-cell
|
||||
}
|
||||
|
||||
.buttons {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
i.material-icons {
|
||||
text-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
button.news {
|
||||
position: absolute;
|
||||
right: 60px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
button.copyButton {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
padding: 20px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
display: table-cell
|
||||
}
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
/*
|
||||
█████████████████████████████████████████████████████████████
|
||||
██ ██
|
||||
██ ███ ███ ██ ██ ███████ ██
|
||||
██ ████ ████ ██ ██ ██ ██
|
||||
██ ██ ████ ██ ██ ██ █████ ██
|
||||
██ ██ ██ ██ ██ ██ ██ ██
|
||||
██ ██ ██ ██████ ███████ ██
|
||||
██ ██
|
||||
██ ██
|
||||
██ Copyright 2018-2019 David Ralph (ohlookitsderpy) ██
|
||||
██ Licensed under MIT ██
|
||||
██ GitHub: https://github.com/ohlookitsderpy/Mue ██
|
||||
██ ██
|
||||
██ Special thanks to contributors! <3 ██
|
||||
█████████████████████████████████████████████████████████████
|
||||
*/
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("../font/MaterialIcons-Regular.woff2") format("woff2")
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-moz-font-feature-settings: "liga";
|
||||
font-feature-settings: "liga";
|
||||
-moz-osx-font-smoothing: grayscale
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Open Sans";
|
||||
src: url("../font/opensans-regular-webfont.woff2") format("woff2"),
|
||||
url("../font/opensans-regular-webfont.woff") format("woff");
|
||||
src: url("../font/roboto-v18-latin-regular.woff2") format("woff2"),
|
||||
}
|
||||
|
||||
i.material-icons {
|
||||
font-size: 30px;
|
||||
display: inline;
|
||||
color: #fff
|
||||
}
|
||||
|
|
@ -13,7 +13,7 @@ body {
|
|||
background-position: 50%;
|
||||
background-color: black; /* Prevent white flash on page load */
|
||||
|
||||
font-family: 'Roboto';
|
||||
font-family: 'Open Sans';
|
||||
color: white;
|
||||
|
||||
overflow: hidden;
|
||||
|
|
@ -22,15 +22,6 @@ body {
|
|||
user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
|
||||
}
|
||||
|
||||
/* Font */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Roboto'), local('Roboto-Regular'),
|
||||
url('../font/roboto-v18-latin-regular.woff2') format('woff2');
|
||||
}
|
||||
|
||||
/* Shadow */
|
||||
:root {
|
||||
--shadow-color: #111111CC;
|
||||
|
|
@ -39,5 +30,12 @@ body {
|
|||
.greeting,
|
||||
time,
|
||||
.quote {
|
||||
position: absolute;
|
||||
filter: drop-shadow(var(--shadow-shift) var(--shadow-shift) 0 var(--shadow-color));
|
||||
}
|
||||
|
||||
/* Selection */
|
||||
::selection {
|
||||
background: #FF4F4E;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -17,6 +17,8 @@
|
|||
*/
|
||||
|
||||
.quote {
|
||||
padding-top: 15em;
|
||||
|
||||
--shadow-shift: 0.125rem;
|
||||
|
||||
width: 37.5%;
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
/*
|
||||
█████████████████████████████████████████████████████████████
|
||||
██ ██
|
||||
██ ███ ███ ██ ██ ███████ ██
|
||||
██ ████ ████ ██ ██ ██ ██
|
||||
██ ██ ████ ██ ██ ██ █████ ██
|
||||
██ ██ ██ ██ ██ ██ ██ ██
|
||||
██ ██ ██ ██████ ███████ ██
|
||||
██ ██
|
||||
██ ██
|
||||
██ Copyright 2018-2019 David Ralph (ohlookitsderpy) ██
|
||||
██ Licensed under MIT ██
|
||||
██ GitHub: https://github.com/ohlookitsderpy/Mue ██
|
||||
██ ██
|
||||
██ Special thanks to contributors! <3 ██
|
||||
█████████████████████████████████████████████████████████████
|
||||
*/
|
||||
|
||||
.search-bar {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 20px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
button {
|
||||
font-size: 1px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
background: none;
|
||||
--shadow-shift: 0.4rem;
|
||||
i.material-icons {
|
||||
text-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
display: inline;
|
||||
}
|
||||
input[type=text] {
|
||||
padding: 10px;
|
||||
font-size: 15px;
|
||||
border: 5px;
|
||||
opacity: 0.5;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
margin-left: 5px;
|
||||
letter-spacing: 1px;
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
.input.searchText {
|
||||
flex-grow: 2;
|
||||
border: none;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.searchbarform {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
|
@ -0,0 +1,182 @@
|
|||
button.settings {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 20px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
i.material-icons {
|
||||
font-size: 30px;
|
||||
display: inline;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
li.items {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.modal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 34px;
|
||||
|
||||
input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
|
||||
:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
left: 4px;
|
||||
bottom: 4px;
|
||||
background-color: white;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
}
|
||||
|
||||
input:checked+.slider {
|
||||
background-color: #FF4F4E;
|
||||
}
|
||||
|
||||
input:focus+.slider {
|
||||
box-shadow: 0 0 1px #FF4F4E;
|
||||
}
|
||||
|
||||
input:checked+.slider:before {
|
||||
-webkit-transform: translateX(26px);
|
||||
-ms-transform: translateX(26px);
|
||||
transform: translateX(26px);
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #ccc;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
border-radius: 34px;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
left: 4px;
|
||||
bottom: 4px;
|
||||
background-color: white;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.blurslider {
|
||||
margin-top: 7px;
|
||||
-webkit-appearance: none;
|
||||
width: 200px;
|
||||
height: 15px;
|
||||
border-radius: 5px;
|
||||
background: #d3d3d3;
|
||||
outline: none;
|
||||
float: right;
|
||||
|
||||
::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
background: #FF4F4E;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::-moz-range-thumb {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
background: #FF4F4E;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: block;
|
||||
float: right;
|
||||
padding: 10px;
|
||||
border: none;
|
||||
background: #ecf0f1;
|
||||
}
|
||||
|
||||
label.switch,
|
||||
p.switch {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
label.switch {
|
||||
float: right;
|
||||
}
|
||||
|
||||
li.items {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding-top: 30px
|
||||
}
|
||||
|
||||
.modal {
|
||||
display: none
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
max-height: 500px;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
|
@ -19,13 +19,25 @@
|
|||
/* Greeting */
|
||||
|
||||
.greeting {
|
||||
--shadow-shift: 0.2rem;
|
||||
text-shadow: 0 0 25px rgba(0,0,0,0.3);
|
||||
font-size: 3.25rem;
|
||||
padding-bottom: 10em;
|
||||
font-weight: bold;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
/* Time */
|
||||
|
||||
time {
|
||||
--shadow-shift: 0.4rem;
|
||||
text-shadow: 0 0 25px rgba(0,0,0,0.3);
|
||||
font-size: 12rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#withSeconds, #withoutSeconds, #greetingText {
|
||||
-khtml-user-select: none; /* Konqueror HTML */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* Internet Explorer/Edge */
|
||||
user-select: none; /* Non-prefixed version, currently
|
||||
supported by Chrome and Opera */
|
||||
}
|
||||
|
|
@ -0,0 +1,124 @@
|
|||
a {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.modal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
padding-top: 100px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background-color: rgb(0, 0, 0);
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: #2d3436;
|
||||
margin: auto;
|
||||
padding: 30px;
|
||||
width: 450px;
|
||||
max-height: 600px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.title,
|
||||
.close,
|
||||
.settingsTitle,
|
||||
.close2 {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #ffffff;
|
||||
float: left;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.settingsTitle {
|
||||
color: #ffffff;
|
||||
float: left;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p.subtitle {
|
||||
color: #ffffff;
|
||||
float: left;
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: #ffffff;
|
||||
float: right;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
label.switch,
|
||||
p.switch {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
label.switch {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.close:hover,
|
||||
.close:focus {
|
||||
color: #bdc3c7;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.close2 {
|
||||
color: #ffffff;
|
||||
float: right;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.close2:hover,
|
||||
.close2:focus {
|
||||
color: #bdc3c7;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #2d3436;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #34495e;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #2c3e50;
|
||||
}
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
<!--
|
||||
█████████████████████████████████████████████████████████████
|
||||
██ ██
|
||||
██ ███ ███ ██ ██ ███████ ██
|
||||
██ ████ ████ ██ ██ ██ ██
|
||||
██ ██ ████ ██ ██ ██ █████ ██
|
||||
██ ██ ██ ██ ██ ██ ██ ██
|
||||
██ ██ ██ ██████ ███████ ██
|
||||
██ ██
|
||||
██ ██
|
||||
██ Copyright 2018-2019 David Ralph (ohlookitsderpy) ██
|
||||
██ Licensed under MIT ██
|
||||
██ GitHub: https://github.com/ohlookitsderpy/Mue ██
|
||||
██ ██
|
||||
██ Special thanks to contributors! <3 ██
|
||||
█████████████████████████████████████████████████████████████
|
||||
-->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
|
||||
<title>New Tab</title>
|
||||
|
||||
<link href='./assets/css/light.css' rel='stylesheet'>
|
||||
<link href='./assets/css/base.css' rel='stylesheet'>
|
||||
<link href='./assets/css/animate.css' rel='stylesheet'>
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
|
||||
|
||||
</head>
|
||||
|
||||
<body id="body">
|
||||
<div id='greetingText' class='greeting animate'></div>
|
||||
|
||||
<time id='withSeconds' class='animate'></time>
|
||||
<time id='withoutSeconds'class='animate'></time>
|
||||
|
||||
<div id='quoteText' class='quote animate'>
|
||||
|
||||
<blockquote></blockquote>
|
||||
|
||||
<cite></cite>
|
||||
<button class='copyButton' onclick="copyQuote()" type='submit'><i class="material-icons">link</i></button>
|
||||
|
||||
</div>
|
||||
<div id='updateModal' class='modal animate'>
|
||||
|
||||
<div class='modal-content'>
|
||||
<span class='close'>×</span>
|
||||
<span id='title' class='title'>UPDATE - SETTINGS + MORE</span>
|
||||
<br>
|
||||
<br>
|
||||
<p class='subtitle'>BY TEAM MUE • 05/07/2019</p>
|
||||
<img src="assets/img/updatenewlogo.png">
|
||||
<p class='subtitle'>New Mue Logo</p>
|
||||
<br>
|
||||
<br>
|
||||
<h2>First Major Update! (Settings, search and more)</h2>
|
||||
<p><b>The Mue feature update is finally here</b> - in this update we have added a lot of features such as settings, search bar, and customization, the latter of which was requested by many users. <br> In the settings, you can now disable or enable features such as the seconds appearing or the custom quotes. To do this just go to the top right of the page and there's a settings icon when you click that will be a popup modal which you can view the settings on. <br> Below is a screenshot of the settings!</p>
|
||||
<img src="assets/img/muesettings.png">
|
||||
<p class='subtitle'>Picture of settings</p>
|
||||
<br>
|
||||
<br>
|
||||
<p>The next new feature is the search bar; like the name suggests, you can search things using the search bar; currently there is only duckduckgo but soon we'll be adding inferior search engines such as Google, Bing, Yahoo and even Ask Jeeves which no one uses in 2019. <br>Another new feature, now using our brand new API which is on the new <a href="https://muetab.xyz">website</a> at muetab.xyz is the renewed random quotes - you can now get a random quote from the API where if you have an internet connection you will be able to see around the quote every time you refresh the page and will be updated on the clouds even if you never update extension which you should by the way you still get all the brand new quotes.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id='settingsModal' class='modal animate'>
|
||||
|
||||
<div class='modal-content'>
|
||||
<span class='close2'>×</span>
|
||||
<span class='settingsTitle'>SETTINGS</span>
|
||||
<br>
|
||||
<br>
|
||||
<li class='items'>
|
||||
<p class='switch'>Theme Switch</p>
|
||||
<label class='switch'>
|
||||
<input id='check' type='checkbox' onclick='window.changeTheme()'>
|
||||
<span class='slider round'></span>
|
||||
</label>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Hide Search Bar</p>
|
||||
<label class='switch'>
|
||||
<input id='searchBarCheck' type='checkbox' onclick='hideSearchBar()'>
|
||||
<span class='slider round'></span>
|
||||
</label>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Hide Quotes</p>
|
||||
<label class='switch'>
|
||||
<input id='quoteCheck' type='checkbox' onclick='hideQuotes()' >
|
||||
<span class='slider round'></span>
|
||||
</label>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Hide Greeting</p>
|
||||
<label class='switch'>
|
||||
<input id='greetingCheck' type='checkbox' onclick='hideGreeting()'>
|
||||
<span class='slider round'></span>
|
||||
</label>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Hide Seconds</p>
|
||||
<label class='switch'>
|
||||
<input id='secondsCheck' type='checkbox' onclick='hideSeconds()'>
|
||||
<span class='slider round'></span>
|
||||
</label>
|
||||
</li>
|
||||
<!--
|
||||
<li class='items'>
|
||||
<div class="sliderContainer">
|
||||
<p class='switch'>Background Blur</p>
|
||||
<input type='range' min='0' max='100' value='0' class="blurslider" id='slider'>
|
||||
<p class='switch'><span id="blurValue"></span>×</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Search Engine</p>
|
||||
<select class="dropdown" id ="searchdropdown">
|
||||
<option value="volvo">DuckDuckGo</option>
|
||||
<option value="saab">Google</option>
|
||||
<option value="mercedes">Ask</option>
|
||||
<option value="audi">Ecosia</option>
|
||||
</select>
|
||||
</li>
|
||||
<li class='items'>
|
||||
<p class='switch'>Font</p>
|
||||
<select class="dropdown" id="font_dropdown">
|
||||
<option value="opensans" onclick="setFontOP()">Open Sans</option>
|
||||
<option value="roboto" onclick="setFontROB()">Roboto</option>
|
||||
</select>
|
||||
</li>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
<div class='buttons'>
|
||||
<button class='settings' id='openSettingsModal'><i class='material-icons'>settings</i></button>
|
||||
<button class='news' id='openUpdateModal' onclick="setFontROB()"><i class='material-icons'>new_releases</i></button>
|
||||
</div>
|
||||
<div id='searchBar' class='search-bar'>
|
||||
<form id='searchBar' class="searchbarform" action='https://google.com' onsubmit='search()'>
|
||||
<input type='text' placeholder='SEARCH' style='color: #000000;' name='q' id='searchText' class='searchText' />
|
||||
<button class='searchbutton' type='submit'><i class='material-icons'>search</i></button>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
function copyQuote() {
|
||||
const quote = document.createRange();
|
||||
quote.selectNode(document.getElementById('quoteText'));
|
||||
window.getSelection().removeAllRanges();
|
||||
window.getSelection().addRange(quote);
|
||||
document.execCommand("copy");
|
||||
window.getSelection().removeAllRanges();
|
||||
}
|
||||
</script>
|
||||
<script src='./assets/js/base.js'></script>
|
||||
</html>
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
{
|
||||
"manifest_version": 2,
|
||||
"offline_enabled": true,
|
||||
"name": "Mue",
|
||||
"version": "0.1",
|
||||
"browser_action": {
|
||||
17
package.json
17
package.json
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"name": "mue",
|
||||
"description": "Fast, open and free-to-use new tab page for most modern browsers",
|
||||
"author": "ohlookitsderpy",
|
||||
"license": "MIT",
|
||||
"repository": "https://github.com/ohlookitsderpy/Mue",
|
||||
"scripts": {
|
||||
"sass-watch": "sass --watch src/assets/scss:src/assets/css --style compressed",
|
||||
"js-watch": "webpack --progress --watch"
|
||||
},
|
||||
"devDependencies": {
|
||||
"eslint": "6.0.0",
|
||||
"sass": "1.21.0",
|
||||
"webpack": "4.35.0",
|
||||
"webpack-cli": "3.3.4"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"extends": [
|
||||
"config:base"
|
||||
]
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
.mountain{background-image:url("../img/1.jpeg")}.sunrise{background-image:url("../img/2.jpeg")}.butterfly{background-image:url("../img/3.jpeg")}.leaves{background-image:url("../img/4.jpeg")}.river{background-image:url("../img/5.jpeg")}.sea{background-image:url("../img/6.jpeg")}.space{background-image:url("../img/7.jpeg")}.ice{background-image:url("../img/8.jpeg")}.waterfall{background-image:url("../img/9.jpeg")}.lake{background-image:url("../img/10.jpeg")}.sunset{background-image:url("../img/11.jpeg")}.desert{background-image:url("../img/12.jpeg")}.canyon{background-image:url("../img/13.jpeg")}.rose{background-image:url("../img/14.jpeg")}.forest{background-image:url("../img/15.jpeg")}.cherry{background-image:url("../img/16.jpeg")}.clouds{background-image:url("../img/17.jpeg")}.winter{background-image:url("../img/18.jpeg")}.autumn{background-image:url("../img/19.jpeg")}.flowers{background-image:url("../img/20.jpeg")}.sunrise{background-image:url("../img/21.jpeg")}.rocks{background-image:url("../img/22.jpeg")}.trees{background-image:url("../img/23.jpeg")}.mountains{background-image:url("../img/24.jpeg")}.beach{background-image:url("../img/25.jpeg")}html,body{height:100%}body{display:flex;flex-direction:column;justify-content:space-around;align-items:center;margin:0;background-size:cover;background-position:50%;background-color:#000;font-family:"Roboto";color:#fff;overflow:hidden;-moz-user-select:none;user-select:none}@font-face{font-family:"Roboto";font-style:normal;font-weight:400;src:local("Roboto"),local("Roboto-Regular"),url("../font/roboto-v18-latin-regular.woff2") format("woff2")}:root{--shadow-color: #111111CC}.greeting,time,.quote{filter:drop-shadow(var(--shadow-shift) var(--shadow-shift) 0 var(--shadow-color))}.quote{--shadow-shift: 0.125rem;width:37.5%;max-width:37.5rem;font-size:1.5rem;text-align:center}.quote blockquote{margin:0 0 .25rem 0;line-height:1.125}.quote blockquote ::before{content:"“";margin-right:.25ch}.quote blockquote ::after{content:"”";margin-left:.25ch}.quote cite{font-size:83.33%}.greeting{--shadow-shift: 0.2rem;font-size:3.25rem}time{--shadow-shift: 0.4rem;font-size:12rem}button.settings{background:transparent;border:none;color:#fff;padding:20px 20px;text-align:center;text-decoration:none;font-size:20px;cursor:pointer;border-radius:5px;display:table-cell}.buttons{position:absolute;right:10px;top:10px}i.material-icons{font-size:30px;display:inline;color:#fff}li.items{list-style:none;margin:0;padding-top:30px}/*# sourceMappingURL=base.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../scss/modules/_bg.scss","../scss/modules/_misc.scss","../scss/modules/_quote.scss","../scss/modules/_time-greeting.scss","../scss/modules/_settings.scss"],"names":[],"mappings":"CAkBA,gDACA,+CACA,iDACA,8CACA,6CACA,2CACA,6CACA,2CACA,iDACA,6CACA,+CACA,+CACA,+CACA,6CACA,+CACA,+CACA,+CACA,+CACA,+CACA,gDACA,gDACA,8CACA,8CACA,kDACA,8CCzCA,sBACA,KAEC,aACA,sBACA,6BACA,mBAEA,SAEA,sBACA,wBACA,sBAEA,qBACA,WAEA,gBAEG,sBACH,iBAID,WACC,qBACA,kBACA,gBACA,0GAKD,MACC,0BAGD,sBAGC,kFCvBD,OACI,yBAEA,YACA,kBAEA,iBACA,kBAEA,kBACI,oBACA,kBAEA,2BACI,YACA,mBAGJ,0BACI,YACA,kBAIR,YACI,iBCvBR,UACC,uBACA,kBAKD,KACC,uBACA,gBC7BD,gBACI,uBACA,YACA,WACA,kBACA,kBACA,qBACA,eACA,eACA,kBACA,mBAGJ,SACI,kBACA,WACA,SAGJ,iBACI,eACA,eACA,WAGJ,SACI,gBACA,SACA","file":"base.css"}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,54 +0,0 @@
|
|||
|
||||
const changeCSS = (cssFile, cssLinkIndex) => {
|
||||
let oldlink = document.getElementsByTagName('link').item(cssLinkIndex);
|
||||
let newlink = document.createElement('link');
|
||||
|
||||
newlink.setAttribute('rel', 'stylesheet');
|
||||
newlink.setAttribute('type', 'text/css');
|
||||
newlink.setAttribute('href', cssFile);
|
||||
|
||||
document.getElementsByTagName('head').item(0).replaceChild(newlink, oldlink);
|
||||
};
|
||||
|
||||
changeCSS(`./assets/css/${localStorage.getItem('theme')}.css`);
|
||||
|
||||
const changeTheme = () => {
|
||||
let themeBox = document.getElementById('check');
|
||||
if (themeBox.checked === true) {
|
||||
changeCSS('./assets/css/light.css');
|
||||
localStorage.setItem('theme', 'light');
|
||||
} else {
|
||||
changeCSS('./assets/css/dark.css');
|
||||
localStorage.setItem('theme', 'dark');
|
||||
}
|
||||
}
|
||||
|
||||
const hideQuotes = () => {
|
||||
let quoteBox = document.getElementById('quoteCheck');
|
||||
let quoteText = document.getElementById('quoteText');
|
||||
|
||||
if (quoteBox.checked === true) quoteText.style.display = 'none';
|
||||
else quoteText.style.display = 'block';
|
||||
}
|
||||
|
||||
const hideGreeting = () => {
|
||||
let greetingBox = document.getElementById('greetingCheck');
|
||||
let greetingText = document.getElementById('greetingText');
|
||||
|
||||
if (greetingBox.checked === true) greetingText.style.display = 'none';
|
||||
else greetingText.style.display = 'block';
|
||||
}
|
||||
|
||||
const hideSeconds = () => {
|
||||
let secondsBox = document.getElementById('secondsCheck');
|
||||
let withSecondsText = document.getElementById('withSeconds');
|
||||
let withoutSecondsText = document.getElementById('withoutSeconds');
|
||||
|
||||
if (secondsBox.checked === true) {
|
||||
withoutSecondsText.style.display = 'block';
|
||||
withSeconds.style.display = 'none';
|
||||
} else {
|
||||
withSeconds.style.display = 'block';
|
||||
withoutSecondsText.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
button.settings {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 20px 20px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
}
|
||||
|
||||
i.material-icons {
|
||||
font-size: 30px;
|
||||
display: inline;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
li.items {
|
||||
list-style: none;
|
||||
margin: 0 ;
|
||||
padding-top: 30px;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue