Initial Commit
This commit is contained in:
parent
25791e7c89
commit
9aa9907bb7
|
@ -0,0 +1 @@
|
|||
.DS_Store
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Startpage Title</title>
|
||||
<link rel="stylesheet" type="text/css" href="src/style/main.css">
|
||||
<script src="https://kit.fontawesome.com/a81a0c775a.js" crossorigin="anonymous"></script>
|
||||
<!-- Background randomizer -->
|
||||
<script defer src="src/script/randbg.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="head">
|
||||
<!-- Above-Search Logo -->
|
||||
<div class="logo"><img src="src/icons/fox.svg" /></div>
|
||||
<div class="search_box">
|
||||
<!-- Google Search -->
|
||||
<div id="gSearch" style="display:block;">
|
||||
<form id="textField" class="google" action="https://google.com/search" method="get">
|
||||
<input class="input_box" type="text" name="q" placeholder="Search" autofocus>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bookmark">
|
||||
<div class="category">
|
||||
<p class="title">Category One</p>
|
||||
<div class="bookmarks">
|
||||
<li><a class="bm" href="https://google.com">Google</a></li>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category">
|
||||
<p class="title">Category Two</p>
|
||||
<li><a class="bm" href="https://steampowered.com">Steam</a></li>
|
||||
<div class="bookmarks">
|
||||
</div>
|
||||
</div>
|
||||
<div class="category">
|
||||
<p class="title">Category Three</p>
|
||||
<div class="bookmarks">
|
||||
<li><a class="bm" href="https://mail.google.com">GMail</a></li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Binary file not shown.
After Width: | Height: | Size: 1.5 MiB |
|
@ -0,0 +1,3 @@
|
|||
[
|
||||
"src/backgrounds/bg1.jpg"
|
||||
]
|
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.
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.
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.
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 14 KiB |
|
@ -0,0 +1,100 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
inkscape:version="1.0 (4035a4fb49, 2020-05-01)"
|
||||
sodipodi:docname="google.svg"
|
||||
id="svg16"
|
||||
version="1.1"
|
||||
height="52"
|
||||
width="52"
|
||||
viewBox="0 0 5.2 5.2">
|
||||
<metadata
|
||||
id="metadata22">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<defs
|
||||
id="defs20">
|
||||
<inkscape:path-effect
|
||||
only_selected="false"
|
||||
apply_with_weight="true"
|
||||
apply_no_weight="true"
|
||||
helper_size="0"
|
||||
steps="2"
|
||||
weight="33.333333"
|
||||
lpeversion="1"
|
||||
is_visible="true"
|
||||
id="path-effect1925"
|
||||
effect="bspline" />
|
||||
<inkscape:path-effect
|
||||
only_selected="false"
|
||||
apply_with_weight="true"
|
||||
apply_no_weight="true"
|
||||
helper_size="0"
|
||||
steps="2"
|
||||
weight="33.333333"
|
||||
lpeversion="1"
|
||||
is_visible="true"
|
||||
id="path-effect885"
|
||||
effect="bspline" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
inkscape:current-layer="svg16"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-x="0"
|
||||
inkscape:cy="24.110555"
|
||||
inkscape:cx="46.005708"
|
||||
inkscape:zoom="7.989887"
|
||||
showgrid="false"
|
||||
id="namedview18"
|
||||
inkscape:window-height="704"
|
||||
inkscape:window-width="1366"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0"
|
||||
guidetolerance="10"
|
||||
gridtolerance="10"
|
||||
objecttolerance="10"
|
||||
borderopacity="1"
|
||||
bordercolor="#666666"
|
||||
pagecolor="#232929"
|
||||
inkscape:document-rotation="0" />
|
||||
<g
|
||||
transform="matrix(0.92846546,0,0,0.92479909,0.17492131,0.19753118)"
|
||||
style="stroke:#6c8dac;stroke-width:0.48541465;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="g1929">
|
||||
<path
|
||||
style="fill:#ff8080;fill-opacity:0;stroke:#6c8dac;stroke-width:0.48541465;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke markers fill"
|
||||
id="path1911"
|
||||
sodipodi:type="arc"
|
||||
sodipodi:cx="2.4996181"
|
||||
sodipodi:cy="2.6108518"
|
||||
sodipodi:rx="2.1740921"
|
||||
sodipodi:ry="2.1773813"
|
||||
sodipodi:start="6.2744429"
|
||||
sodipodi:end="5.33678"
|
||||
sodipodi:open="true"
|
||||
sodipodi:arc-type="arc"
|
||||
d="M 4.673627,2.5918165 A 2.1740921,2.1773813 0 0 1 3.0230721,4.7241798 2.1740921,2.1773813 0 0 1 0.56877939,3.6116325 2.1740921,2.1773813 0 0 1 1.0791939,0.96243588 2.1740921,2.1773813 0 0 1 3.7705995,0.84430035" />
|
||||
<path
|
||||
style="fill:none;stroke:#6c8dac;stroke-width:0.48541465;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 2.5940139,2.6155787 c 0,0 2.0796131,-0.023762 2.0796131,-0.023762"
|
||||
id="path1923"
|
||||
inkscape:path-effect="#path-effect1925"
|
||||
inkscape:original-d="M 2.5940139,2.6155787 4.673627,2.5918165"
|
||||
sodipodi:nodetypes="cc" />
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 3.4 KiB |
|
@ -0,0 +1,89 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
inkscape:version="1.0 (4035a4fb49, 2020-05-01)"
|
||||
sodipodi:docname="search.svg"
|
||||
id="svg12"
|
||||
version="1.1"
|
||||
class="feather feather-crosshair"
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
stroke="#1789D0"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
height="48"
|
||||
width="48">
|
||||
<metadata
|
||||
id="metadata18">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<defs
|
||||
id="defs16" />
|
||||
<sodipodi:namedview
|
||||
inkscape:current-layer="svg12"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:window-y="112"
|
||||
inkscape:window-x="317"
|
||||
inkscape:cy="24"
|
||||
inkscape:cx="24"
|
||||
inkscape:zoom="5.6041667"
|
||||
showgrid="false"
|
||||
id="namedview14"
|
||||
inkscape:window-height="480"
|
||||
inkscape:window-width="733"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0"
|
||||
guidetolerance="10"
|
||||
gridtolerance="10"
|
||||
objecttolerance="10"
|
||||
borderopacity="1"
|
||||
bordercolor="#666666"
|
||||
pagecolor="#ffffff" />
|
||||
<g
|
||||
transform="matrix(1.0346466,0,0,1.0346466,-0.79687178,-0.0346466)"
|
||||
id="g25">
|
||||
<circle
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
id="circle2" />
|
||||
<line
|
||||
x1="22"
|
||||
y1="12"
|
||||
x2="18"
|
||||
y2="12"
|
||||
id="line4" />
|
||||
<line
|
||||
x1="6"
|
||||
y1="12"
|
||||
x2="2"
|
||||
y2="12"
|
||||
id="line6" />
|
||||
<line
|
||||
x1="12"
|
||||
y1="6"
|
||||
x2="12"
|
||||
y2="2"
|
||||
id="line8" />
|
||||
<line
|
||||
x1="12"
|
||||
y1="22"
|
||||
x2="12"
|
||||
y2="18"
|
||||
id="line10" />
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 2.1 KiB |
|
@ -0,0 +1,9 @@
|
|||
document.addEventListener("DOMContentLoaded", () => {
|
||||
fetch('idle-bgs/bgs.json')
|
||||
.then(response => response.json())
|
||||
.then(images => {
|
||||
const randomImage = images[Math.floor(Math.random() * images.length)];
|
||||
document.body.style.backgroundImage = `url(${randomImage})`;
|
||||
})
|
||||
.catch(error => console.error('Error fetching image list:', error));
|
||||
});
|
|
@ -0,0 +1,211 @@
|
|||
@font-face {
|
||||
font-family: iosevka-light;
|
||||
src: url('./fonts/iosevka_ttf/iosevka-light.ttf');
|
||||
}
|
||||
|
||||
html{
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background:#1b1b1b;
|
||||
}
|
||||
|
||||
body {
|
||||
/* background: #263238; */
|
||||
background-image: url('./bg.jpg');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
color: #ffa31a;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.head {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.category {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 20%;
|
||||
font-family: iosevka-light;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
background-color: #292929;
|
||||
color: #ffa31a;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0px 4px 5px #171D20;
|
||||
align-items: center;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 0px;
|
||||
border: #ffa31a 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.bookmark {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.bookmarks {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: #191C1E;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0px 4px 5px #171D20;
|
||||
align-items: center;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
background: rgba(41, 41, 41, .6);
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
align-self: center;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
align-self: center;
|
||||
justify-content: center;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
|
||||
.input_box {
|
||||
border: none;
|
||||
outline: none;
|
||||
background: none;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
width: 100%;
|
||||
color: #ffa31a;
|
||||
font-size: 22px;
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
height: 70px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button {
|
||||
background: none;
|
||||
border: none;
|
||||
transition-duration: 0.6s;
|
||||
position: fixed;
|
||||
padding-left: 11px;
|
||||
padding-right: 12px;
|
||||
height: 70px;
|
||||
opacity: 60%;
|
||||
}
|
||||
|
||||
.engine {
|
||||
background: none;
|
||||
padding-left: 12px;
|
||||
padding-right: 11px;
|
||||
border: none;
|
||||
transition-duration: 0.6s;
|
||||
position: relative;
|
||||
opacity: 60%;
|
||||
}
|
||||
|
||||
form {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.search_box {
|
||||
display: flex;
|
||||
background: rgba(41, 41, 41, .6);
|
||||
width: 600px;
|
||||
padding: 0px;
|
||||
margin-bottom: 40px;
|
||||
border-radius: 3px 3px 3px 3px;
|
||||
box-shadow: 0px 4px 5px #171D20;
|
||||
align-self: center;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.engine:hover {
|
||||
filter: saturate(150%) brightness(120%) !important;
|
||||
opacity: 100%;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
filter: saturate(150%) brightness(120%) !important;
|
||||
opacity: 100%;
|
||||
}
|
||||
|
||||
li {
|
||||
font-size: 16px;
|
||||
list-style-type: none;
|
||||
padding: 5px
|
||||
}
|
||||
|
||||
a:link {
|
||||
text-decoration: none;
|
||||
color: #F8BE4D;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #F8BE4D;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #B5CCE8;
|
||||
}
|
||||
|
||||
#credit {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-family: iosevka-light;
|
||||
}
|
||||
|
||||
#gSearch {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.container {
|
||||
display: block;
|
||||
}
|
||||
.bookmark {
|
||||
flex-direction: column;
|
||||
}
|
||||
.category {
|
||||
width: 90%;
|
||||
align-self: center;
|
||||
}
|
||||
.search_box {
|
||||
width: 90%;
|
||||
}
|
||||
.input_box {
|
||||
width: 100%;
|
||||
padding: 0px;
|
||||
}
|
||||
.engine {
|
||||
padding: 0px 5px;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue