fix style

This commit is contained in:
Anton Romanov 2022-03-08 11:35:39 +04:00
parent 5adcddc40a
commit c2257739ef
5 changed files with 46 additions and 22 deletions

1
.gitignore vendored
View File

@ -4,6 +4,7 @@
.idea .idea
.idea/* .idea/*
.gradle .gradle
out
build build
# Log file # Log file

View File

@ -3,7 +3,7 @@ package ru.ulstu.model;
import java.util.Date; import java.util.Date;
public class News { public class News {
private final static int MAX_NEWS_TEXT_PREVIEW_LENGTH = 100; private final static int MAX_NEWS_TEXT_PREVIEW_LENGTH = 200;
private final String title; private final String title;
private final Date date; private final Date date;
private final String text; private final String text;

View File

@ -1,11 +1,26 @@
@media (min-width: 1200px) {
.container {
max-width: 970px;
}
}
.news { .news {
margin-bottom: 50px; margin-bottom: 50px;
} }
.news-item { .news-item {
margin: 10px; margin: 20px;
position: relative;
text-align: justify;
} }
.news-date { .news-date {
font-size: 10px; font-size: 10px;
position: absolute;
bottom: 0;
right: 25px;
}
.news-image {
width: 300px;
} }

View File

@ -10,7 +10,7 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title th:text="#{messages.app-name}">app-name</title> <title th:text="#{messages.app-name}">app-name</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script type="text/javascript" src="/webjars/jquery/3.6.0/jquery.min.js"></script> <script type="text/javascript" src="/webjars/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript" src="/webjars/bootstrap/4.6.0/js/bootstrap.bundle.min.js"></script> <script type="text/javascript" src="/webjars/bootstrap/4.6.0/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="/webjars/bootstrap-select/1.13.8/js/bootstrap-select.min.js"></script> <script type="text/javascript" src="/webjars/bootstrap-select/1.13.8/js/bootstrap-select.min.js"></script>
@ -20,31 +20,31 @@
<link rel="stylesheet" href="css/main.css"/> <link rel="stylesheet" href="css/main.css"/>
</head> </head>
<body> <body>
<nav class="navbar navbar-expand-lg navbar-light bg-white"> <nav class="navbar navbar-expand-md navbar-light bg-white">
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/">
<img src="img/logo.svg" width="50px"> <img src="img/logo.svg" width="50px">
<div class="navbar-text" th:text="#{messages.logo-title}" style="font-size: 16px"></div> <div class="navbar-text" th:text="#{messages.logo-title}" style="font-size: 16px"></div>
</a> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <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> <span class="navbar-toggler-icon"></span>
</button> </button>
<!-- <div class="collapse navbar-collapse" id="navbarSupportedContent">--> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<!-- <ul class="navbar-nav mr-auto">--> <ul class="navbar-nav mr-auto">
<!-- <li class="nav-item active">--> <li class="nav-item">
<!-- <div th:text="#{messages.app-name}"/>--> <a class="nav-link" href="news">Новости</a>
<!-- </li>--> </li>
<!-- </ul>--> <li class="nav-item">
<!-- </div>--> <a class="nav-link" href="news">Заседания</a>
</nav> </li>
<div class="wrapper"> <li class="nav-item">
<div id="sidebar" class="collapse navbar-collapse sidebar-mobile"> <a class="nav-link" href="news">Отчеты</a>
<ul id="menu" class="list-unstyled"> </li>
</ul> </ul>
</div> </div>
</nav>
<div class="wrapper">
<div id="content"> <div id="content">
<div id="breadcrumbs" class="container-fluid">
</div>
<div class="container-fluid"> <div class="container-fluid">
<ul id="messages" class="feedback-panel"> <ul id="messages" class="feedback-panel">
<div class="alert alert-danger" role="alert" th:if="${error}" th:text="${error}"> <div class="alert alert-danger" role="alert" th:if="${error}" th:text="${error}">

View File

@ -14,9 +14,17 @@
</head> </head>
<div class="container" layout:fragment="content"> <div class="container" layout:fragment="content">
<div th:each="n : ${news}" class="news"> <div th:each="n : ${news}" class="news">
<div class="row">
<div class="col-md-4">
<img class="news-image" src="img/logo.svg"/>
</div>
<div class="col-md-8">
<h5 th:text="${n.title}"/> <h5 th:text="${n.title}"/>
<div th:text="${n.preview}" class="news-item"></div> <div th:text="${n.preview}" class="news-item"></div>
<div th:text="${'Опубликовано: ' + n.date}" class="news-date"></div> <div th:text="${'Опубликовано: ' + #calendars.format(n.date, 'dd.MM.yyyy HH:mm')}"
class="news-date"></div>
</div>
</div>
<hr/> <hr/>
</div> </div>
</div> </div>