RyanGoodwill/web_assignment
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

登录和注册界面get√

Browse Source
This commit is contained in:
高子兴 2024-07-14 13:15:30 +08:00
parent f6aa1b06d2
commit ced3813806
3 changed files with 151 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/main/webapp/login.xhtml Normal file
View File

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<f:view>
<h:head>
<title>Login - My Portfolio</title>
<h:outputStylesheet library="css" name="styles.css"/>
<h:outputStylesheet library="css" name="auth.css"/>
</h:head>
<h:body>
<ui:include src="header.xhtml"/>
<h:form>
<main>
<section id="login">
<h1>Login</h1>
<div class="form-container">
<div class="form-group">
<h:outputLabel for="username" value="Username:" />
<h:inputText id="username" value="#{projectBean.username}" required="true" styleClass="form-control" />
</div>
<div class="form-group">
<h:outputLabel for="password" value="Password:" />
<h:inputSecret id="password" value="#{projectBean.password}" required="true" styleClass="form-control" />
</div>
<h:commandButton value="Login" action="#{projectBean.login}" styleClass="btn btn-primary" />
</div>
<h:messages globalOnly="true" />
</section>
</main>
</h:form>
<ui:include src="footer.xhtml"/>
</h:body>
</f:view>
</html>

38
src/main/webapp/register.xhtml Normal file
View File

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<f:view>
<h:head>
<title>Register - My Portfolio</title>
<h:outputStylesheet library="css" name="styles.css"/>
<h:outputStylesheet library="css" name="auth.css"/>
</h:head>
<h:body>
<ui:include src="header.xhtml"/>
<h:form>
<main>
<section id="register">
<h1>Register</h1>
<div class="form-container">
<div class="form-group">
<h:outputLabel for="username" value="Username:" />
<h:inputText id="username" value="#{projectBean.username}" required="true" styleClass="form-control" />
</div>
<div class="form-group">
<h:outputLabel for="password" value="Password:" />
<h:inputSecret id="password" value="#{projectBean.password}" required="true" styleClass="form-control" />
</div>
<h:commandButton value="Register" action="#{projectBean.register}" styleClass="btn btn-primary" />
</div>
<h:messages globalOnly="true" />
</section>
</main>
</h:form>
<ui:include src="footer.xhtml"/>
</h:body>
</f:view>
</html>

75
src/main/webapp/resources/css/auth.css Normal file
View File

@ -0,0 +1,75 @@
body {
font-family: Arial, sans-serif;
background-color: #f5f5f5;
margin: 0;
padding: 0;
}
main {
display: flex;
justify-content: center;
align-items: center;
min-height: 70vh;
}
section {
background: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 40%;
}
h1 {
font-size: 24px;
margin-bottom: 20px;
color: #333;
}
.form-container {
width: 100%;
}
.form-group {
margin-bottom: 15px;
}
.form-group h\\:outputLabel {
display: block;
margin-bottom: 5px;
font-weight: bold;
color: #555;
}
.form-control {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
box-sizing: border-box;
}
.btn {
display: inline-block;
padding: 10px 20px;
color: #fff;
background-color: #007bff;
border: none;
border-radius: 4px;
cursor: pointer;
text-align: center;
text-decoration: none;
}
.btn-primary {
background-color: #007bff;
}
.btn-primary:hover {
background-color: #0056b3;
}
h\\:messages {
margin-top: 20px;
color: #ff0000;
}