Guusvanmeerveld
/
First-Website
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change the home page

Browse Source
add-license-1
Guus van Meerveld 5 years ago committed by GitHub
parent 7b9fb321d1
commit 2d12c45c59
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
25 changed files with 1708 additions and 1568 deletions
Show Stats Download Patch File Download Diff File

2
contact/index.html
Unescape View File

@ -18,7 +18,7 @@
<div class="main"> <div class="main">
<h1>Need more info?</h1> <h1>Need more info?</h1>
<div class="form"> <div class="form">
<form action="/thank-you" method="post"> <form action="/contact/thank-you/" method="get">
<h3>Name and last name<span>*</span></h3> <h3>Name and last name<span>*</span></h3>
<input type="text" class="dataInput input" required name="name" autofocus spellcheck="false"> <input type="text" class="dataInput input" required name="name" autofocus spellcheck="false">
<h3>E-mail<span>*</span></h3> <h3>E-mail<span>*</span></h3>

41
contact/thank-you/index.html
Unescape View File

@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Thank you</title>
<link rel="stylesheet" href="/resources/css/cssall.css">
<link rel="stylesheet" href="/resources/css/navbar.css">
<script src="https://kit.fontawesome.com/340f4d917c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<style>
.mainContent {
background-color: #33353d;
height: 100%;
padding-top: 15rem;
position: absolute;
top: 0;
width: 100%;
}
h1, p {
width: 80%;
text-align: center;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="mainContent">
<h1 style="font-size: 5rem;">Thanks for submitting your message</h1><br>
<p onclick="window.open('/', '_self')" style="cursor:pointer;">Click here to go home</p>
</div>
<script src="/resources/js/navbar.json.js"></script>
<script src="/resources/js/insertNavbar.js"></script>
<script src="/resources/js/javall.js"></script>
</body>
</html>

61
css.css
Unescape View File

@ -1,23 +1,34 @@
/* Main CSS */ /* Main CSS */
svg {
position: relative;
z-index: -1;
padding-top: 49px;
fill: #454752;
stroke-width: 1;
stroke: #454752;
height: 100vh;
}
.mainContent { .mainContent {
overflow: visible; padding-top: 10rem;
float: left; width: 100%;
padding: 6rem 0 0 2rem; height: 85vh;
display: inline-block;
width: 50%;
height: 100vh;
} }
.mainContent::-webkit-scrollbar { .name {
display: none; margin: 0 auto;
width: 80%;
text-align: center;
height: 5rem;
}
.launchRocket:focus + #rocket {
animation-name: launchRocket;
animation-duration: 2.5s;
animation-timing-function: ease-in-out;
}
@keyframes launchRocket {
from {
top: 85vh
}
to {
top: -20vh
}
}
#rocket {
position: absolute;
top: 100vh;
left: calc(50% - 7rem);
width: 12rem;
height: 14rem;
} }
/* Splash */ /* Splash */
.logo { .logo {
@ -66,24 +77,10 @@ svg {
vertical-align: top; vertical-align: top;
margin-top: 10px; margin-top: 10px;
} }
/* Clock */
#timeBox {
margin-left: 1rem;
padding: 1rem;
font-family: 'Open Sans', sans-serif;
}
.time {
display: inline-block;
font-size: 7rem;
margin: 0;
}
#date {
font-size: 2rem;
margin: 0;
}
/* About */ /* About */
.about { .about {
position: relative; position: relative;
box-shadow: 0 -1px 15px 5px hsla(0, 0%, 0%, 0.8);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

2
feedback/index.html
Unescape View File

@ -76,7 +76,7 @@
</ul> </ul>
</div> </div>
<p id="copyright">&#169; 2019 Guus van Meerveld</p> <p class="copyright">&#169; 2019 Guus van Meerveld</p>
</footer> </footer>

30
index.html
Unescape View File

@ -18,30 +18,26 @@
<body> <body>
<div class="box mainContent"> <div class="mainContent">
<h1 class="name">Guus van Meerveld</h1>
<h1 class="name"><img src="/resources/img/favicon.ico" class="logo" alt="logo">Guus van Meerveld</h1> <img src="/resources/img/rocket.png" alt="rocket" id="rocket">
</div>
<button class="keepclicking" onclick="window.open('/playground', '_self')" title="Test your HTML live at playground!"> <!-- <div class="">
<a class="keepclicking" href="/playground" target="_self" title="Test your HTML live at playground!">
<h1 class="playground">Want to test your HTML code?</h1> <h1 class="playground">Want to test your HTML code?</h1>
<i class="fas fa-code fa-8x code"></i> <i class="fas fa-code fa-8x code"></i>
</button> </a>
<button class="keepclicking" onclick="window.open('/minify', '_self')" title="Minify your HTML/CSS/JavaScript code!"> <a class="keepclicking" href="/minify" target="_self" title="Minify your HTML/CSS/JavaScript code!">
<i class="fas fa-cut fa-8x cut"></i> <i class="fas fa-cut fa-8x cut"></i>
<h1 class="minify">Need to minify your code?</h1> <h1 class="minify">Need to minify your code?</h1>
</button> </a>
</div> -->
</div>
<!-- Triangle -->
<svg>
<polygon points="0,5 0,2000 300,5"/>
</svg>
<!-- About --> <!-- About -->
<div class="about"> <div class="about">
<h1 class="head">This website is built for those who like to code.</h1> <h1 class="head">My name is Guus van Meerveld</h1>
<h1 class="head">And it is built by those who like to code</h1> <h1 class="head">I am 15 years old</h1>
<h1 class="head" style="border:0;">Suggest things you would like to see at <a href="/contact" style="text-decoration:underline!important;">contact</a></h1> <h1 class="head" style="border:0;">Suggest things you would like to see at <a href="/contact" style="text-decoration:underline!important;">contact</a></h1>
</div> </div>
@ -75,7 +71,7 @@
</ul> </ul>
</div> </div>
<p id="copyright">&#169; 2019 Guus van Meerveld</p> <p class="copyright">&#169; 2019 Guus van Meerveld</p>
</footer> </footer>

1
js.js
Unescape View File

@ -0,0 +1 @@

31
minify/css.css
Unescape View File

@ -0,0 +1,31 @@
.mainContent {
height: 100vh;
width: 100%;
padding: 7rem;
padding-bottom: 0;
background-color: #222226;
}
#inputCode {
width: 100%;
height: 85%;
}
.langButton {
background-color: rgb(59, 60, 69);
border: 0;
color: white;
float: left;
padding: 1rem 1.5rem;
}
#run {
float: right;
}
@media screen and (min-width:0px) and (max-width:1000px) {
.mainContent {
padding: 2rem;
padding-top: 5rem;
}
.langButton {
padding: .5rem 1rem;
font-size: 15px;
}
}

