mirror of
https://github.com/timmypidashev/web.git
synced 2026-04-14 19:13:51 +00:00
just some more work done
This commit is contained in:
39
code.html
39
code.html
@@ -1,39 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>Editor</title>
|
||||
<style type="text/css" media="screen">
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#editor {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<pre id="editor">function foo(items) {
|
||||
var i;
|
||||
for (i = 0; i < items.length; i++) {
|
||||
alert("Ace Rocks " + items[i]);
|
||||
}
|
||||
}</pre>
|
||||
|
||||
<script src="src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script>
|
||||
var editor = ace.edit("editor");
|
||||
editor.setTheme("ace/theme/twilight");
|
||||
editor.session.setMode("ace/mode/javascript");
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -198,7 +198,7 @@ html {
|
||||
.blog:hover {
|
||||
transform: scale(1.1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.blog__image {
|
||||
margin-left: 2vw;
|
||||
@@ -206,6 +206,75 @@ html {
|
||||
width: 10vw;
|
||||
}
|
||||
|
||||
/* Login */
|
||||
#login-holder {
|
||||
width: 50%;
|
||||
height: 70%;
|
||||
display: grid;
|
||||
justify-items: center;
|
||||
align-items: center;
|
||||
background-color: grey;
|
||||
border-radius: 7px;
|
||||
box-shadow: 0px 0px 5px 2px black;
|
||||
}
|
||||
|
||||
#login-error-msg-holder {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
justify-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#login-error-msg {
|
||||
width: 23%;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
color: #8a0000;
|
||||
border: 1px solid #8a0000;
|
||||
background-color: #e58f8f;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#error-msg-second-line {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#login-form {
|
||||
align-self: flex-start;
|
||||
display: grid;
|
||||
justify-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login-form-field::placeholder {
|
||||
color: #3a3a3a;
|
||||
}
|
||||
|
||||
.login-form-field {
|
||||
border: none;
|
||||
border-bottom: 1px solid #3a3a3a;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 3px;
|
||||
outline: none;
|
||||
padding: 0px 0px 5px 5px;
|
||||
}
|
||||
|
||||
#login-form-submit {
|
||||
width: 100%;
|
||||
padding: 7px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
background-color: #3a3a3a;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1024px) {
|
||||
.hero__header {
|
||||
font-size: 12vw;
|
||||
|
||||
@@ -22,7 +22,8 @@
|
||||
<div id="myNav" class="overlay">
|
||||
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
|
||||
<div class="overlay-content">
|
||||
<a href="code.html">Write some code</a>
|
||||
<a href="https://gitea.timmypidashev.com">My Gitea instance</a>
|
||||
<a href="python3.html">Learn Python3</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
0
js/python3/editor.js
Normal file
0
js/python3/editor.js
Normal file
16
js/python3/login.js
Normal file
16
js/python3/login.js
Normal file
@@ -0,0 +1,16 @@
|
||||
const loginForm = document.getElementById("login-form");
|
||||
const loginButton = document.getElementById("login-form-submit");
|
||||
const loginErrorMsg = document.getElementById("login-error-msg");
|
||||
|
||||
loginButton.addEventListener("click", (e) => {
|
||||
e.preventDefault();
|
||||
const username = loginForm.username.value;
|
||||
const password = loginForm.password.value;
|
||||
|
||||
if (username === "user" && password === "web_dev") {
|
||||
alert("You have successfully logged in.");
|
||||
location.reload();
|
||||
} else {
|
||||
loginErrorMsg.style.opacity = 1;
|
||||
}
|
||||
})
|
||||
31
login.html
Normal file
31
login.html
Normal file
@@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en"></html>
|
||||
<head>
|
||||
<title>Login</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="css/styles.css">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
|
||||
</head>
|
||||
<body>
|
||||
<section class="centered">
|
||||
<main id="login-holder">
|
||||
<div class=>
|
||||
<h1 id="login-header">Login</h1>
|
||||
|
||||
<div id="login-error-msg-holder">
|
||||
<p id="login-error-msg">Invalid username <span id="error-msg-second-line">and/or password</span></p>
|
||||
</div>
|
||||
|
||||
<form id="login-form">
|
||||
<input type="text" name="username" id="username-field" class="login-form-field" placeholder="Username">
|
||||
<input type="password" name="password" id="password-field" class="login-form-field" placeholder="Password">
|
||||
<input type="submit" value="Login" id="login-form-submit">
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
</section>
|
||||
<script src="js/python3/login.js"></script>
|
||||
</body>
|
||||
Reference in New Issue
Block a user