Skip to content

S
SkuciSe
Commit 0a842f57 by Milovan Samardzic
Options

NoviHeader

parent b4e26dd9
Showing with 394 additions and 340 deletions
SkuciSe/src/main/resources/static/css/style.css
@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
body{
font-family: 'Jost', serif;font-size: 22px;
background-color: #d8dde0;
overflow-x: hidden;
}
header{
width: 100%;
height: 120px;
background: white;
display: flex;
flex-flow: row;
}
header img{
margin-left:15%;
}
header nav{
width: 50%;
}
header nav ul{
height: 120px;
display: flex;
justify-content: start;
}
header nav ul li{
.navbar a{
text-decoration: none;
color:#495056;
}
header nav ul li{
float:left;
list-style-type: none;
padding:50px;
}
header nav ul li a{
text-decoration: none;
color:#333333;
transition: width 2s;
display: inline-block;
.navbar-icon-top .navbar-nav .nav-link > .fa {
position: relative;
width: 36px;
font-size: 24px;
}
header nav ul li a:after {
content: '';
.navbar-icon-top .navbar-nav .nav-link > .fa > .badge {
font-size: 0.75rem;
position: absolute;
width: 100%;
transform: scaleX(0);
height: 2px;
bottom: 0;
left: 0;
background-color: #0087ca;
transform-origin: bottom right;
transition: transform 0.25s ease-out;
right: 0;
font-family: sans-serif;
}
header nav ul li a:hover:after {
transform: scaleX(1);
transform-origin: bottom left;
.navbar-icon-top .navbar-nav .nav-link > .fa {
top: 3px;
line-height: 12px;
}
header #navbar-login{
margin-top:1%;
margin-right:2%;
width: 50%;
height: 120px;
.navbar-icon-top .navbar-nav .nav-link > .fa > .badge {
top: -10px;
}
header #navbar-login{
display:flex;
justify-content: end;
align-items: center;
@media (min-width: 576px) {
.navbar-icon-top.navbar-expand-sm .navbar-nav .nav-link {
text-align: center;
display: table-cell;
height: 70px;
vertical-align: middle;
padding-top: 0;
padding-bottom: 0;
}
.navbar-icon-top.navbar-expand-sm .navbar-nav .nav-link > .fa {
display: block;
width: 48px;
margin: 2px auto 4px auto;
top: 0;
line-height: 24px;
}
.navbar-icon-top.navbar-expand-sm .navbar-nav .nav-link > .fa > .badge {
top: -7px;
}
}
header #navbar-login ul li{
float:left;
padding:20px;
list-style-type: none;
@media (min-width: 768px) {
.navbar-icon-top.navbar-expand-md .navbar-nav .nav-link {
text-align: center;
display: table-cell;
height: 70px;
vertical-align: middle;
padding-top: 0;
padding-bottom: 0;
}
.navbar-icon-top.navbar-expand-md .navbar-nav .nav-link > .fa {
display: block;
width: 48px;
margin: 2px auto 4px auto;
top: 0;
line-height: 24px;
}
.navbar-icon-top.navbar-expand-md .navbar-nav .nav-link > .fa > .badge {
top: -7px;
}
}
header #navbar-login ul li a{
text-decoration: none;
color: #3b3a37;
@media (min-width: 992px) {
.navbar-icon-top.navbar-expand-lg .navbar-nav .nav-link {
text-align: center;
display: table-cell;
height: 70px;
vertical-align: middle;
padding-top: 0;
padding-bottom: 0;
}
.navbar-icon-top.navbar-expand-lg .navbar-nav .nav-link > .fa {
display: block;
width: 48px;
margin: 2px auto 4px auto;
top: 0;
line-height: 24px;
}
.navbar-icon-top.navbar-expand-lg .navbar-nav .nav-link > .fa > .badge {
top: -7px;
}
}
header #navbar-login ul li button{
background-color: #3b3a37;
border:0px;
border-radius: 20px;
@media (min-width: 1200px) {
.navbar-icon-top.navbar-expand-xl .navbar-nav .nav-link {
text-align: center;
display: table-cell;
height: 70px;
vertical-align: middle;
padding-top: 0;
padding-bottom: 0;
}
.navbar-icon-top.navbar-expand-xl .navbar-nav .nav-link > .fa {
display: block;
width: 48px;
margin: 2px auto 4px auto;
top: 0;
line-height: 24px;
}
.navbar-icon-top.navbar-expand-xl .navbar-nav .nav-link > .fa > .badge {
top: -7px;
}
}
#pozadina{
width: 100%;
......@@ -129,7 +173,7 @@ h3{
font-size: calc(10px + (12 - 10) * ((100vw - 360px) / (1600 - 360))) !important;
}
.form-body{
height: 600px;
height: 650px;
}
.form-holder {
display: flex;
......@@ -142,7 +186,7 @@ h3{
.form-holder .form-content {
position: relative;
bottom:150px;
bottom:100px;
text-align: center;
display: -webkit-box;
display: -moz-box;
......@@ -154,6 +198,7 @@ h3{
-webkit-align-items: center;
align-items: center;
padding: 60px;
height: 700px;
}
.form-content .form-items {
......@@ -362,22 +407,3 @@ img {
width: 50%;
text-align: center;
}
\ No newline at end of file
/*the fade animations*/
@keyframes fade-out {
from {
opacity: 100%;
}
to {
opacity: 0%;
}
}
@keyframes fade-in {
from {
opacity: 0%;
}
to {
opacity: 100%;
}
}
\ No newline at end of file
SkuciSe/src/main/resources/static/js/main.js
......@@ -27,27 +27,3 @@ function proveraLogin(){
document.getElementById("losaSifra").style.display = "none";
}
}
\ No newline at end of file
//toggle var
var fade_state = true;
//on btn click
function fade() {
//get the button and div
let div = document.getElementById("fadeDiv");
let btn = document.getElementById("fade");
//if faded in or out
if (fade_state == true) {
//trigers animation
div.style.animation = "fade-out 2s forwards";
//sets the text
btn.innerHTML = "fade-in";
//sets fade_state
fade_state = false;
} else if (fade_state == false) {
//trigers animation
div.style.animation = "fade-in 2s forwards";
//sets the text
btn.innerHTML = "fade-out";
//sets fade_state
fade_state = true;
}
}
\ No newline at end of file
SkuciSe/src/main/resources/templates/index.html
......@@ -8,6 +8,7 @@
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
......@@ -21,30 +22,42 @@
</head>
<body th:object="${loggedUser}">
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<div id="navbar-login" class="ml-10">
<ul>
<li th:if="${loggedUser == null}"><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span
style="padding:5px;">Prijavi se</span></a></li>
<li th:if="${loggedUser == null}"><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span
style="padding:5px;">Registruj se</span></a></li>
<li>
<button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:5px;"
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
......@@ -62,7 +75,7 @@
</li>
</ul>
</div>
</header>
</nav>
<div id="pozadina">
</div>
......@@ -85,6 +98,8 @@
</footer>
</div>
<!-- JavaScript Bundle with Popper -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
......
SkuciSe/src/main/resources/templates/lista-korisnika-delete.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<meta name="description" content=""/>
<meta name="author" content=""/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico"/>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico"/>
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<!-- Core theme CSS (includes Bootstrap)-->
<link href="/css/style.css" rel="stylesheet"/>
<link href="/css/style.css" rel="stylesheet" />
</head>
<body th:object="${loggedUser}">
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<div id="navbar-login" class="ml-10">
<ul>
<li th:if="${loggedUser == null}"><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span
style="padding:5px;">Prijavi se</span></a></li>
<li th:if="${loggedUser == null}"><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span
style="padding:5px;">Registruj se</span></a></li>
<li>
<button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:5px;"
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
......@@ -63,7 +74,7 @@
</li>
</ul>
</div>
</header>
</nav>
<div class="container d-flex align-items-center justify-content-center flex flex-column h-50">
<h1>Spisak korisnika</h1>
......@@ -153,15 +164,11 @@
</footer>
</div>
<!-- JavaScript Bundle with Popper -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/51d1fadef3.js" crossorigin="anonymous"></script>
<script src="/js/main.js"></script>
......
SkuciSe/src/main/resources/templates/lista-korisnika.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<meta name="description" content=""/>
<meta name="author" content=""/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico"/>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico"/>
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<!-- Core theme CSS (includes Bootstrap)-->
<link href="/css/style.css" rel="stylesheet"/>
<link href="/css/style.css" rel="stylesheet" />
</head>
<body th:object="${loggedUser}">
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<div id="navbar-login" class="ml-10">
<ul>
<li th:if="${loggedUser == null}"><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span
style="padding:5px;">Prijavi se</span></a></li>
<li th:if="${loggedUser == null}"><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span
style="padding:5px;">Registruj se</span></a></li>
<li>
<button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:5px;"
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
......@@ -63,7 +74,7 @@
</li>
</ul>
</div>
</header>
</nav>
<div class="container d-flex align-items-center justify-content-center flex flex-column h-50">
<h1>Spisak korisnika</h1>
......@@ -147,15 +158,11 @@
</footer>
</div>
<!-- JavaScript Bundle with Popper -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/51d1fadef3.js" crossorigin="anonymous"></script>
<script src="/js/main.js"></script>
......
SkuciSe/src/main/resources/templates/login.html
......@@ -6,7 +6,9 @@
<meta name="description" content="" />
<meta name="author" content="" />
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
......@@ -20,23 +22,59 @@
</head>
<body>
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="#">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<!--<img src="../static/images/logo.png" alt="Logo">-->
<div id="navbar-login">
<ul>
<li><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span style="padding:5px;">Uloguj se</span></a></li>
<li><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span style="padding:5px;">Registruj se</span></a></li>
<li><button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite novi oglas</button></li>
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" th:href="@{/profile}">Moj Profil</a>
<a class="dropdown-item" th:href="@{/mojioglasi}">Moji Oglasi</a>
<a class="dropdown-item" th:href="@{/mojizahtevi}">Moji Zahtevi</a>
<a th:if="${loggedUser.getKorisnik().getTipId() == 2}" class="dropdown-item"
th:href="@{/lista-korisnika}">Lista Profila</a>
<form th:action="@{/logout}" method="post" id="my_form" class="dropdown-item">
<a href="#" onclick="document.getElementById('my_form').submit(); return false;"><i
class="fas fa-sign-in-alt"></i><span style="padding:5px;">Odjavi se</span></a>
</form>
</div>
</div>
</li>
</ul>
</div>
</header>
</nav>
<div class="form-body">
<div class="row">
......@@ -87,7 +125,13 @@
</div>
</footer>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- JavaScript Bundle with Popper -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/51d1fadef3.js" crossorigin="anonymous"></script>
<script src="/js/main.js"></script>
</body>
......
SkuciSe/src/main/resources/templates/profile.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<meta name="description" content=""/>
<meta name="author" content=""/>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico"/>
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<!-- Core theme CSS (includes Bootstrap)-->
<link href="/css/style.css" rel="stylesheet"/>
<link href="/css/style.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/solid.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/svg-with-js.min.css" rel="stylesheet"/>
</head>
<body th:object="${loggedUser}">
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<div id="navbar-login" class="ml-10">
<ul>
<li th:if="${loggedUser == null}"><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span
style="padding:5px;">Prijavi se</span></a></li>
<li th:if="${loggedUser == null}"><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span
style="padding:5px;">Registruj se</span></a></li>
<li>
<button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:5px;"
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
......@@ -65,11 +74,11 @@
</li>
</ul>
</div>
</header>
</nav>
<div class="container">
<div class="row" style="margin-top:50px;">
<div class="row d-flex justify-content-center align-items-center" style="margin-top:50px;">
<div class="col-md-5">
<div class="row">
<div class="col-12 bg-white p-0 px-3 py-3 mb-3">
......@@ -93,64 +102,6 @@
</div>
</div>
</div>
<div class="form-body" style="height: 400px;margin-left:53px;display: none;" id="fadeDiv">
<div class="row">
<div class="form-holder" style="min-height: 0;">
<div class="form-content" style="bottom:50px;">
<div class="form-items">
<form class="requires-validation" novalidate th:object="${editUser}" method="POST"
th:action="@{/profile-update}" enctype="multipart/form-data">
<input th:field="${editUser.korisnikId}" class="form-control" type="hidden"
name="name" placeholder="Ime" required>
<div class="col-md-12">
<input th:field="${editUser.ime}" class="form-control" type="text"
name="name" placeholder="Ime" required>
<div class="invalid-feedback">Ime ne sme biti prazno!</div>
</div>
<div class="col-md-12">
<input th:field="${editUser.prezime}" class="form-control" type="text"
name="surname" placeholder="Prezime" required>
<div class="invalid-feedback">Prezime ne sme biti prazno!</div>
</div>
<div class="col-md-12">
<input th:field="${editUser.telefon}" class="form-control" type="text"
name="phone" placeholder="Broj telefona" required>
<div class="invalid-feedback">Broj telefona ne sme biti prazan!</div>
</div>
<div class="col-md-12">
<input th:field="${editUser.email}" class="form-control" type="email"
name="email" placeholder="E-mail Adresa" required>
<div class="invalid-feedback">Email ne sme biti prazan!</div>
</div>
<div class="col-md-12">
<select th:field="${editUser.gradId}">
<option th:each="lokacija: ${lokacije}"
th:value="${lokacija.getLokacijaId()}"
th:text="${lokacija.getNaziv()}">
</option>
</select>
</div>
<div class="col-md-12">
<input th:field="${editUser.sifra}" class="form-control" type="password"
name="password" placeholder="Sifra" required>
<div class="invalid-feedback">Sifra ne sme biti prazna!</div>
</div>
<div class="form-button mt-3">
<button id="submit" type="submit" class="btn btn-primary">Izmeni podatke
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<form id="formaSlika" method="POST" th:object="${loggedUser}" th:action="@{/profile-picture-update}"
......@@ -158,7 +109,7 @@
<input type="file" name="image" accept="image/png, image/jpeg" id="inputSlika" style="display: none"
onchange="document.getElementById('formaSlika').submit();return false;"/>
</form>
<div class="col-md-7 ps-md-4">
<div class="col-md-7 ps-md-4 h-auto w-100">
<div class="row">
<div class="col-12 bg-white px-3 mb-3 pb-3">
<div class="d-flex align-items-center justify-content-between border-bottom">
......@@ -224,28 +175,13 @@
</div>
</footer>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
<!-- JavaScript Bundle with Popper -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/51d1fadef3.js" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="/js/main.js"></script>
<script>
$(document).ready(function () {
$("#fade").click(function () {
if (document.getElementById("fadeDiv").style.display === "none") {
$("#fadeDiv").fadeIn(1000);
}
else
$("#fadeDiv").fadeOut(1000);
});
});
</script>
</body>
</html>
SkuciSe/src/main/resources/templates/register.html
......@@ -6,7 +6,9 @@
<meta name="description" content="" />
<meta name="author" content="" />
<title>SkuciSe</title>
<link rel="shortcut icon" type="image/x-icon" href="/images/logo.ico" />
<link href='https://fonts.googleapis.com/css?family=Jost' rel='stylesheet'>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
......@@ -20,25 +22,61 @@
</head>
<body>
<header>
<nav>
<ul>
<li><a th:href="@{/index}">Pocetna</a></li>
<li><a href="#">Kategorije</a></li>
<li><a href="#">O nama</a></li>
<nav class="navbar navbar-icon-top navbar-expand-lg p-3" style="background-color: white;">
<a class="navbar-brand" href="#"> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" th:href="@{/index}">
<i class="fa fa-home"></i>
Pocetna
<span class="sr-only">(current)</span>
</a>
</li>
</ul>
</nav>
<!--<img src="../static/images/logo.png" alt="Logo">-->
<div id="navbar-login">
<ul>
<li><a th:href="@{/login}"><i class="fas fa-sign-in-alt"></i><span style="padding:5px;">Prijavi se</span></a></li>
<li><a th:href="@{/register}"><i class="fa-solid fa-circle-user"></i><span style="padding:5px;">Registruj se</span></a></li>
<li><button type="button" class="btn btn-primary btn-md"><i class="fa-regular fa-message"></i> Postavite novi oglas</button></li>
<form class="form-inline my-2 my-lg-0" th:if="${loggedUser != null}">
<button type="button" class="btn btn-primary btn-md mr-2"><i class="fa-solid fa-plus"></i> Postavite
novi oglas
</button>
</form>
<ul class="navbar-nav">
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/login}"><i class="fas fa-sign-in-alt" style="color:#495056"></i><span
style="padding:10px;color:#495056">Prijavi se</span></a>
</li>
<li class="nav-item" th:if="${loggedUser == null}">
<a th:href="@{/register}"><i class="fa-solid fa-circle-user" style="color:#495056"></i><span
style="padding:10px;color:#495056">Registruj se</span></a>
</li>
<li th:if="${loggedUser != null}">
<div class="dropdown mr-4">
<button class="btn btn-secondary dropdown-toggle round" type="button" id="dropdownMenuButton"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa-solid fa-circle-user"></i><span style="padding:10px;"
th:text="${loggedUser.getKorisnik().getIme()}"></span>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" th:href="@{/profile}">Moj Profil</a>
<a class="dropdown-item" th:href="@{/mojioglasi}">Moji Oglasi</a>
<a class="dropdown-item" th:href="@{/mojizahtevi}">Moji Zahtevi</a>
<a th:if="${loggedUser.getKorisnik().getTipId() == 2}" class="dropdown-item"
th:href="@{/lista-korisnika}">Lista Profila</a>
<form th:action="@{/logout}" method="post" id="my_form" class="dropdown-item">
<a href="#" onclick="document.getElementById('my_form').submit(); return false;"><i
class="fas fa-sign-in-alt"></i><span style="padding:5px;">Odjavi se</span></a>
</form>
</div>
</div>
</li>
</ul>
</div>
</header>
</nav>
<div class="form-body">
<div class="form-body d-flex justify-content-center w-100 mt-5">
<div class="row">
<div class="form-holder">
<div class="form-content" style="bottom:50px;">
......@@ -127,7 +165,13 @@
</div>
</footer>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<!-- JavaScript Bundle with Popper -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/51d1fadef3.js" crossorigin="anonymous"></script>
<script src="/js/main.js"></script>
<!-- Core theme JS-->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment