...
 
Commits (5)
......@@ -174,11 +174,13 @@ textarea {
/************** Tool Tip Styles ********************************/
.tooltip {
position: relative;
opacity:100;
cursor: help;
display: inline;
z-index: 1;
}
.tooltip:hover {
text-decoration: underline dotted;
......@@ -193,7 +195,6 @@ textarea {
left: 0;
bottom: calc(100% + 10px);
min-width: 300px;
z-index: 10;
color: #222;
}
.tooltip .tooltip-content:after {
......@@ -231,6 +232,19 @@ dl:nth-child(even) {
/* Navbar stylesheet */
.horizontal-nav {
min-width: 100%;
width: 100%;
height: 5rem;
min-height: 5rem;
position: fixed;
top: 0;
left: 0;
transition: all 0.4s;
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
z-index: 2;
}
.vertical-nav {
min-width: 14rem;
width: 14rem;
......@@ -240,16 +254,33 @@ dl:nth-child(even) {
left: 0;
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
transition: all 0.4s;
z-index: 3;
}
.nav-link {
min-width : 14rem;
#nav-title {
font-size: 3em;
margin-bottom: 1rem;
margin-top: .5rem;
padding: .3rem 3rem;
}
.vertical-nav .nav-link {
min-width: 14rem;
width: 14rem;
font-size: 16px;
padding: 1rem 3rem;
}
.nav-link > img {
margin-right: 10px;
.horizontal-nav .nav-link {
min-width: 1rem;
width: 5rem;
font-size: 16px;
padding: .5rem 1rem;
}
.nav-icon {
padding-right: .4rem;
padding-bottom: .3rem;
}
/* Page content stylesheet */
......@@ -257,10 +288,11 @@ dl:nth-child(even) {
.page-content {
width: calc(100% - 15rem);
margin-left: 15rem;
margin-top: 3rem;
transition: all 0.4s;
}
.page-title {
margin-bottom : 3rem;
padding-bottom: 3rem;
font-variant: small-caps;
}
}
\ No newline at end of file
<navbar>
<progress style="display: none" id="progress" />
<!-- Vertical navbar -->
<div class="vertical-nav bg-light" id="sidebar">
<!-- Horizontal navbar -->
<div class="horizontal-nav bg-light" id="sidebar">
<ul class="nav flex-column bg-light mb-0">
<li class="nav-item bg-light" style="margin-bottom:4em">
<h1>
<a href="." class="nav-link text-dark"></a>
</h1>
<ul class="nav bg-light mb-0">
<li class="nav-item bg-light">
</li>
<li class="nav-item">
<h4>
<a href="." class="{selected: window.location.hash.startsWith('')} nav-link text-dark bg-light"><img src="/explorer/images/Icone_Home.svg" width="18" height="18" class="d-inline-block" alt=""> Accueil</a>
</h4>
</li>
<li class="nav-item">
<h4>
<a href="#rules" class="{selected: window.location.hash.startsWith('#rules')} nav-link text-dark bg-light"><img src="/explorer/images/Icone_Referentiel.svg" width="18" height="18" class="d-inline-block" alt=""> Référentiel</a>
</h4>
</ul>
</div>
<!-- End horizontal navbar -->
<!-- Vertical navbar -->
<div class="vertical-nav bg-light" id="sidebar">
<ul class="nav flex-column bg-light mb-0">
<li class="nav-item bg-light">
<a href="." id="nav-title" class="nav-link text-dark"></a>
</li>
<li class="nav-item">
<h4>
<a href="#financements" class="{selected: window.location.hash.startsWith('#financements')} nav-link bg-light"><img src="/explorer/images/Icone_Financement.svg" width="18" height="18" class="d-inline-block" alt=""> Financements</a>
</h4>
<a href="." class="{selected: window.location.hash.startsWith('')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Home.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Accueil
</a>
</li>
<li class="nav-item">
<h4>
<a href="#simulate" class="{selected: window.location.hash.startsWith('#simulate')} nav-link text-dark bg-light"><img src="/explorer/images/Icone_Simulateur.svg" width="18" height="18" class="d-inline-block" alt=""> Simulateur</a>
</h4>
<a href="#rules" class="{selected: window.location.hash.startsWith('#rules')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Referentiel.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Référentiel
</a>
</li>
<li class="nav-item">
<h4>
<a href="#scenarios" class="{selected: window.location.hash.startsWith('#scenarios')} nav-link text-dark bg-light"><img src="/explorer/images/Icone_Scenarios.svg" width="18" height="18" class="d-inline-block" alt=""> Scénarios</a>
</h4>
<a href="#financements" class="{selected: window.location.hash.startsWith('#financements')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Financement.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Financements
</a>
</li>
<li class="nav-item">
<h4>
<b href="#tools" class="{selected: window.location.hash.startsWith('#tools')} nav-link text-dark bg-light"><img src="/explorer/images/Icone_Outils.svg" width="18" height="18" class="d-inline-block" alt=""> Outils</a>
</h4>
<a href="#simulate" class="{selected: window.location.hash.startsWith('#simulate')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Simulateur.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Simulateur
</a>
</li>
<!--
<li class="nav-item">
<h4>
<a href="#glossary" class="{selected: window.location.hash.startsWith('#glossary')} nav-link bg-light">Glossaire</a>
</h4>
<a href="#scenarios" class="{selected: window.location.hash.startsWith('#scenarios')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Scenarios.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Scénarios
</a>
</li>
<li class="nav-item">
<h4>
<a href="#schema" class="{selected: window.location.hash.startsWith('#schema')} nav-link bg-light">Schéma</a>
</h4>
<a href="#tools" class="{selected: window.location.hash.startsWith('#tools')} nav-link text-dark bg-light">
<img src="/explorer/images/Icone_Outils.svg" width="23" height="23" class="d-inline-block nav-icon" alt="">
Outils
</a>
</li>
-->
</ul>
</div>
<!-- End vertical navbar -->
......@@ -100,4 +101,4 @@
});
</script>
</navbar>
</navbar>
\ No newline at end of file
<rules>
<h2 class="page-title">Règles de gestion</h2>
<aside>
<h2 class="page-title">Règles de gestion</h2>
<rules-menu title="Règles régionales" namespace="région"></rules-menu>
<rules-menu title="Règles nationales" namespace="règles nationales"></rules-menu>
<rules-menu title="Règles des organismes paritaires" namespace="organisme paritaire"></rules-menu>
......
<scenarios>
<h2 class="page-title">Scénarios</h2>
<ul>
<h2 class="page-title">Scénarios</h2>
<li each={ filter in this.filters }><a href="#" onclick={ this.toggle } class='{ on: this.selected_filters && (this.selected_filters.indexOf(filter) != -1) }' title={ filter }>{ filter }</a></li>
</ul>
<div if={ this.selected_filters.length && this.active.length }>
......
......@@ -11,6 +11,8 @@
<link href="https://fonts.googleapis.com/css?family=Lato&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
<link rel="stylesheet" type="text/css" href="app.css">
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<script type="text/javascript" src="mixin/view.mixin.js"></script>
<script type="text/javascript" src="app.js"></script>
......