Berufsschule/Webshop
Berufsschule/Webshop
Template
5
2
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 1 Releases 3 Wiki Activity

LoginHtml #19

Merged
vex merged 3 commits from LoginHtml into develop 2025-02-27 09:35:16 +00:00
Conversation 1 Commits 3 Files Changed 6 +154 -18
6 changed files with 154 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fee0e5c183 - Show all commits

1
.idea/Webshop.iml generated
View File

@ -6,5 +6,6 @@
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="font-awesome" level="application" />
<orderEntry type="library" name="boxicons" level="application" />
</component>
</module>

19
.idea/inspectionProfiles/Project_Default.xml generated
View File

@ -6,11 +6,28 @@
<option name="myIgnoreVendorSpecificProperties" value="false" />
<option name="myCustomPropertiesList">
<value>
<list size="1">
<list size="2">
<item index="0" class="java.lang.String" itemvalue="interpolate-size" />
<item index="1" class="java.lang.String" itemvalue="cutline" />
</list>
</value>
</option>
</inspection_tool>
<inspection_tool class="HtmlUnknownTag" enabled="true" level="WARNING" enabled_by_default="true">
<option name="myValues">
<value>
<list size="7">
<item index="0" class="java.lang.String" itemvalue="nobr" />
<item index="1" class="java.lang.String" itemvalue="noembed" />
<item index="2" class="java.lang.String" itemvalue="comment" />
<item index="3" class="java.lang.String" itemvalue="noscript" />
<item index="4" class="java.lang.String" itemvalue="embed" />
<item index="5" class="java.lang.String" itemvalue="script" />
<item index="6" class="java.lang.String" itemvalue="input-box" />
</list>
</value>
</option>
<option name="myCustomValuesEnabled" value="true" />
</inspection_tool>
</profile>
</component>

2
.idea/jsLibraryMappings.xml generated
View File

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptLibraryMappings">
<file url="file://$PROJECT_DIR$" libraries="{HTML, HTTP Pre-Request and Response Handler, Node.js Core, font-awesome}" />
<file url="file://$PROJECT_DIR$" libraries="{HTML, HTTP Pre-Request and Response Handler, boxicons}" />
</component>
</project>

BIN
public/login/LoginBackround.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 534 KiB

47
public/login/index.html
View File

@ -1,24 +1,39 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>Login</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
<title>Loging</title>
</head>
<body>
<div>
<label>
E-Mail
<br>
<input type="text" id="loginMail">
</label>
<br>
<label>
Passwort
<br>
<input type="password" id="loginPassword">
</label>
<br>
<button onclick="login()">Login</button>
<div class="wrapper">
<form action="">
<h1>Login</h1>
<div class="input-box">
<input type="text" placeholder="Username" required>
<i class='bx bxs-user'></i>
</div>
<div class="input-box">
<input type="password" placeholder="Passwort" required>
<i class='bx bxs-lock-alt'></i>
</div>
<div class="remember-forgot">
<label><input type="checkbox"> Passwort merken </label>
<a href="#">Passwort vergessen?</a>
</div>
<button type="submit" class="btn">Login</button>
<div class="register-link">
<p>Noch keinen Account? <a href="#">Registrieren</a></p>
</div>
</form>
</div>
<!-- scripts -->

103
public/login/style.css Normal file
View File

@ -0,0 +1,103 @@
{
margin: 0
;
padding: 0
;
box-sizing: border-box
;
font-family: "Poppins", sans-serif
;
}
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: url("LoginBackround.jpg");
}
.wrapper {
width: 420px;
background: lightgrey;
color: #111111;
border-radius: 15px;
padding: 45px 25px;
}
.wrapper h1 {
font-size: 36px;
text-align: center;
margin-bottom: 40px;
}
.wrapper .input-box {
position: relative;
width: 89%;
height: 50px;
margin: 20px 1px;
}
.input-box input {
width: 100%;
height: 100%;
outline: none;
border: 2px solid rgba(255, 255, 255, .2);
border-radius: 40px;
font-size: 16px;
padding: 0 20px;
}
.wrapper .input-box input::placeholder {
color: #111111;
}
.input-box i {
position: absolute;
left: 390px;
top: 50%;
transform: translateY(-50%);
font-size: 20px;
margin-top: 4px;
}
.wrapper .remember-forgot {
display: flex;
justify-content: space-between;
font-size: 16.5px;
margin: 10px 20px;
}
.remember-forgot a {
color: #111111;
text-decoration: none;
}
.remember-forgot a:hover {
text-decoration: underline;
}
.wrapper .register-link {
font-size: 14px;
text-align: center;
}
.register-link a {
color: #111111;
text-decoration: none;
margin: -1px 6px;
}
.register-link a:hover {
text-decoration: underline;
}
.wrapper .btn {
width: 100%;
height: 50px;
border: none;
outline: none;
margin-top: 40px;
border-radius: 40px;
cursor: pointer;
}