63
minify/index.html
Unescape View File

@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Minify</title>
<link rel="stylesheet" href="/resources/css/cssall.css">
<link rel="stylesheet" href="/minify/css.css">
<link rel="stylesheet" href="/resources/css/navbar.css">
<script src="https://kit.fontawesome.com/340f4d917c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div class="mainContent">
<button class="langButton" onclick="selectCode('html')">HTML</button>
<button class="langButton" onclick="selectCode('css')">CSS</button>
<button class="langButton" onclick="selectCode('js')">JS</button>
<button id="run" class="langButton">RUN</button>
<textarea name="" spellcheck="false" class="input" placeholder="Type the code that you want to minify here" id="inputCode" cols="30" rows="10"></textarea>
</div>
<footer>
<!-- Info -->
<div>
<h4>LINKS</h4>
<ul>
<li><a href="https://samtaen.ml">Sam Taen</a></li>
<li><a href="http://jonathanbos.nl">Jonathan Bos</a></li>
</ul>
</div>
<div>
<h4>SOCIAL</h4>
<ul>
<li><a href="https://www.youtube.com/channel/UCYuqpoMay5SezCBrA_HKVWQ?view_as=subscriber">Youtube</a></li>
<li><a href="https://twitter.com/GuusvanMeerveld">Twitter</a></li>
<li><a href="https://www.reddit.com/user/Marho_">Reddit</a></li>
<li><a href="https://instagram.com/gerda.6">Instagram</a></li>
</ul>
</div>
<div>
<h4>TOOLS</h4>
<ul>
<li><a href="https://w3schools.com">W3schools</a></li>
<li><a href="https://stackoverflow.com/">Stack overflow</a></li>
<li><a href="https://cloudflare.com">Cloudflare</a></li>
<li><a href="https://github.com">Github</a></li>
</ul>
</div>
<p class="copyright">&#169; 2019 Guus van Meerveld</p>
</footer>
<script src="/resources/js/navbar.json.js"></script>
<script src="/resources/js/insertNavbar.js"></script>
<script src="/minify/js.js"></script>
<script src="/resources/js/javall.js"></script>
</body>
</html>

9
minify/js.js
Unescape View File

@ -0,0 +1,9 @@
var d = document.getElementById.bind(document);
var g = document.querySelector.bind(document);
function selectCode(source) {
switch (source){
case: html
}
}

2
playground/index.html
Unescape View File

@ -61,7 +61,7 @@
</ul> </ul>
</div> </div>
<p id="copyright">&#169; 2019 Guus van Meerveld</p> <p class="copyright">&#169; 2019 Guus van Meerveld</p>
</footer> </footer>

10
resources/css/cssall.css
Unescape View File

@ -64,6 +64,9 @@ a {
a:hover { a:hover {
color: gray!important; color: gray!important;
} }
button:focus {
outline: 0!important;
}
/* Standard block styling */ /* Standard block styling */
.box { .box {
background-color: #454752; background-color: #454752;
@ -75,7 +78,7 @@ a:hover {
color: white; color: white;
outline: 0!important; outline: 0!important;
border-radius: 0.2rem; border-radius: 0.2rem;
transition: border .3s ease, background-color .3s; transition: background-color .3s;
} }
.button:hover { .button:hover {
background-color: #427a71; background-color: #427a71;
@ -91,7 +94,7 @@ a:hover {
color: white; color: white;
outline: 0!important; outline: 0!important;
border-radius: 0.2rem; border-radius: 0.2rem;
transition: border .3s ease, background-color .3s, border .3s; transition: background-color .3s, border .3s;
} }
.cancelButton:hover { .cancelButton:hover {
background-color: #a3281f; background-color: #a3281f;
@ -134,7 +137,7 @@ footer ul {
footer li { footer li {
margin-top: 1rem; margin-top: 1rem;
} }
#copyright { .copyright {
font-size: 15px; font-size: 15px;
position: absolute; position: absolute;
display: inline-block; display: inline-block;
@ -142,7 +145,6 @@ footer li {
bottom: 1rem; bottom: 1rem;
right: 1rem; right: 1rem;
white-space: nowrap; white-space: nowrap;
vertical-align: baseline;
} }
@media screen and (min-width:0px) and (max-width:1000px) { @media screen and (min-width:0px) and (max-width:1000px) {
footer { footer {

BIN
resources/img/rocket.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB