andrew
/
Teaching_Assistant_Assistant
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Styling upgrades!

This commit is contained in:
Andrew Lalis 2019-03-03 22:28:40 +01:00 committed by andrewlalis
parent d49419146a
commit fc38a2bf5c
6 changed files with 70 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/main/resources/static/css/header.css
View File

@ -10,14 +10,15 @@ body {
color: whitesmoke;
padding-bottom: 20px;
padding-top: 20px;
height: 30px;
}
.header_title {
margin-top: auto;
margin-bottom: auto;
padding: 10px;
width: 25%;
display: inline;
font-size: 30px;
}
.header_link_list {

27
src/main/resources/static/css/style.css Normal file
View File

@ -0,0 +1,27 @@
.content_container {
width: 50%;
margin-left: auto;
margin-right: auto;
text-align: left;
font-size: 16px;
color: black;
}
.sidebar_container {
width: 20%;
height: 100%;
position: fixed;
top: 70px;
right: 0;
}
.sidebar_block {
margin: 20px 0 20px 0;
padding: 20px;
background-color: green;
color: whitesmoke;
}
.sidebar_block:hover {
background-color: gray;
}

18
src/main/resources/templates/courses.html
View File

@ -1,11 +1,11 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" th:replace="~{layouts/basic_page :: layout (~{::title}, ~{::section})}">
<html xmlns:th="http://www.thymeleaf.org" th:replace="~{layouts/basic_page :: layout (~{::title}, ~{::#content}, ~{::#sidebar})}">
<head>
<title>Courses</title>
</head>
<body>
<section>
<div id="content">
<table>
<tr>
<th>Name</th>
@ -18,7 +18,19 @@
<td th:text="${course.getCode()}"></td>
</tr>
</table>
</section>
</div>
<div id="sidebar">
<div class="sidebar_block">
Create new course
</div>
<div class="sidebar_block">
Do something else
</div>
<div class="sidebar_block">
Click this link!
</div>
</div>
</body>
</html>

1
src/main/resources/templates/fragments/header.html
View File

@ -13,7 +13,6 @@
<ul class="header_link_list">
<li><a href="/" th:href="@{/}">Home</a>
<li><a href="/courses" th:href="@{/courses}">Courses</a>
<li><a href="/students" th:href="@{/students}">Students</a>
</ul>
</nav>

16
src/main/resources/templates/index.html
View File

@ -1,17 +1,21 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" th:replace="~{layouts/basic_page :: layout (~{::title}, ~{::section})}">
<html xmlns:th="http://www.thymeleaf.org" th:replace="~{layouts/basic_page :: layout (~{::title}, ~{::#content}, ~{::#sidebar})}">
<head>
<title>Homepage</title>
</head>
<body>
<div th:replace="~{fragments/header :: header}">&nbsp;</div>
<section>
<div id="content">
<p>
Welcome to the home page.
Welcome to the home page. To find the courses in this application please follow the link to <a th:href="@{/courses}">courses</a>.
</p>
</section>
</div>
<div id="sidebar">
<div class="sidebar_block">
This is an example sidebar block.
</div>
</div>
</body>
</html>

13
src/main/resources/templates/layouts/basic_page.html
View File

@ -1,18 +1,29 @@
<!DOCTYPE html>
<html lang="en" th:fragment="layout (title, content)" xmlns:th="http://www.thymeleaf.org">
<html lang="en" th:fragment="layout (title, content, sidebar_content)" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title th:replace="${title}">basic_page</title>
<link rel="stylesheet" href="../../../resources/static/css/style.css" th:href="@{/css/style.css}" />
</head>
<body>
<div th:replace="~{fragments/header :: header}">&nbsp;</div>
<div class="content_container">
<div th:replace="${content}">
<p>
Basic page content block.
</p>
</div>
</div>
<div class="sidebar_container">
<div th:replace="${sidebar_content}">
<p>
Basic page sidebar block.
</p>
</div>
</div>
</body>
</html>