DevFW-CICD/spring-petclinic
16
0
Fork 1
mirror of https://github.com/spring-projects/spring-petclinic.git synced 2025-07-25 00:25:50 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #79 from cheapy-ispp/019-responsiveJsps#67

Browse source 
Avance en mejora de responsive jsps
This commit is contained in:
davsotpon 2021-04-10 02:05:10 +02:00 committed by GitHub
commit c10ecb7458
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 436 additions and 387 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/main/less/cheapy.less
View file

@ -216,9 +216,15 @@ img.img-responsive{
padding: 20px;
}
.btn-home{
display: table;
margin: 0 auto;
.btn-block {
display: block;
width: 25%;
}
.btn-home {
display: flex;
justify-content: center;
align-items: center;
}
.btn-home button {
@ -227,7 +233,6 @@ img.img-responsive{
color: white;
padding: 10px 24px;
cursor: pointer;
width: 100%;
display: block;
}
@ -240,9 +245,12 @@ img.img-responsive{
background-color: rgb(40, 140, 215);
}
.btn-home{
display: table;
margin: 0 auto;
.btn-home-max button {
padding: 20px;
margin-left:auto;
margin-right: auto;
margin-bottom: 20px;
}
.btn-create button {
@ -342,6 +350,13 @@ text-align: center;
float:left;
}
.btn-menu button {
margin-left:auto;
margin-right: auto;
margin-bottom: 20px;
margin-right: 20px;
}
.btns-edit{
display: table;
margin: 0 auto;
@ -356,10 +371,6 @@ text-align: center;
cursor: pointer;
}
.btns-edit button:not(:last-child) {
border-bottom: none;
}
.btns-edit button:hover {
background-color: rgb(40, 140, 215);
@ -518,6 +529,14 @@ text-align: center;
color: rgb(29, 142, 226);
}
.row-full{
width: 100vw;
position: relative;
margin-left: -50vw;
height: 100px;
left: 50%;
}
.alert-success {
.alert-variant(fade(@alert-success-bg, 70%); @alert-success-border; @alert-success-text);
}

9
src/main/less/responsive.less
View file

@ -38,4 +38,13 @@
margin-bottom: 30px;
}
.btn-home button {
background-color: rgb(0, 64, 128);
border: 1px solid rgb(0, 0, 160);
color: white;
padding: 10px 24px;
cursor: pointer;
width: 70%;
display: block;
}
}

6
src/main/webapp/WEB-INF/jsp/login.jsp
View file

@ -94,7 +94,7 @@
background-color: #56baed;
border: none;
color: white;
padding: 15px 80px;
padding: 15px;
text-align: center;
text-decoration: none;
display: inline-block;
@ -110,6 +110,7 @@
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
width: 60%;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
@ -143,6 +144,7 @@
transition: all 0.5s ease-in-out;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
margin: 0 auto;
}
input[type=text]:focus {
@ -292,7 +294,9 @@
<input type="text" id="username" class="fadeIn second" name="username" placeholder="Usuario" required autofocus>
<input type="password" id="password" class="fadeIn third" name="password" placeholder="Contraseña" required>
<sec:csrfInput />
<div style="text-align: center;">
<input type="submit" class="fadeIn fourth" value="Iniciar sesión">
</div>
</form>
<!-- Remind Passowrd

8
src/main/webapp/WEB-INF/jsp/offers/myOffersList.jsp
View file

@ -12,6 +12,7 @@
<p id="vacio" >No hay ninguna oferta por plato específico creada.</p>
</c:if>
<c:if test="${not empty foodOfferLs }">
<div class="table-responsive">
<table id="foodOfferTable" class="table table-striped">
<thead>
<tr>
@ -55,12 +56,14 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="nuOffers"/></h2>
<c:if test="${empty nuOfferLs }">
<p id="vacio" >No hay ninguna oferta por número de comensales creada.</p>
</c:if>
<c:if test="${not empty nuOfferLs }">
<div class="table-responsive">
<table id="nuOfferTable" class="table table-striped">
<thead>
<tr>
@ -101,6 +104,7 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="speedOffers"/></h2>
@ -108,6 +112,7 @@
<p id="vacio" >No hay ninguna oferta por tiempo empleado en comer creada.</p>
</c:if>
<c:if test="${not empty speedOfferLs }">
<div class="table-responsive">
<table id="speedOfferTable" class="table table-striped">
<thead>
<tr>
@ -149,6 +154,7 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="timeOffers"/></h2>
@ -156,6 +162,7 @@
<p id="vacio" >No hay ninguna oferta por franja horaria creada.</p>
</c:if>
<c:if test="${not empty timeOfferLs }">
<div class="table-responsive">
<table id="timeOfferTable" class="table table-striped">
<thead>
<tr>
@ -195,5 +202,6 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
</cheapy:layout>

8
src/main/webapp/WEB-INF/jsp/offers/offersList.jsp
View file

@ -14,6 +14,7 @@
<p id="vacio" >No hay ninguna oferta por plato específico activa.</p>
</c:if>
<c:if test="${not empty foodOfferLs }">
<div class="table-responsive">
<table id="foodOfferTable" class="table table-striped">
<thead>
<tr>
@ -61,12 +62,14 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="nuOffers"/></h2>
<c:if test="${empty nuOfferLs }">
<p id="vacio" >No hay ninguna oferta por número de comensales activa.</p>
</c:if>
<c:if test="${not empty nuOfferLs }">
<div class="table-responsive">
<table id="nuOfferTable" class="table table-striped">
<thead>
<tr>
@ -112,6 +115,7 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="speedOffers"/></h2>
@ -119,6 +123,7 @@
<p id="vacio" >No hay ninguna oferta por tiempo empleado en comer activa.</p>
</c:if>
<c:if test="${not empty speedOfferLs }">
<div class="table-responsive">
<table id="speedOfferTable" class="table table-striped">
<thead>
<tr>
@ -165,6 +170,7 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>
<h2 style="text-align:center;padding:5px"><fmt:message key="timeOffers"/></h2>
@ -172,6 +178,7 @@
<p id="vacio" >No hay ninguna oferta por franja horaria activa.</p>
</c:if>
<c:if test="${not empty timeOfferLs }">
<div class="table-responsive">
<table id="timeOfferTable" class="table table-striped">
<thead>
<tr>
@ -217,6 +224,7 @@
</c:forEach>
</tbody>
</table>
</div>
</c:if>

11
src/main/webapp/WEB-INF/jsp/welcome.jsp
View file

@ -9,27 +9,28 @@
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<cheapy:layout pageName="home">
<h2 class="text-center" style="font-family: 'Lobster'; font-size: 60px; color: rgb(0, 64, 128); padding:30px"><fmt:message key="welcome"/></h2>
<h2 class="text-center" style="font-family: 'Lobster'; font-size: 300%; color: rgb(0, 64, 128); padding:30px"><fmt:message key="welcome"/></h2>
<div class="row">
<div class="col-md-12">
<div class="img-home">
<spring:url value="/resources/images/Logo Cheapy.png" htmlEscape="true" var="cheapyImage"/>
<img class="img-responsive" src="${cheapyImage}"/>
</div>
<div class="btn-home-max">
<div class="btn-home">
<button type="button" role="link" onclick="window.location='/offers'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;">
<button type="button" role="link" onclick="window.location='/offers'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;" class="btn-block">
<span class="glyphicon glyphicon-cutlery" aria-hidden="true" style="padding: 5px"> </span>
<fmt:message key="listOffers"/> </button>
</div>
<sec:authorize access="hasAnyAuthority('client')">
<div class="btn-home">
<button type="button" role="link" onclick="window.location='/myOffers'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;">
<button type="button" role="link" onclick="window.location='/myOffers'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;" class="btn-block">
<span class="glyphicon glyphicon-cutlery" aria-hidden="true" style="padding: 5px"> </span>
<fmt:message key="myOffers"/> </button>
</div>
<div class="btn-home">
<button type="button" role="link" onclick="window.location='/offersCreate'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;">
<button type="button" role="link" onclick="window.location='/offersCreate'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;" class="btn-block">
<span class="glyphicon glyphicon-cutlery" aria-hidden="true" style="padding: 5px"> </span>
<fmt:message key="createOffers"/> </button>
</div>
@ -40,7 +41,7 @@
</div>
</sec:authorize>
</div>
<sec:authorize access="hasAnyAuthority('usuario')">
<div class="btn-home">
<button type="button" role="link" onclick="window.location='/usuarios/show'" style="font-family: 'Lobster'; font-size: 20px;margin:5px;">

2
src/main/webapp/WEB-INF/tags/pivotal.tag
View file

@ -2,7 +2,7 @@
<br/>
<br/>
<div class="container">
<div class="row-full">
<div class="row">
<div class="col-12 text-center"><img src="<spring:url value="/resources/images/eslogan.png" htmlEscape="true" />"
alt="Eat fast, eat cheapy"/></div>