Commit 2cc0d620 authored by Soulet Corentin's avatar Soulet Corentin
Browse files

Repartition des codes avants merges

parent b5eb4700
/** GLOBAL CSS */
body {
padding-top: 5rem;
background-color: #FFF;
}
/** INDEX CSS */
.contenttype-title{
display: flex;
}
.contenttype-title h3{
flex: 1 0;
}
.contenttype-all-button{
margin-top: 5px;
}
/** LIST CSS */
.list-group-item-flex{
display: flex;
}
.list-group-item-tools{
display: block;
width: 30px;
}
.list-group-item-image{
margin-right: 10px;
}
.list-group-item-content{
flex: 1 0;
}
/** EDIT CSS */
.content-input{
height: 500px;
}
/** Menu CSS */
.wrapper {
display: flex;
width: 100%;
}
#sidebar {
width: 250px;
position: fixed;
top: 0;
left: 0;
height: 100vh;
z-index: 999;
background: #7386D5;
color: #fff;
transition: all 0.3s;
}
#sidebar.active {
margin-left: -250px;
}
#sidebar .sidebar-header {
padding: 20px;
background: #6d7fcc;
}
#sidebar ul.components {
padding: 20px 0;
border-bottom: 1px solid #47748b;
}
#sidebar ul p {
color: #fff;
padding: 10px;
}
#sidebar ul li a {
text-decoration: none;
color: #fff;
padding: 10px;
font-size: 1.1em;
display: block;
}
#sidebar ul li a:hover {
color: #7386D5;
background: #fff;
}
#sidebar ul li.active>a,
a[aria-expanded="true"] {
color: #fff;
background: #6d7fcc;
}
#content {
width: calc(100% - 250px);
padding: 40px;
min-height: 100vh;
transition: all 0.3s;
position: absolute;
top: 0;
right: 0;
}
#content.active {
width: 100%;
}
......@@ -45,183 +45,3 @@ body {
height: 500px;
}
/** Menu CSS */
.wrapper {
display: flex;
width: 100%;
}
#sidebar {
width: 250px;
position: fixed;
top: 0;
left: 0;
height: 100vh;
z-index: 999;
background: #7386D5;
color: #fff;
transition: all 0.3s;
}
#sidebar.active {
margin-left: -250px;
}
#sidebar .sidebar-header {
padding: 20px;
background: #6d7fcc;
}
#sidebar ul.components {
padding: 20px 0;
border-bottom: 1px solid #47748b;
}
#sidebar ul p {
color: #fff;
padding: 10px;
}
#sidebar ul li a {
text-decoration: none;
color: #fff;
padding: 10px;
font-size: 1.1em;
display: block;
}
#sidebar ul li a:hover {
color: #7386D5;
background: #fff;
}
#sidebar ul li.active>a,
a[aria-expanded="true"] {
color: #fff;
background: #6d7fcc;
}
#content {
width: calc(100% - 250px);
padding: 40px;
min-height: 100vh;
transition: all 0.3s;
position: absolute;
top: 0;
right: 0;
}
#content.active {
width: 100%;
}
/** GLOBAL CSS */
.content-box{
display: flex;
margin : 0 0 45px;
padding: 30px;
background-color: #9d9d9d;
}
.card-body {
background: green;
display: flex;
justify-content: center;
width : auto;
}
.card-body-item {
height: 100%;
width: 100%;
}
.card-body-item:nth-child(1) { /* or `:nth-child(n + 4)` */
break-after: always;
}
#heart-rate {
width: auto;
height: auto;
-webkit-animation-name: beating; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
-webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
animation-name: beating;
animation-duration: 1.5s;
animation-iteration-count: infinite;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes beating {
0% {transform: scale(0.1,0.1);}
10% {transform: scale(0.3,0.3)}
20% {transform: scale(0.4,0.4)}
30% {transform: scale(0.6,0.6);}
40% {transform: scale(0.8,0.8);}
50% {transform: scale(1,1);}
60% {transform: scale(0.8,0.8);}
70% {transform: scale(0.6,0.6);}
80% {transform: scale(0.4,0.4);}
90% {transform: scale(0.3,0.3);}
100% {transform: scale(0.2,0.2)}
}
/* Standard syntax */
@-webkit-keyframes beating {
0% {transform: scale(0.3,0.3);}
10% {transform: scale(0.35,0.35);}
20% {transform: scale(0.4,0.4);}
30% {transform: scale(0.45,0.45);}
40% {transform: scale(0.5,0.5);}
50% {transform: scale(0.6,0.6);}
60% {transform: scale(0.7,0.7);}
70% {transform: scale(0.8,0.8);}
80% {transform: scale(0.9,0.9);}
90% {transform: scale(0.95,0.95);}
100% {transform: scale(1,1)}
}
body {
padding-top: 5rem;
}
/** INDEX CSS */
.contenttype-title{
display: flex;
}
.contenttype-title h3{
flex: 1 0;
}
.contenttype-all-button{
margin-top: 5px;
}
/** LIST CSS */
.list-group-item-flex{
display: flex;
}
.list-group-item-tools{
display: block;
width: 30px;
}
.list-group-item-image{
margin-right: 10px;
}
.list-group-item-content{
flex: 1 0;
}
/** EDIT CSS */
.content-input{
height: 500px;
}
body{padding-top:5rem;background-color:#fff}.contenttype-title{display:flex}.contenttype-title h3{flex:1 0}.contenttype-all-button{margin-top:5px}.list-group-item-flex{display:flex}.list-group-item-tools{display:block;width:30px}.list-group-item-image{margin-right:10px}.list-group-item-content{flex:1 0}.content-input{height:500px}.wrapper{display:flex;width:100%}#sidebar{width:250px;position:fixed;top:0;left:0;height:100vh;z-index:999;background:#7386d5;color:#fff;transition:all .3s}#sidebar.active{margin-left:-250px}#sidebar .sidebar-header{padding:20px;background:#6d7fcc}#sidebar ul.components{padding:20px 0;border-bottom:1px solid #47748b}#sidebar ul p{color:#fff;padding:10px}#sidebar ul li a{text-decoration:none;color:#fff;padding:10px;font-size:1.1em;display:block}#sidebar ul li a:hover{color:#7386d5;background:#fff}#sidebar ul li.active>a,a[aria-expanded=true]{color:#fff;background:#6d7fcc}#content{width:calc(100% - 250px);padding:40px;min-height:100vh;transition:all .3s;position:absolute;top:0;right:0}#content.active{width:100%}
\ No newline at end of file
body{padding-top:5rem;background-color:#fff}.contenttype-title{display:flex}.contenttype-title h3{flex:1 0}.contenttype-all-button{margin-top:5px}.list-group-item-flex{display:flex}.list-group-item-tools{display:block;width:30px}.list-group-item-image{margin-right:10px}.list-group-item-content{flex:1 0}.content-input{height:500px}.wrapper{display:flex;width:100%}#sidebar{width:250px;position:fixed;top:0;left:0;height:100vh;z-index:999;background:#7386d5;color:#fff;transition:all .3s}#sidebar.active{margin-left:-250px}#sidebar .sidebar-header{padding:20px;background:#6d7fcc}#sidebar ul.components{padding:20px 0;border-bottom:1px solid #47748b}#sidebar ul p{color:#fff;padding:10px}#sidebar ul li a{text-decoration:none;color:#fff;padding:10px;font-size:1.1em;display:block}#sidebar ul li a:hover{color:#7386d5;background:#fff}#sidebar ul li.active>a,a[aria-expanded=true]{color:#fff;background:#6d7fcc}#content{width:calc(100% - 250px);padding:40px;min-height:100vh;transition:all .3s;position:absolute;top:0;right:0}#content.active{width:100%}.content-box{display:flex;margin:0 0 45px;padding:30px;background-color:#9d9d9d}.card-body{background:green;display:flex;justify-content:center;width:auto}.card-body-item{height:100%;width:100%}.card-body-item:nth-child(1){break-after:always}#heart-rate{width:auto;height:auto;-webkit-animation-name:beating;-webkit-animation-duration:1.5s;-webkit-animation-iteration-count:infinite;animation-name:beating;animation-duration:1.5s;animation-iteration-count:infinite}@-webkit-keyframes beating{0%{transform:scale(.1,.1)}10%{transform:scale(.3,.3)}20%{transform:scale(.4,.4)}30%{transform:scale(.6,.6)}40%{transform:scale(.8,.8)}50%{transform:scale(1,1)}60%{transform:scale(.8,.8)}70%{transform:scale(.6,.6)}80%{transform:scale(.4,.4)}90%{transform:scale(.3,.3)}100%{transform:scale(.2,.2)}}@-webkit-keyframes beating{0%{transform:scale(.3,.3)}10%{transform:scale(.35,.35)}20%{transform:scale(.4,.4)}30%{transform:scale(.45,.45)}40%{transform:scale(.5,.5)}50%{transform:scale(.6,.6)}60%{transform:scale(.7,.7)}70%{transform:scale(.8,.8)}80%{transform:scale(.9,.9)}90%{transform:scale(.95,.95)}100%{transform:scale(1,1)}}body{padding-top:5rem}.contenttype-title{display:flex}.contenttype-title h3{flex:1 0}.contenttype-all-button{margin-top:5px}.list-group-item-flex{display:flex}.list-group-item-tools{display:block;width:30px}.list-group-item-image{margin-right:10px}.list-group-item-content{flex:1 0}.content-input{height:500px}
\ No newline at end of file
body{padding-top:5rem;background-color:#fff}.contenttype-title{display:flex}.contenttype-title h3{flex:1 0}.contenttype-all-button{margin-top:5px}.list-group-item-flex{display:flex}.list-group-item-tools{display:block;width:30px}.list-group-item-image{margin-right:10px}.list-group-item-content{flex:1 0}.content-input{height:500px}
\ No newline at end of file
{% extends "layout/base.html" %}
{% block content %}
<main role="main" class="container-fluid">
<!-- Health Breadcrumbs-->
<ol class="breadcrumb">
<li class="breadcrumb-item">
Health
</li>
</ol>
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Heart rate <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i id="heart-rate" class="fas fa-heart fa-9x" style="color: white;"></i>
</div>
<div class="card-body-item">
<p>BPM</p>
<h1>90</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Heart Rate</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Body Temperature <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-thermometer-half fa-9x"></i>
</div>
<div class="card-body-item">
<p>(°C)</p>
<h1 style="font-size: 50px;">38</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Heart Rate</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
</div>
<!-- Environment Breadcrumbs-->
<p>
<ol class="breadcrumb">
<li class="breadcrumb-item"> Environment</li>
</ol>
</p>
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header"> Méteo <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-sun fa-9x"></i>
</div>
<div class="card-body-item">
<br><br>
<h1>50 °C</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Meteo</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Wind <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-wind fa-9x"></i>
<i style="color: white;" class="fas fa-arrow-up fa-9x"></i>
</div>
<div class="card-body-item">
<br>
<h1>North</h1>
<h1>60 km/h</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Meteo</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
</div>
<!-- Ressources Breadcrumbs-->
<p>
<ol class="breadcrumb">
<li class="breadcrumb-item"> Ressources</li>
</ol>
</p>
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header"> Water Capacity <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-tint fa-9x"></i>
</div>
<div class="card-body-item">
<br><br>
<h1 style="padding-left: 50px">3 m<sup>3</sup> </h1>
<div class="progress">
<div class="progress-bar bg-info" style="width:30%"></div>
</div>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Water Capacity</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Power Capacity <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-bolt fa-9x"></i>
</div>
<div class="card-body-item">
<p>
<br>
<h1 style="padding-left: 50px"> 400 Ah</h1>
<div class="progress">
<div class="progress-bar bg-info" style="width:30%"></div>
</div>
</p>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Electricity Capacity</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
</div>
<br>
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header"> Peoples <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-user fa-9x"></i>
</div>
<div class="card-body-item">
<br><br>
<h1 style="padding-left: 30px">3 m<sup>3</sup> </h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Population</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header"> Food Stock <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i style="color: white;" class="fas fa-utensils fa-9x"></i>
</div>
<div class="card-body-item">
<p>
<br>
<h1 style="padding-left: 50px"> 20.000 kcal</h1>
<div class="progress">
<div class="progress-bar bg-info" style="width:30%"></div>
</div>
</p>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Food Stock</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
</div>
</div>
</main>
{% endblock %}
{% extends "layout/base.html" %}
{% block content %}
<main role="main" class="container-fluid">
<!-- Health Breadcrumbs-->
<ol class="breadcrumb">
<li class="breadcrumb-item">
Health
</li>
</ol>
<link href="/assets/dist/style-index.min.css" rel="stylesheet">
<main role="main" class="container">
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Heart rate <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i id="heart-rate" class="fas fa-heart fa-9x" style="color: #d12128;"></i>
</div>
<div class="card-body-item">
<p>BPM</p>
<h1>90</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Heart Rate</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
<div class=" col-md-4 " style="padding-bottom: 1rem;">
<a href="#" class="btn btn-info btn-block" name="DashBoard">
<span style="font-size: 40px; color: white;"><i class="far fa-list-alt"></span></i>
<h3>DashBoard</h3>
</a>
</div>
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">
<div class="card-header">Body Temperature <span class="float-right"><i class="fas fa-heartbeat"></i></span>
</div>
<div class="card-body">
<div class="card-body-item">
<i class="fas fa-thermometer-half fa-9x"></i>
</div>
<div class="card-body-item">
<p>(°C)</p>
<h1 style="font-size: 50px;">38</h1>
</div>
</div>
<a class="card-footer" href="#">
<span class="float-left">View Details History of Heart Rate</span>
<span class="float-right"><i class="fas fa-angle-right"></i></span>
</a>
</div>
<div class="col-md-4" style="padding-bottom: 1rem;">
<a href="#" class="btn btn-info btn-block" name="DashBoard">
<span style="font-size: 40px; color: white;"><i class="fas fa-map" href="#"></i></span>
<h3 style="font-style: white;"> Map </h3>
</a>
</div>
<div class="col-md-4 " href="#" style="padding-bottom: 1rem;">
<a href="#" class="btn btn-info btn-block" name="DashBoard">
<span style="font-size: 40px; color: white;"><i class="fas fa-check-double"></i></span>
<h3 style="font-style: white;">Check List</h3>
</a>
</div>
</div>
<!-- Environment Breadcrumbs-->
<p>
<ol class="breadcrumb">
<li class="breadcrumb-item"> Environment</li>
</ol>
</p>
<div class="row">
<div class="col-sm">
<!-- Icon Cards-->
<div class="card">