Reformatage du calendrier

This commit is contained in:
Vincent Vandemeulebrouck 2023-01-08 23:21:14 +01:00
parent 404539a004
commit 9349e81580
2 changed files with 54 additions and 49 deletions

View File

@ -1596,7 +1596,7 @@ div.competence-column div.categorie-competence{
padding-bottom: 20px; padding-bottom: 20px;
} }
.calendar-btn-container-left{ .calendar-btn-container-left{
width: 20%; width: 25%;
display: grid; display: grid;
float: left; float: left;
margin: 2px; margin: 2px;
@ -1604,7 +1604,7 @@ div.competence-column div.categorie-competence{
color: rgba(0, 0, 0, 0.5); color: rgba(0, 0, 0, 0.5);
} }
.calendar-btn-container-right{ .calendar-btn-container-right{
width: 20%; width: 15%;
display: grid; display: grid;
float: right; float: right;
margin: 2px; margin: 2px;
@ -1627,54 +1627,55 @@ div.competence-column div.categorie-competence{
} }
.calendar-1min{ .calendar-1min{
grid-row: 1; grid-row: 1;
grid-column: 1; grid-column: 1;
margin-left: 0.2rem;
} }
.calendar-5min{ .calendar-5min{
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 2;
} }
.calendar-10min{ .calendar-15min{
grid-row: 2; grid-row: 1;
grid-column: 1; grid-column: 3;
margin-left: 10px; margin-right: 0.2rem;
}
.calendar-20min{
grid-row: 2;
grid-column: 2;
margin-left: 10px;
}
.calendar-lyre{
grid-row: 1;
grid-column: 1;
height: fit-content;
text-align: center;
vertical-align: center;
}
.calendar-vaisseau{
grid-row: 1;
grid-column: 2;
height: fit-content;
text-align: center;
vertical-align: center;
} }
.calendar-30min{ .calendar-30min{
grid-row: 2; grid-row: 2;
grid-column: 1; grid-column: 1;
height: fit-content; margin-left: 0.2rem;
text-align: center; }
vertical-align: center;
.calendar-60min{
grid-row: 2;
grid-column: 2;
} }
.calendar-1heure{ .calendar-1heure{
grid-row: 2; grid-row: 2;
grid-column: 2; grid-column: 3;
height: fit-content; margin-right: 0.2rem;
text-align: center; }
vertical-align: center;
.calendar-lyre{
grid-row: 1;
grid-column: 1;
margin-left: 0.2rem;
margin-right: 0.2rem;
}
.calendar-vaisseau{
grid-row: 2;
grid-column: 1;
margin-left: 0.2rem;
margin-right: 0.2rem;
}
.img-calendar-forward{
color: rgba(255, 255, 255, 0.5);
vertical-align: bottom;
max-width: 1.2em;
max-height: 1.2em;
border-width: 0;
} }
.calendar-btn-container-left:hover{ .calendar-btn-container-left:hover{

View File

@ -1,8 +1,8 @@
<div id="calendar-time-container"> <div id="calendar-time-container">
<div class="calendar"> <div class="calendar">
{{#if isGM}} {{#if isGM}}
<i class="calendar-btn-edit fas fa-cog" title="Editer"></i> <i class="calendar-btn-edit fa-solid fa-calendar-pen" title="Editer"></i>
<i class="astrologie-btn-edit fas fa-cog" title="Astrologie"></i> <i class="astrologie-btn-edit fa-solid fa-moon-over-sun" title="Astrologie"></i>
{{/if}} {{/if}}
<div class="calendar-hdr"> <div class="calendar-hdr">
<p id="calendar-move-handle" class="calendar-date-rdd" title="Deplacer">{{jourDuMois}} {{mois.label}} ({{mois.saison}})</p> <p id="calendar-move-handle" class="calendar-date-rdd" title="Deplacer">{{jourDuMois}} {{mois.label}} ({{mois.saison}})</p>
@ -10,10 +10,12 @@
<div class="calendar-container"> <div class="calendar-container">
{{#if isGM}} {{#if isGM}}
<div class="calendar-btn-container-left"> <div class="calendar-btn-container-left">
<i class="calendar-btn calendar-1min fas fa-angle-right" data-calendar-avance="1" title="Avancer de 1 minute"></i> <i class="calendar-btn calendar-1min" data-calendar-avance="1" title="Avancer de 1 minute">+1</i>
<i class="calendar-btn calendar-5min fas fa-angle-double-right" data-calendar-avance="5" title="Avancer de 5 minutes"></i> <i class="calendar-btn calendar-5min" data-calendar-avance="5" title="Avancer de 5 minutes">+5</i>
<i class="calendar-btn calendar-10min fas fa-play" data-calendar-avance="10" title="Avancer de 10 minutes"></i> <i class="calendar-btn calendar-15min" data-calendar-avance="15" title="Avancer de 15 minutes">+15</i>
<i class="calendar-btn calendar-20min fas fa-step-forward" data-calendar-avance="20" title="Avancer de 20 minutes"></i> <i class="calendar-btn calendar-30min" data-calendar-avance="30" title="Avancer de 30 minutes">+30</i>
<i class="calendar-btn calendar-60min" data-calendar-avance="60" title="Avancer de 60 minutes" >+60</i>
<i class="calendar-btn calendar-1heure" data-calendar-avance="120" title="Avancer d'1 heure" >+1h</i>
</div> </div>
{{else}} {{else}}
<div class="calendar-btn-container-left"> <div class="calendar-btn-container-left">
@ -30,10 +32,12 @@
</div> </div>
{{#if isGM}} {{#if isGM}}
<div class="calendar-btn-container-right"> <div class="calendar-btn-container-right">
<i class="calendar-btn calendar-30min fas fa-forward" data-calendar-avance="30" title="Avancer de 30 minutes" ></i> <i class="calendar-btn calendar-lyre fas fa-forward" data-calendar-set="6" title="Avancer à Lyre">
<i class="calendar-btn calendar-1heure fas fa-fast-forward" data-calendar-avance="120" title="Avancer d'1 heure" ></i> <img class="img-calendar-forward" src="systems/foundryvtt-reve-de-dragon/icons/heures/hd07.svg" alt="Avancer à Lyre"/>
<i class="calendar-btn calendar-vaisseau fas fa-sun" data-calendar-set="0" title="Avancer au Vaisseau"></i> </i>
<i class="calendar-btn calendar-lyre fas fa-moon" data-calendar-set="6" title="Avancer à Lyre"></i> <i class="calendar-btn calendar-vaisseau fas fa-forward" data-calendar-set="0" title="Avancer au Vaisseau">
<img class="img-calendar-forward" src="systems/foundryvtt-reve-de-dragon/icons/heures/hd01.svg" alt="Avancer au Vaisseau"/>
</i>
</div> </div>
{{/if}} {{/if}}
</div> </div>