449 lines
6.9 KiB
CSS
449 lines
6.9 KiB
CSS
body{
|
|
|
|
background-color: #C7F9CC;
|
|
height:100vh;
|
|
|
|
}
|
|
body >.container-fluid{
|
|
height:100vh;
|
|
}
|
|
.container-fluid{
|
|
display:flex;
|
|
flex-direction: column;
|
|
}
|
|
#router-page-wrapper{
|
|
flex:1;
|
|
justify-content:center;
|
|
|
|
height:100%;
|
|
|
|
}
|
|
#router-page-wrapper > .router{
|
|
|
|
height:100%;
|
|
width:100%;
|
|
|
|
}
|
|
#router-page-wrapper > .router >.container-fluid{
|
|
|
|
height:100%;
|
|
}
|
|
|
|
|
|
|
|
.row{
|
|
display:flex;
|
|
flex-direction:row;
|
|
flex-wrap:wrap;
|
|
|
|
}
|
|
.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{
|
|
display:flex;
|
|
flex-direction:column;
|
|
padding:0;
|
|
margin-bottom:10px;
|
|
}
|
|
|
|
.navbar-brand{
|
|
display:none;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.navbar{
|
|
padding-left:0;
|
|
background-color:#00A896;
|
|
}
|
|
|
|
.navbar-default{
|
|
background-color:#00A896;
|
|
}
|
|
#
|
|
|
|
|
|
|
|
|
|
|
|
.navbar-nav >li:first-child >a {
|
|
background-color: #028090;
|
|
box-shadow: 0.5px 0px 0px #FFFFFF;
|
|
font-family: Lobster !important;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-size: 20px;
|
|
#line-height: 9px;
|
|
|
|
/* or 90% */
|
|
#display: flex;
|
|
|
|
#align-items: center;
|
|
#text-align: center;
|
|
|
|
color: #FFFFFF !important;
|
|
}
|
|
|
|
.navbar-nav >li:first-child.active >a {
|
|
#background-color: #028090;
|
|
#color: #FFFFFF !important;
|
|
}
|
|
|
|
|
|
.navbar-nav >li:first-child >a {
|
|
#background-color: #028090;
|
|
# color: #FFFFFF !important;
|
|
}
|
|
|
|
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
|
|
#background-color: #008375;
|
|
#color: #FFFFFF !important;
|
|
#font-family: Fjalla One;
|
|
|
|
}
|
|
.navbar-default .navbar-nav > li > a{
|
|
color: #FFFFFF !important;
|
|
font-family: Fjalla One;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
|
|
.navbar-nav >li:first-child.active >a, .navbar-nav >li:first-child.active >a:hover, .navbar-nav >li:first-child.active >a:focus,.navbar-nav >li:first-child >a:focus,.navbar-nav >li:first-child >a:hover,.navbar-nav >li:first-child >a {
|
|
background-color: #028090;
|
|
color: #FFFFFF !important;
|
|
background-color: #028090;
|
|
box-shadow: 0.5px 0px 0px #FFFFFF;
|
|
font-family: Lobster !important;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-size: 20px;
|
|
}
|
|
|
|
|
|
|
|
|
|
.navbar-nav >li >a:first-child {
|
|
display:none;
|
|
|
|
}
|
|
|
|
|
|
#row-content{
|
|
margin-left:0;
|
|
margin-right:0;
|
|
margin-bottom:auto;
|
|
|
|
}
|
|
|
|
#column-panel{
|
|
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(0, 0, 0, 0.25);
|
|
|
|
background-color:white;
|
|
|
|
}
|
|
|
|
#column-content{
|
|
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(0, 0, 0, 0.25);
|
|
background-color:white;
|
|
|
|
|
|
}
|
|
#column-title{
|
|
width:100%;
|
|
display:flex;
|
|
flex-direction:column;
|
|
justify-content:center;
|
|
align-items:center;
|
|
|
|
|
|
|
|
}
|
|
#row-title{
|
|
display:flex;
|
|
height:30vh;
|
|
width:100vw;
|
|
margin-top:-30px;
|
|
margin-left:-30px;
|
|
margin-right:0;
|
|
background: #F9F3F3;
|
|
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
|
|
border-radius: 0px 0px 10px 10px;
|
|
}
|
|
|
|
#column-title > h1{
|
|
font-family: Lobster !important;
|
|
color:#028090;
|
|
font-size:52px;
|
|
}
|
|
|
|
#row-tiles{
|
|
display:flex;
|
|
justify-content:center;
|
|
margin-top:30px;
|
|
padding:5px;
|
|
min-height:400px;
|
|
}
|
|
|
|
|
|
|
|
|
|
.column-tile{
|
|
height:300px;
|
|
min-height:250px;
|
|
min-width:210px;
|
|
display:flex;
|
|
flex-direction:column;
|
|
width:25%;
|
|
margin-left:15px;
|
|
margin-right:15px;
|
|
background: #00A896;
|
|
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
|
|
border-radius: 20px;
|
|
}
|
|
|
|
#row-tiles > .column-tile:nth-child(2){
|
|
align-self:flex-end;
|
|
background-color:#028090;
|
|
|
|
}
|
|
|
|
|
|
.column-tile > div{
|
|
height:100%;
|
|
width:100%;
|
|
display:flex;
|
|
justify-content:space-between;
|
|
padding-top:20px;
|
|
padding-bottom:15px;
|
|
flex-direction:column;
|
|
align-items:center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.column-tile > div >div
|
|
{
|
|
text-align:center;
|
|
font-size:25px;
|
|
color:white;
|
|
font-family: Fjalla One;
|
|
}
|
|
|
|
|
|
.content-wrapper{
|
|
padding-top:10px;
|
|
padding-bottom:10px;
|
|
padding-left:5px;
|
|
padding-right:5px;
|
|
|
|
}
|
|
|
|
.panel-title{
|
|
display:flex;
|
|
height:40px;
|
|
background-color:#028090;
|
|
color:white;
|
|
justify-content:center;
|
|
align-items:center;
|
|
font-family:Fjalla One;
|
|
}
|
|
|
|
#row-login{
|
|
max-width:600px;
|
|
min-width:300px;
|
|
min-height:300px;
|
|
align-self:center;
|
|
}
|
|
#row-register{
|
|
max-width:600px;
|
|
|
|
align-self:center;
|
|
}
|
|
|
|
#column-login > .well{
|
|
display:flex;
|
|
flex-direction:column;
|
|
background-color:#00A896;
|
|
color:white;
|
|
border:none;
|
|
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
|
|
|
|
}
|
|
#regform{
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
#submit,#loginBtn{
|
|
margin-top:20px;
|
|
align-self:center;
|
|
min-width:25%;
|
|
max-width:40%;
|
|
background-color:#028090;
|
|
color:white;
|
|
font-weight:bold;
|
|
border:none;
|
|
box-shadow: 0px 4px 4px rgb(255 255 255 / 25%);
|
|
}
|
|
|
|
|
|
|
|
.nav-tabs{
|
|
color:white;
|
|
background-color:#028090;
|
|
border-bottom:#028090;
|
|
}
|
|
.nav-tabs > li{
|
|
margin-bottom:0;
|
|
}
|
|
|
|
.nav-tabs > li > a{
|
|
color:white;
|
|
background-color:#028090;
|
|
border:none;
|
|
border-radius:0;
|
|
font-family:Fjalla One;
|
|
}
|
|
|
|
.nav-tabs > li > a:hover {
|
|
color:white;
|
|
background-color:#028090;
|
|
border:none;
|
|
}
|
|
|
|
.nav-tabs > li > a:focus {
|
|
color:white;
|
|
background-color:#028090;
|
|
border:none;
|
|
}
|
|
|
|
.nav-tabs > li {
|
|
border:none;
|
|
border-radius:0;
|
|
}
|
|
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{
|
|
color:#028090;
|
|
background-color:white;
|
|
border:none;
|
|
border-radius:0;
|
|
}
|
|
|
|
|
|
#row-footer{
|
|
height:50px;
|
|
border-top:2px solid white;
|
|
margin-top:auto;
|
|
}
|
|
|
|
#column-copyright{
|
|
padding-left:15px;
|
|
margin:0;
|
|
|
|
}
|
|
#column-copyright > span{
|
|
height:100%;
|
|
color:#00a896;
|
|
|
|
}
|
|
|
|
table.dataTable tr:nth-child(even){
|
|
background-color:#C7F9CC!important;
|
|
}
|
|
table.dataTable tr:nth-child(odd){
|
|
background-color:#A7D7AC !important;
|
|
|
|
}
|
|
|
|
table.dataTable th{
|
|
background-color:white !important;
|
|
}
|
|
.datatables .dataTables_wrapper .dataTables_paginate a{
|
|
border:none;
|
|
|
|
}
|
|
|
|
|
|
.datatables .dataTables_wrapper .dataTables_paginate span > a:hover,.datatables .dataTables_wrapper .dataTables_paginate span > a.current,.datatables .dataTables_wrapper .dataTables_paginate span > a.current:hover,.datatables .dataTables_wrapper .dataTables_paginate > .previous:hover,.datatables .dataTables_wrapper .dataTables_paginate > .next:hover {
|
|
color:white !important;
|
|
background:#05668dff !important;
|
|
border:none;
|
|
box-shadow: 0.5px 0px 0px #FFFFFF;
|
|
|
|
}
|
|
|
|
.datatables .dataTables_wrapper .dataTables_paginate .previous.disabled,.datatables .dataTables_wrapper .dataTables_paginate .next.disabled{
|
|
display:none!important;
|
|
}
|
|
|
|
|
|
@media only screen and (max-width: 767px) {
|
|
body >.container-fluid{
|
|
height:auto;
|
|
min-height:100vh;
|
|
}
|
|
|
|
.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{
|
|
width:100%;
|
|
}
|
|
|
|
#column-panel{
|
|
|
|
min-height:500px;
|
|
|
|
}
|
|
|
|
#column-content{
|
|
|
|
min-height:500px;
|
|
|
|
|
|
|
|
}
|
|
|
|
#row-title{
|
|
display:none;
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
@media only screen and (min-width: 768px) {
|
|
.navbar-nav{
|
|
width:100%;
|
|
margin-left:-15px;
|
|
display:flex !important;
|
|
}
|
|
.navbar-nav > li:nth-last-of-type(2) {
|
|
margin-left:auto;
|
|
}
|
|
.navbar-nav > li:last-of-type,.navbar-nav > li:nth-last-of-type(2) {
|
|
align-self:flex-end;
|
|
|
|
#float:right !important;
|
|
}
|
|
|
|
#row-content{
|
|
justify-content:space-between;
|
|
}
|
|
|
|
#column-panel{
|
|
width:23%;
|
|
height:900px;
|
|
|
|
}
|
|
|
|
#column-content{
|
|
width:73%;
|
|
min-height:900px;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|