Skip to content

S
SkuciSe
Commit 75b884d2 by Milovan Samardzic
Options

listaOglasaUpdatedFront

parent fb7c5ea5
Showing with 204 additions and 27 deletions
SkuciSe/src/main/java/com/example/SkuciSe/controller/OglasController.java
...@@ -51,7 +51,12 @@ public class OglasController ...@@ -51,7 +51,12 @@ public class OglasController
public String getListaOglasa( Model model, @AuthenticationPrincipal KorisnikDetails loggedUser) public String getListaOglasa( Model model, @AuthenticationPrincipal KorisnikDetails loggedUser)
{ {
model.addAttribute("loggedUser", loggedUser); model.addAttribute("loggedUser", loggedUser);
model.addAttribute("oglasi", oRepo.findAll()); List<Oglas> listaOglasa = oRepo.findAll();
while(listaOglasa.size() % 3 != 0){
Oglas o = new Oglas();
listaOglasa.add(o);
}
model.addAttribute("oglasi",listaOglasa);
List<String> list = new ArrayList<String>(); List<String> list = new ArrayList<String>();
for (Oglas o:oRepo.findAll()) { for (Oglas o:oRepo.findAll()) {
list.add(kRepo.findCity(o.getLokacijaId())); list.add(kRepo.findCity(o.getLokacijaId()));
......
SkuciSe/src/main/resources/static/css/oglasiStyle.css
...@@ -2,9 +2,12 @@ ...@@ -2,9 +2,12 @@
body{ body{
font-family: 'Jost', serif;font-size: 22px; font-family: 'Jost', serif;font-size: 22px;
background-color: #d8dde0; background-color: #fff; /*sredina*/
overflow-x: hidden; overflow-x: hidden;
} }
.navbar{
background-color: #f9f9f9; /*header*/
}
.navbar a{ .navbar a{
text-decoration: none; text-decoration: none;
color:#495056; color:#495056;
...@@ -124,8 +127,7 @@ body{ ...@@ -124,8 +127,7 @@ body{
} }
.container-fluid{ .container-fluid{
overflow:hidden; overflow:hidden;
margin-top: 250px ; background:#1c1c1c; /*footer*/
background:#262626 ;
color: #627482 !important; color: #627482 !important;
margin-bottom: 0 ; margin-bottom: 0 ;
padding-bottom:0 ; padding-bottom:0 ;
...@@ -156,7 +158,62 @@ h3{ ...@@ -156,7 +158,62 @@ h3{
.rights{ .rights{
font-size: calc(10px + (12 - 10) * ((100vw - 360px) / (1600 - 360))) !important; font-size: calc(10px + (12 - 10) * ((100vw - 360px) / (1600 - 360))) !important;
} }
.img-section{ .main-section {
margin-top: 20px;
width: 100%; width: 100%;
height: 30%; height: 100%;
}
.add-sens {
position: absolute;
top: 0px;
right: 50px;
}
.img-section {
overflow: hidden;
}
.img-section img {
overflow: hidden;
width: 100%;
}
.img-section img:hover {
opacity: 0.6;
transition: 0.5s;
cursor: pointer;
}
.sectin-title h1 {
font-weight: 700;
font-size: 23px;
color: #285A63;
}
.section-detail p {
color: #756d6d;
letter-spacing: 1px;
}
.fa-star,
.fa-star-half-alt {
color: #FEC00B;
}
.fa-star-half-alt {
margin-right: 10px;
}
.btn-primary{
background-color: #6C757D;
outline: none;
border: 0px;
box-shadow: none;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active{
background-color: #495056;
outline: none !important;
border: none !important;
box-shadow: none;
} }
\ No newline at end of file
SkuciSe/src/main/resources/static/css/style.css
@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"); @import url("//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
body{ body{
font-family: 'Jost', serif;font-size: 22px; font-family: 'Jost', serif;font-size: 22px;
background-color: #fff; /*sredina*/ background-color: #fff; /*sredina*/
...@@ -159,9 +158,7 @@ h3{ ...@@ -159,9 +158,7 @@ h3{
font-size: calc(10px + (12 - 10) * ((100vw - 360px) / (1600 - 360))) !important; font-size: calc(10px + (12 - 10) * ((100vw - 360px) / (1600 - 360))) !important;
} }
.form-body{ .form-body{
height: 650px; border-top:2px solid #1c1c1c;
border-top:2px solid #1c1c1c; /*sredina izmedju linije*/
/*border-bottom:3px solid #FFD700; /*sredina izmedju linije*/
} }
.form-holder { .form-holder {
display: flex; display: flex;
...@@ -169,12 +166,9 @@ h3{ ...@@ -169,12 +166,9 @@ h3{
justify-content: center; justify-content: center;
align-items: center; align-items: center;
text-align: center; text-align: center;
min-height: 100vh;
} }
.form-holder .form-content { .form-holder .form-content {
position: relative;
bottom:100px;
text-align: center; text-align: center;
display: -webkit-box; display: -webkit-box;
display: -moz-box; display: -moz-box;
...@@ -492,3 +486,28 @@ img { ...@@ -492,3 +486,28 @@ img {
text-transform: uppercase; text-transform: uppercase;
font-size: 18px; font-size: 18px;
} }
.container-main{
height: 820px;
}
.pozadinaSVG{
background:
linear-gradient(
to bottom,
hsl(0, 0%, 100%) 0%,
hsl(0, 0%, 99.66%) 8.1%,
hsl(0, 0%, 98.69%) 15.5%,
hsl(0, 0%, 97.16%) 22.5%,
hsl(0, 0%, 95.17%) 29%,
hsl(0, 0%, 92.77%) 35.3%,
hsl(0, 0%, 90.04%) 41.2%,
hsl(0, 0%, 87.07%) 47.1%,
hsl(0, 0%, 83.93%) 52.9%,
hsl(0, 0%, 80.72%) 58.8%,
hsl(0, 0%, 77.57%) 64.7%,
hsl(0, 0%, 74.61%) 71%,
hsl(0, 0%, 71.99%) 77.5%,
hsl(0, 0%, 69.89%) 84.5%,
hsl(0, 0%, 68.5%) 91.9%,
hsl(0, 0%, 68%) 100%
);
}
\ No newline at end of file
SkuciSe/src/main/resources/templates/index.html
...@@ -9,6 +9,10 @@ ...@@ -9,6 +9,10 @@
<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='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"> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
<!-- Favicon--> <!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico"/> <link rel="icon" type="image/x-icon" href="assets/favicon.ico"/>
...@@ -87,6 +91,10 @@ ...@@ -87,6 +91,10 @@
</div> </div>
</nav> </nav>
<div class="container-main pozadinaSVG d-flex justify-content-center align-items-center">
<h1 class="animate__animated animate__slideInDown">Dobrodosli</h1>
</div>
<div class="container-fluid pb-0 mb-0 justify-content-center text-light "> <div class="container-fluid pb-0 mb-0 justify-content-center text-light ">
<footer> <footer>
<div class="row my-5 justify-content-center py-5"> <div class="row my-5 justify-content-center py-5">
......
SkuciSe/src/main/resources/templates/lista-korisnika.html
...@@ -86,7 +86,7 @@ ...@@ -86,7 +86,7 @@
</div> </div>
</nav> </nav>
<div class="container d-flex align-items-center justify-content-center flex flex-column h-50"> <div class="container container-main d-flex align-items-center justify-content-center flex-column">
<h1>Spisak korisnika</h1> <h1>Spisak korisnika</h1>
<div class="alert alert-info" th:object="${deleted}" th:if="${deleted == true}"> <div class="alert alert-info" th:object="${deleted}" th:if="${deleted == true}">
<strong>Uspesno!</strong> Uspesno ste obrisali korisnika! <strong>Uspesno!</strong> Uspesno ste obrisali korisnika!
...@@ -139,7 +139,7 @@ ...@@ -139,7 +139,7 @@
</div> </div>
</div> </div>
<div class="container-fluid pb-0 mb-0 justify-content-center text-light "> <div class="container-fluid pb-0 mb-0 justify-content-center text-light">
<footer> <footer>
<div class="row my-5 justify-content-center py-5"> <div class="row my-5 justify-content-center py-5">
<div class="col-11"> <div class="col-11">
......
SkuciSe/src/main/resources/templates/lista-oglasa.html
...@@ -88,22 +88,23 @@ ...@@ -88,22 +88,23 @@
</div> </div>
</nav> </nav>
<div class="container main-section mt-5 mb-5">
<div class="container main-section d-flex flex-row"> <div class="row" th:each="i : ${#numbers.sequence(0, oglasi.size()-1,3)}">
<div class="row" th:each="oglas: ${oglasi}"> <div class="row">
<div class="col w-100"> <div class="col-lg-4" th:if="${oglasi[i].naslov != null}">
<div class="section border bg-white rounded p-2"> <div class="section border bg-white rounded p-2">
<div class="row"> <div class="row">
<div class="col-lg-12 img-section"> <div class="col-lg-12 img-section">
<img src="http://nicesnippets.com/demo/re-image6.jpg" class="p-0 m-0 res-ponsive"> <img src="http://nicesnippets.com/demo/re-image6.jpg" class="p-0 m-0 res-ponsive">
<span class="badge badge-danger add-sens p-2 rounded-0" th:text="${oglasi[i].kvadratura + 'm2'}"></span>
</div> </div>
<div class="col-lg-12 sectin-title"> <div class="col-lg-12 sectin-title">
<h1 class="pt-2 pb-2" th:text="${oglas.naslov}"></h1> <h1 class="pt-2 pb-2" th:text="${oglasi[i].naslov}"></h1>
</div> </div>
<div class="col-lg-12"> <div class="col-lg-12">
<div class="row"> <div class="row">
<div class="col-lg-2"> <div class="col-lg-2">
<span class="badge badge-success p-2" th:text="${oglas.cena} + '$'"></span> <span class="badge badge-success p-2" th:text="${oglasi[i].cena + '$'}"></span>
</div> </div>
<div class="col-lg-10 text-right"> <div class="col-lg-10 text-right">
<span><i class="fas fa-star"></i></span> <span><i class="fas fa-star"></i></span>
...@@ -116,7 +117,7 @@ ...@@ -116,7 +117,7 @@
<hr> <hr>
</div> </div>
<div class="col-lg-12 section-detail"> <div class="col-lg-12 section-detail">
<p class="ml-2" th:text="${oglas.opis}"></p> <p class="ml-2" th:text="${oglasi[i].opis}"></p>
<hr> <hr>
</div> </div>
<div class="col-lg-12 pb-2"> <div class="col-lg-12 pb-2">
...@@ -125,7 +126,92 @@ ...@@ -125,7 +126,92 @@
<a href="#" class="btn btn-danger btn-block btn-sm">Book Now</a> <a href="#" class="btn btn-danger btn-block btn-sm">Book Now</a>
</div> </div>
<div class="col-lg-6"> <div class="col-lg-6">
<a href="#" class="btn btn-secondary btn-block btn-sm">Apply For Rent</a> <a href="#" class="btn btn-info btn-block btn-sm">Apply For Rent</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4" th:if="${oglasi[i+1].naslov != null}">
<div class="section border bg-white rounded p-2">
<div class="row">
<div class="col-lg-12 img-section">
<img src="http://nicesnippets.com/demo/re-image4.jpg">
<span class="badge badge-danger add-sens p-2 rounded-0" th:text="${oglasi[i+1].kvadratura + 'm2'}"></span>
</div>
<div class="col-lg-12 sectin-title">
<h1 class="pt-2 pb-2" th:text="${oglasi[i + 1].naslov}"></h1>
</div>
<div class="col-lg-12">
<div class="row">
<div class="col-lg-2">
<span class="badge badge-success p-2" th:text="${oglasi[i + 1].cena + '$'}"></span>
</div>
<div class="col-lg-10 text-right">
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star-half-alt"></i></span><br>
</div>
</div>
<hr>
</div>
<div class="col-lg-12 section-detail">
<p class="ml-2" th:text="${oglasi[i + 1].opis}"></p>
<hr>
</div>
<div class="col-lg-12 pb-2">
<div class="row">
<div class="col-lg-6">
<a href="#" class="btn btn-danger btn-block btn-sm">Book Now</a>
</div>
<div class="col-lg-6">
<a href="#" class="btn btn-info btn-block btn-sm">Apply For Rent</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4" th:if="${oglasi[i+2].naslov != null}">
<div class="section border bg-white rounded p-2">
<div class="row">
<div class="col-lg-12 img-section">
<img src="http://nicesnippets.com/demo/re-image5.jpeg">
<span class="badge badge-danger add-sens p-2 rounded-0" th:text="${oglasi[i+2].kvadratura + 'm2'}"></span>
</div>
<div class="col-lg-12 sectin-title">
<h1 class="pt-2 pb-2" th:text="${oglasi[i + 2].naslov}"></h1>
</div>
<div class="col-lg-12">
<div class="row">
<div class="col-lg-2">
<span class="badge badge-success p-2" th:text="${oglasi[i+2].cena + '$'}"></span>
</div>
<div class="col-lg-10 text-right">
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star"></i></span>
<span><i class="fas fa-star-half-alt"></i></span><br>
</div>
</div>
<hr>
</div>
<div class="col-lg-12 section-detail">
<p class="ml-2" th:text="${oglasi[i + 2].opis}"></p>
<hr>
</div>
<div class="col-lg-12 pb-2">
<div class="row">
<div class="col-lg-6">
<a href="#" class="btn btn-danger btn-block btn-sm">Book Now</a>
</div>
<div class="col-lg-6">
<a href="#" class="btn btn-info btn-block btn-sm">Apply For Rent</a>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -135,8 +221,6 @@ ...@@ -135,8 +221,6 @@
</div> </div>
</div> </div>
<div class="container-fluid pb-0 mb-0 justify-content-center text-light "> <div class="container-fluid pb-0 mb-0 justify-content-center text-light ">
<footer> <footer>
<div class="row my-5 justify-content-center py-5"> <div class="row my-5 justify-content-center py-5">
...@@ -177,7 +261,9 @@ ...@@ -177,7 +261,9 @@
</div> </div>
</footer> </footer>
</div> </div>
<!-- JavaScript Bundle with Popper --> <!-- JavaScript Bundle with Popper -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></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="//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" <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
......
SkuciSe/src/main/resources/templates/novi-oglas-form.html
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
</nav> </nav>
<div class="form-body d-flex justify-content-center w-100 mt-5" style="height: 600px;"> <div class="form-body d-flex justify-content-center align-items-center w-100">
<div class="row"> <div class="row">
<div class="form-holder"> <div class="form-holder">
<div class="form-content"> <div class="form-content">
......
SkuciSe/src/main/resources/templates/register.html
...@@ -140,7 +140,7 @@ ...@@ -140,7 +140,7 @@
<div class="invalid-feedback">Sifra ne sme biti prazna!</div> <div class="invalid-feedback">Sifra ne sme biti prazna!</div>
</div> </div>
<div class="col-md-12 mt-2" style="color:white;"> <div class="col-md-12" style="color:white;margin-top:16px;">
<input class="form-control" name="image" type="file" id="formFileMultiple" <input class="form-control" name="image" type="file" id="formFileMultiple"
accept="image/png, image/jpeg" multiple/> accept="image/png, image/jpeg" multiple/>
<div class="invalid-feedback">Unesite sliku!</div> <div class="invalid-feedback">Unesite sliku!</div>
......
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