Skip to content
Snippets Groups Projects
Commit 01a68a17 authored by Richard Githuba's avatar Richard Githuba
Browse files

stying fixes for log in

parent a1fdfd2f
Branches
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 35 additions and 26 deletions
src/main/resources/static/css/home/home.css
+ 7
− 1
View file @ 01a68a17
...@@ -4,6 +4,7 @@ section { ...@@ -4,6 +4,7 @@ section {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
margin-bottom: 30px;
} }
...@@ -55,6 +56,7 @@ button:hover { ...@@ -55,6 +56,7 @@ button:hover {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; /* Space out the content inside the tile */ justify-content: space-between; /* Space out the content inside the tile */
transition:transform ease-in-out;
} }
/* Logo and title container */ /* Logo and title container */
...@@ -97,8 +99,12 @@ button:hover { ...@@ -97,8 +99,12 @@ button:hover {
height: 100%; /* Ensures the link takes full height of the tile */ height: 100%; /* Ensures the link takes full height of the tile */
} }
.tile:hover{
transform: scale(1.03);
}
.tileLink:hover { .tileLink:hover {
background-color: #f0f0f0; /* Light background on hover */ /*background-color: #f0f0f0; !* Light background on hover *!*/
border-radius: 10px; border-radius: 10px;
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
......
src/main/resources/static/css/information/infoStyles.css
+ 0
− 2
View file @ 01a68a17
*{ *{
box-sizing: border-box; box-sizing: border-box;
font-family: "Roboto", serif;
/*font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif*/
} }
......
src/main/resources/static/css/layout/layout.css
+ 11
− 1
View file @ 01a68a17
...@@ -221,6 +221,10 @@ nav.sidebar { ...@@ -221,6 +221,10 @@ nav.sidebar {
/* ACCOUNT OPTIONS STYLING */ /* ACCOUNT OPTIONS STYLING */
/* Dropdown styles */ /* Dropdown styles */
#account-options {
cursor: pointer;
}
.dropdown { .dropdown {
position: relative; position: relative;
display: inline-block; display: inline-block;
...@@ -230,9 +234,11 @@ nav.sidebar { ...@@ -230,9 +234,11 @@ nav.sidebar {
display: none; display: none;
position: absolute; position: absolute;
background-color: #f9f9f9; background-color: #f9f9f9;
min-width: 160px; min-width: 100px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1; z-index: 1;
right: 50px;
top: 60px;
} }
.dropdown-content a { .dropdown-content a {
...@@ -250,5 +256,9 @@ nav.sidebar { ...@@ -250,5 +256,9 @@ nav.sidebar {
display: block; display: block;
} }
.proficon {
width: 20px;
height: 20px;
}
/* ACCOUNT OPTIONS STYLING END */ /* ACCOUNT OPTIONS STYLING END */
\ No newline at end of file
src/main/resources/static/css/register/register.css
+ 2
− 5
View file @ 01a68a17
/* General Styles */ /* General Styles */
body { section {
font-family: Arial, sans-serif;
background-color: #f9f9f9;
margin: 0;
padding: 0; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100vh; margin-bottom: 30px;
} }
/* Title */ /* Title */
......
src/main/resources/templates/information/information.html
+ 4
− 2
View file @ 01a68a17
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" <html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
layout:decorate="~{layout/layout}"> layout:decorate="~{layout/layout}"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity6"
>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<!--Custom styles--> <!--Custom styles-->
...@@ -24,7 +26,7 @@ ...@@ -24,7 +26,7 @@
<h1 th:text="${selectedInfo.getInfoTitle()}">Information Title</h1> <h1 th:text="${selectedInfo.getInfoTitle()}">Information Title</h1>
</section> </section>
<aside class="sub-head-edit-container"> <aside class="sub-head-edit-container">
<a id="editButtonLink" th:href="@{/info/edit/{id} (id=${selectedInfo.getInformationId()})}"> <a id="editButtonLink" th:href="@{/info/edit/{id} (id=${selectedInfo.getInformationId()})}" sec:authorize="isAuthenticated()" >
<button><strong>Edit</strong></button></a> <button><strong>Edit</strong></button></a>
</aside> </aside>
</section> </section>
......
src/main/resources/templates/layout/layout.html
+ 2
− 6
View file @ 01a68a17
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
<!-- Profile --> <!-- Profile -->
<div id="account-options"> <div id="account-options">
<div sec:authorize="isAnonymous()"> <div sec:authorize="isAnonymous()">
<img src="/assets/navbarImages/profile.png" class="navIcons anonymous"> <img src="/assets/navbarImages/profile.png" class="navIcons anonymous proficon">
<span class="navText">Sign in</span> <span class="navText">Sign in</span>
<div class="dropdown-content"> <div class="dropdown-content">
<a class="dropdown-nav-link" th:href="@{/login}">Login</a> <a class="dropdown-nav-link" th:href="@{/login}">Login</a>
...@@ -80,7 +80,7 @@ ...@@ -80,7 +80,7 @@
</div> </div>
</div> </div>
<div sec:authorize="isAuthenticated()"> <div sec:authorize="isAuthenticated()">
<img src="/assets/navbarImages/profile.png" class="navIcons authenticated"> <img src="/assets/navbarImages/profile.png" class="navIcons authenticated proficon">
<span class="navText"data-translate-key="navbar.profile">Profile</span> <span class="navText"data-translate-key="navbar.profile">Profile</span>
<div class="dropdown-content"> <div class="dropdown-content">
<a class="navLink" th:href="@{/profile}">View profile</a> <a class="navLink" th:href="@{/profile}">View profile</a>
...@@ -124,10 +124,6 @@ ...@@ -124,10 +124,6 @@
<a href="#" class="social-icon"><img src="/assets/navbarImages/instagram.png" alt="Instagram"></a> <a href="#" class="social-icon"><img src="/assets/navbarImages/instagram.png" alt="Instagram"></a>
</div> </div>
</div> </div>
<div class="footer-section copyright">
<p class="footerCompanyName">&copy; LUDEK PCG ltd. <span data-translate-key="footer.all_rights_reserved" >All rights reserved.</span></p>
</div>
</footer> </footer>
<script src="/js/layout/layout.js" defer></script> <script src="/js/layout/layout.js" defer></script>
<script th:replace="~{comments/commentFragment::commentScript}"></script> <script th:replace="~{comments/commentFragment::commentScript}"></script>
......
src/main/resources/templates/register/register.html
+ 9
− 9
View file @ 01a68a17
...@@ -9,10 +9,10 @@ ...@@ -9,10 +9,10 @@
<script src="/js/register/register.js" defer></script> <script src="/js/register/register.js" defer></script>
</head> </head>
<body> <section layout:fragment="content">
<h1>Create an Account</h1> <h1>Create an Account</h1>
<div class="registerContainer" layout:fragment="content"> <div class="registerContainer" >
<!-- The form is bound to the 'user' object --> <!-- The form is bound to the 'user' object -->
<form th:action="@{/register}" th:method="post" th:object="${user}" class="registerForm"> <form th:action="@{/register}" th:method="post" th:object="${user}" class="registerForm">
...@@ -50,12 +50,12 @@ ...@@ -50,12 +50,12 @@
<input type="date" id="dob" name="dob" required> <input type="date" id="dob" name="dob" required>
</div> </div>
<div class="registerField"> <!-- <div class="registerField">-->
<label for="roleId">Role</label> <!-- <label for="roleId" >Role</label>-->
<select name="roleId"> <!-- <select name="roleId">-->
<option th:each="role : ${roles}" th:value="${role.id}" th:text="${role.name}"></option> <!-- <option th:each="role : ${roles}" th:value="${role.id}" th:text="${role.name}"></option>-->
</select> <!-- </select> -->
</div> <!-- </div>-->
<div class="termsField"> <div class="termsField">
<input type="checkbox" id="agreeTerms" required> <input type="checkbox" id="agreeTerms" required>
...@@ -75,5 +75,5 @@ ...@@ -75,5 +75,5 @@
</form> </form>
</div> </div>
</body> </section>
</html> </html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment