Skip to content

2
2018_web_app
Commit 9fda1425 by gema
Options

ajusters loading page

parent 16d7683e
Showing with 164 additions and 208 deletions
fuel/app/views/layout/template.twig
......@@ -34,7 +34,6 @@
<div class="cs-loader">
<div class="cs-loader-logo" >
<img src="assets/img/logos/inutralia.png" class="img-responsive-custom">
</div>
<div class="cs-loader-inner">
<label> ●</label>
<label> ●</label>
......@@ -44,6 +43,8 @@
<label> ●</label>
</div>
</div>
</div>
<!--menú vertical y horizontal-->
{% include 'layout/menu.twig' %}
......
fuel/app/views/layout/template_dashboard.twig
......@@ -34,7 +34,6 @@
<div class="cs-loader">
<div class="cs-loader-logo" >
<img src="assets/img/logos/inutralia.png" class="img-responsive-custom">
</div>
<div class="cs-loader-inner">
<label> ●</label>
<label> ●</label>
......@@ -45,6 +44,8 @@
</div>
</div>
</div>
<!--menú vertical y horizontal-->
{% include 'layout/menu_dashboard.twig' %}
......
public/assets/css/custom.css
......@@ -239,8 +239,6 @@ input:checked + .slider:before {
left:10px;
padding:10px;
}
}
/*----------------------------------------------------*/
......@@ -278,9 +276,9 @@ input:checked + .slider:before {
.btn-delete{background-color: #c83737}
/*----------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*------------TABS PERSONALIZADOS, PARA MENÚS CON COLORES CORPORATIVOS. PARA LA TAB DEL MENÚ PERSONALIZADO Y PARA LAS DE LOS MENÚS SALUDABLES------------------*/
/*-------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.nav-tabs-menu-personalizado>li.active>a, .nav-tabs-menu-personalizado>li.active>a:focus, .nav-tabs-menu-personalizado>li.active>a:hover {
color: #fff;
......@@ -392,9 +390,9 @@ input:checked + .slider:before {
}
/*----------------------------------------------------*/
/*-------------TEXTOS, PADINGS, MARGINS------------------*/
/*-------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*---------------------------------TEXTOS, PADINGS, MARGINS----------------------*/
/*------------------------------------------------------------------------------*/
h1{
font-size:2.5em!important;
......@@ -531,14 +529,14 @@ a:focus {
font-size:20px;
}
}
/*****************************************************************************/
/**********************************CHECKBOX Y RADIOBUTTON CUSTOM*****************/
/***************************************************************************************/
/**********************************CHECKBOX Y RADIOBUTTON CUSTOM************************/
/***************************************************************************************/
.ac-custom {
padding: 0 2em;
max-width:100%;
}
.ac-custom label {
display: inline-block;
position: relative;
......@@ -585,7 +583,7 @@ a:focus {
.ac-custom input[type="radio"]:checked + label::before {
opacity: 0.8;
}
/*trazado radio button*/
/*******************trazado radio button******/
.ac-custom svg path {
stroke: #92bb00;
stroke-width: 13px;
......@@ -645,8 +643,10 @@ a:focus {
padding: 15px 5px 15px 5px;
}
}
/*----------------------------------------------GIF CARGA DE PAGINA----------------------*/
/******************************************************************************************/
/*----------------------------------------------GIF CARGA DE PAGINA----------------------*/
/******************************************************************************************/
.cs-loader {
z-index: 9999;
......@@ -657,25 +657,18 @@ a:focus {
left: 0;
height:100vh;
width: 100%;
display:flex;
align-items:center;
justify-content:center;
}
.cs-loader-logo {
position:absolute;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
text-align:center;
top:250px;
}
.cs-loader-inner {
transform: translateY(-50%);
top: 350px;
/*position: absolute;*/
margin-top:40px;
width: calc(100% - 200px);
color: #C966CD;
padding: 0 100px;
......@@ -764,19 +757,143 @@ a:focus {
/**********************************************************************************************************************************/
/*********************************************LOGIN***********************************************************************************/
/*.box-login {*/
/*position: absolute;*/
/*left: 50%;*/
/*top: 50%;*/
/*transform: translate(-50%, -50%);*/
/*width: 30%;*/
/*height: 60%;*/
/*padding: 20px;*/
/*text-align: center;*/
/*box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);*/
/*}*/
/****************************************************************************************************************************************/
@media (max-width:639px){
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 60%;
padding: 10px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 640px) and (max-width: 736px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width:737px) and (max-width: 991px){
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media(min-width: 992px)and (max-width: 1199px){
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1199px)and (max-width: 1367px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1368px)and (max-width: 1598px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 50%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1599px)and (max-width: 1599px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1600px)and (max-width: 1930px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height:45%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1935px) {
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 40%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-MAIN MENU HORIZONTAL NAVBAR*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
......@@ -810,8 +927,9 @@ a:focus {
font-size:18px;
}
}
/**********************************************************************************************************************/
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-DASHBOARD, HOME*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/**********************************************************************************************************************/
.text-btn-home{
color:#fff;
}
......@@ -824,7 +942,6 @@ a:focus {
animation: bounce 1s;
/*transition: all 0.3s ease-in-out;*/
/*transform: scale(0.8);*/
}
.btn-home:hover {
......@@ -914,8 +1031,9 @@ a:focus {
}
}
/*----------------------------------------*/
/*----------------------------------------------------------------*/
/*----------CUADRÍCULA CUADRADOS MISMA ALTURA HOME--------------*/
/******************************************************************/
.col-container {
display: table;
......@@ -936,8 +1054,9 @@ a:focus {
}
}
/*************************************************************************************************************************/
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-FILTROS RECETARIO*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/******************************************************************************************************************************/
.mt-arrow-filters{
margin-top:-40px;
......@@ -966,8 +1085,9 @@ a:focus {
position: relative;
z-index: 9;
}
/****************************************************************************************************************************************/
/****************************************************LISTADO DE ARTICULOS***************************************************************/
/******************************************************************************************************************************************/
.date-box{
position:absolute;
top:0;
......@@ -1046,169 +1166,3 @@ a:focus {
}
}
/*-*-*-*---*-*-*--*-*-*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*RESPONSIVE-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*---*-*-*-*-*-*/
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_vertical iphone 3, 4, 5 **_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
/*@media (width: 320px) {*/
@media (min-width: 318px) and (max-width: 329px) {
}
/*v**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_vertical androids peques**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media (min-width: 330px) and (max-width: 374px) {
}
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_horizontal iphone 3, 4, 5 **_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media (min-width: 479px) and (max-width: 569px) {
}
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_vertical iphone 6 u 6plis **_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media (min-width: 374px) and (max-width: 639px) {
}
@media (max-width:639px){
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 60%;
padding: 10px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
/**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_horizontal iphone 6 y 6plus **_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media (min-width: 640px) and (max-width: 736px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_ Small devices (tablets, 768px and up) **_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media (min-width:737px) and (max-width: 991px){
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_ ipad 3/4 horizontal 1024x 768**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_*/
@media(min-width: 992px)and (max-width: 1199px){
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
/***_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_ po típico 1366x768**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_**_*_ */
@media (min-width: 1199px)and (max-width: 1367px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1368px)and (max-width: 1598px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 50%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1599px)and (max-width: 1599px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 60%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1600px)and (max-width: 1930px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height:45%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
@media (min-width: 1935px) {
/*********************************************LOGIN***********************************************************************************/
.box-login {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 30%;
height: 40%;
padding: 20px;
text-align: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}
}
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