Commit f44e96b6 authored by Corentin Mors's avatar Corentin Mors
Browse files

Fix the rebase and add checklist css and dark theme

parent 9608fa20
......@@ -240,28 +240,43 @@ a[aria-expanded="true"] {
#content.active {
width: calc(100% - 250px);
}
.dark
{
background-color:#112F41;
color: #ffffff;
/** checklist CSS */
.content-input{
height: 500px;
}
.dark .task{
border-color: #878787;
}
.dark .modal-content{
background-color: #1E4363;
.task{
padding: 2px;
margin-top: 10px;
border-radius: 5px;
border: 2px solid #112F41;
}
.dark .btn{
background-color: rgb(28, 136, 204);
.sameHauteur{
align-items: center;
}
.dark .dropdown-menu{
background-color: #1E4363;
/** dark CSS */
.dark {
background-color:#112F41;
color: #ffffff;
}
.dark .task{
border-color: #878787;
}
.dark .modal-content{
background-color: #1E4363;
}
.dark .btn{
background-color: rgb(28, 136, 204);
}
.dark .dropdown-menu{
background-color: #1E4363;
}
.dark .dropdown-item{
color: #ffffff;
.dark .dropdown-item{
color: #ffffff;
}
.dark .card{
background-color: #1E4363;
.dark .card{
background-color: #1E4363;
}
$(document).ready(function(){$("#sidebar").mCustomScrollbar({theme:"minimal"}),$("#sidebarCollapse").on("click",function(){$("#sidebar, #content").toggleClass("active"),$(".collapse.in").toggleClass("in"),$("a[aria-expanded=true]").attr("aria-expanded","false")})}),$(document).ready(function(){var e,o,a;if("geolocation"in navigator){navigator.geolocation.getCurrentPosition(function(t){e=t.coords.latitude,o=t.coords.longitude,a="http://api.openweathermap.org/data/2.5/weather?lat="+e+"&lon="+o+"&units=metric&appid=b231606340553d9174136f7f083904b3",$.ajax({url:a,method:"GET",success:function(e){var o=e.main.temp,a=e.name;e.weather.description;$("#live-weather").html(o+"°C in "+a)}})})}else console.log("Your browser doesn't support geolocation. Sorry.")});
\ No newline at end of file
$("#darkButton").click(function(){$("body").hasClass("dark")?$("body").removeClass("dark"):$("body").addClass("dark")}),$(document).ready(function(){$("#sidebar").mCustomScrollbar({theme:"minimal"}),$("#sidebarCollapse").on("click",function(){$("#sidebar, #content").toggleClass("active"),$(".collapse.in").toggleClass("in"),$("a[aria-expanded=true]").attr("aria-expanded","false")})}),$(document).ready(function(){var a,o,e;if("geolocation"in navigator){navigator.geolocation.getCurrentPosition(function(t){a=t.coords.latitude,o=t.coords.longitude,e="http://api.openweathermap.org/data/2.5/weather?lat="+a+"&lon="+o+"&units=metric&appid=b231606340553d9174136f7f083904b3",$.ajax({url:e,method:"GET",success:function(a){var o=a.main.temp,e=a.name;a.weather.description;$("#live-weather").html(o+"°C in "+e)}})})}else console.log("Your browser doesn't support geolocation. Sorry.")});
\ 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}.box{margin-bottom:20px;border:2px solid #000;border-radius:6px;line-height:40px;text-align:center;padding-top:10px;background-color:#c3cee4}.content-input{height:500px}.article{padding-left:1rem;padding-bottom:1rem}[class*=col-xs]{width:auto}.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto;align-items:center}@media (min-width:768px){.container{width:1170px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}#accordion-faq .card{margin-bottom:10px}.content-box{display:flex;margin:0 0 45px;padding:30px;background-color:#9d9d9d;color:#fff}.card-body{background:#449644;display:flex;justify-content:center;width:auto}.card-body-item{height:100%;width:100%}.card-body-item:nth-child(1){break-after:always}.card-body-item span{font-size:2.5em;color:#fff}.wrapper{display:flex;width:100%}#sidebar{width:250px;margin-left:-250px;position:fixed;top:0;left:0;height:100vh;z-index:999;background:#7386d5;color:#fff;transition:all .3s}#sidebar.active{margin-left:0}#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:100%;padding:40px;min-height:100vh;transition:all .3s;position:absolute;top:0;right:0}#content.active{width:calc(100% - 250px)}.dark{background-color:#112f41;color:#fff}.dark .task{border-color:#878787}.dark .modal-content{background-color:#1e4363}.dark .btn{background-color:#1c88cc}.dark .dropdown-menu{background-color:#1e4363}.dark .dropdown-item{color:#fff}.dark .card{background-color:#1e4363}
\ 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}.box{margin-bottom:20px;border:2px solid #000;border-radius:6px;line-height:40px;text-align:center;padding-top:10px;background-color:#c3cee4}.content-input{height:500px}.article{padding-left:1rem;padding-bottom:1rem}[class*=col-xs]{width:auto}.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto;align-items:center}@media (min-width:768px){.container{width:1170px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}#accordion-faq .card{margin-bottom:10px}.content-box{display:flex;margin:0 0 45px;padding:30px;background-color:#9d9d9d;color:#fff}.card-body{background:#449644;display:flex;justify-content:center;width:auto}.card-body-item{height:100%;width:100%}.card-body-item:nth-child(1){break-after:always}.card-body-item span{font-size:2.5em;color:#fff}.wrapper{display:flex;width:100%}#sidebar{width:250px;margin-left:-250px;position:fixed;top:0;left:0;height:100vh;z-index:999;background:#7386d5;color:#fff;transition:all .3s}#sidebar.active{margin-left:0}#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:100%;padding:40px;min-height:100vh;transition:all .3s;position:absolute;top:0;right:0}#content.active{width:calc(100% - 250px)}.content-input{height:500px}.task{padding:2px;margin-top:10px;border-radius:5px;border:2px solid #112f41}.sameHauteur{align-items:center}.dark{background-color:#112f41;color:#fff}.dark .task{border-color:#878787}.dark .modal-content{background-color:#1e4363}.dark .btn{background-color:#1c88cc}.dark .dropdown-menu{background-color:#1e4363}.dark .dropdown-item{color:#fff}.dark .card{background-color:#1e4363}
\ No newline at end of file
......@@ -3,7 +3,13 @@
/*** Please devide this file in sections ***/
/** Enable dark theme */
$("#darkButton").click(function(){
if ($("body").hasClass("dark"))
$("body").removeClass("dark")
else
$("body").addClass("dark")
});
/*** Lateral menu ***/
$(document).ready(function () {
......
{% extends "layout/base.html" %}
{% block content %}
<main role="main" class="container">
<div class="row">
<div class="col-12">
......@@ -17,7 +15,7 @@
<div class="list-group">
{% for checklist in checklists %}
{% for checklist in checklists %}
<div class="list-group-item list-group-item-action align-items-start list-group-item-flex">
<div class="list-group-item-tools">
<a href="checklists/{{ checklist._id }}" title="Look checklist"><i class="fas fa-eye"></i></a>
......@@ -26,165 +24,16 @@
<div class="list-group-item-content">
<div class="d-flex w-90 justify-content-between">
<h5 class="mb-1">{{ checklist.title }}</h5>
<input type="button" id="darkButton" name="" value="dark">
<!-- Ligne Bouton d'ajout checklist et dropdown -->
<div class="row buttonAdd">
<!--Bouton Add -->
<button type="button" class="mx-auto btn btn-primary" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">Add a new task</button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">New task</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Name of the task</label>
<input type="text" class="form-control" id="task-name">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Description:</label>
<textarea class="form-control" id="task-description"></textarea>
</div>
</form>
</div>
<!--Fin bouton Add -->
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Add the new task</button>
</div>
</div>
</div>
</div>
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Task categories
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Category 1</a>
<a class="dropdown-item" href="#">Category 2</a>
<a class="dropdown-item" href="#">Category 3</a>
</div>
</div>
</div>
<!--Liste task-->
<section class="ListTask">
<!--task 1-->
<div class="task">
<div class="row sameHauteur"> <!--Ligne Nom de la task + checkbox -->
<div class="col-sm-9 col-md-9">
<p class="taskName">Task name</p>
</div>
<div class="col-sm-1 col-md-1">
<input type="checkbox" name="do" value="">
</div>
<div class="col-sm-1 col-md-1"> <!--colonne bouton edit -->
<a href="" data-toggle="modal" data-target="#editModal" data-whatever="@mdo"><i class="fas fa-edit"></i></a>
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Edit Task</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Task Name</label>
<input type="text" class="form-control" id="recipient-name">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Description:</label>
<textarea class="form-control" id="message-text"></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Edit mission</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-1 col-md-1"> <!--colonne checkbox -->
<a data-toggle="collapse" href="#description1" role="button" aria-expanded="false" aria-controls="description1"><i class="far fa-caret-square-down"></i></a>
</div>
</div>
<div class="row espace"><!--Ligne expend bouton (affiche le descriptif de la task)-->
<div class="col-sm-12 col-md-12">
<div class="collapse multi-collapse" id="description1">
<div class="card card-body">
Description Task
</div>
</div>
</div>
</div>
</div>
<!--task 2-->
<div class="task">
<div class="row sameHauteur"> <!--Ligne Nom de la task + checkbox -->
<div class="col-sm-9 col-md-9">
<p class="taskName">Task name</p>
</div>
<div class="col-sm-1 col-md-1">
<input type="checkbox" name="do" value="">
</div>
<div class="col-sm-1 col-md-1"> <!--colonne bouton edit -->
<a href="" data-toggle="modal" data-target="#editModal" data-whatever="@mdo"><i class="fas fa-edit"></i></a>
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Edit Task</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="recipient-name" class="col-form-label">Task Name</label>
<input type="text" class="form-control" id="recipient-name">
</div>
<div class="form-group">
<label for="message-text" class="col-form-label">Description:</label>
<textarea class="form-control" id="message-text"></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Edit mission</button>
</div>
</div>
</div>
<p class="mb-1">{{ checklist.description }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</main><!-- /.container -->
{% endblock %}
{% endblock %}
\ No newline at end of file
......@@ -67,13 +67,4 @@
</section>
</main>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script>
$("#darkButton").click(function(){
if ($("body").hasClass("dark"))
$("body").removeClass("dark")
else
$("body").addClass("dark")
});
</script>
{% endblock %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="ExpressJS + MongoDB + Nunjucks starter kit to kickstart your projects">
<meta name="author" content="">
<link rel="icon" href="favicon.ico">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="ExpressJS + MongoDB + Nunjucks starter kit to kickstart your projects">
<meta name="author" content="">
<link rel="icon" href="favicon.ico">
<title>{% if title %}{{ title }} - StarterKit{% else %}Dashboard - StarterKit{% endif %}</title>
<title>{% if title %}{{ title }} - X-Cockpit{% else %}Dashboard - X-Cockpit{% endif %}</title>
<!--Font OpenSans -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<!-- Fontawesome core CSS -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<!-- Fontawesome core CSS -->
<!-- OpenLayer CSS -->
<link href="/assets/dist/openlayer.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
......@@ -25,9 +23,7 @@
<link href="/assets/dist/style.min.css" rel="stylesheet">
</head>
<body>
<body>
<div class="wrapper">
<!-- Sidebar -->
......@@ -41,20 +37,72 @@
<br>
<h2 style="text-align: center">X-Cockpit</h2>
</div>
</div>
{% block content %}
This is the default content
{% endblock %}
<ul class="list-unstyled components">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/dashboard">Dashboard</a>
</li>
<li>
<a href="#missionSubmenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">Missions</a>
<ul class="collapse list-unstyled" id="missionSubmenu">
<li>
<a href="/missions">All mission</a>
</li>
<li>
<a href="/checklists">Checklists</a>
</li>
<li>
<a href="/resources">Resources</a>
</li>
</ul>
</li>
<li>
<a href="/weather">Weather</a>
</li>
<li>
<a href="/location">Map</a>
</li>
</ul>
</nav>
<!-- Page Content -->
<div id="content">
<button type="button" id="sidebarCollapse" class="btn btn-info">
<i class="fas fa-align-left"></i>
<span>Menu</span>
</button>
<button type="button" id="darkButton" class="btn btn-dark">
<i class="fas fa-moon fa-align-left"></i>
<span>Night Mode</span>
</button>
<span id="live-weather" class="float-right btn btn-dark"></span>
<hr>
{% block content %}
This is the default content
{% endblock %}
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jdenticon@2.1.0" async></script>
</body>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="/assets/dist/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jdenticon@2.1.0" async></script>
<!-- jQuery Custom Scroller CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="/assets/dist/openlayer.min.js" async></script>
<script src="/assets/dist/main.min.js" async></script>
</body>
</html>
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