Initial commit with existing project files

custom.css

@@ -0,0 +1,281 @@
+/* Custom CSS for the application */
+
+/* Variables */
+:root {
+    /* Bleu principal */
+    --primary: rgb(13, 110, 253);
+
+    /* Bleu survol */
+    --primary-hover: rgb(10, 88, 202);
+
+    /* Fond principal, gris très léger */
+    --body-bg: #f8f9fa;
+}
+
+/* Couleur de fond principale */
+body {
+    background-color: var(--body-bg);
+}
+
+/* Titres des sections */
+h2 {
+    font-size: 1.2rem;
+    margin: 3rem 0 1rem;
+}
+
+/* Mettre en bleu toutes les icônes */
+.icon-blue {
+    color: var(--primary);
+    transition: all .2s;
+
+    /* Gestion au survol */
+    &:hover:not(.fa-filter, .fa-file-excel) {
+        color: var(--primary-hover);
+        font-weight: 700;
+        transform: scale(110%);
+        cursor: pointer;
+
+    }
+}
+
+/* Colonnes d'en-tête */
+th {
+    position: relative;
+
+    .fa-sort {
+        position: absolute;
+        top: 33%;
+        right: 3%;
+        transition: all .2s;
+
+        &:hover {
+            cursor: pointer;
+        }
+    }
+}
+
+/* En-tête du site */
+#header-nav {
+    /*background-color: rgba(13, 110, 253, .1);*/
+    width: 100%;
+    padding: 1rem;
+
+    #logo {
+        font-size: 1.5rem;
+        p {
+            font-size: .8rem;
+            font-weight: 700;
+        }
+    }
+
+    #btn-logout {
+        margin-left: 2rem;
+    }
+}
+
+/* Bouton d'ajout d'un lieu de recharge */
+#btn-add-location {
+    margin-top: .5rem;
+}
+
+/* "Carte" lieu de recharge */
+.location-card {
+    border: 2px solid black;
+    padding: 15px;
+
+    &:first-child {
+        margin-bottom: .5rem;
+    }
+
+    a {
+        width: fit-content;
+    }
+
+    .location-card-title {
+        width: fit-content;
+        margin: 0 auto;
+
+    }
+
+    .location-card-actions {
+        margin-left: 3rem;
+    }
+
+    .location-card-title, .station-card {
+        border: 2px solid rgba(0, 0, 0, .2);
+        padding: .5rem;
+    }
+
+    /* Borne */
+    .station {
+
+        .station-info, .station-card {
+            margin: 1rem;
+        }
+
+        .station-name {
+            font-weight: 500;
+        }
+
+        .station-media {
+            font-size: 1.5rem;
+
+            i {
+                margin: .2rem
+            }
+        }
+    }
+}
+
+/* Sur-en-tête tableau réservations passées  */
+.booking-action-bar {
+
+    span:first-of-type {
+
+        i {
+            font-size: 1.2rem;
+        }
+
+        button {
+            border: none;
+            background-color: transparent;
+        }
+    }
+
+    .date-selector input {
+        margin: .5rem;
+
+    }
+
+    #btn-filter {
+        background-color: #FFF;
+        border: 2px solid rgba(0, 0, 0, .2);
+        padding: .2rem 1.5rem;
+        font-weight: 500;
+        transition: all .2s;
+
+        &:hover {
+            border: 2px solid rgba(0, 0, 0, 0);
+            background-color: rgba(0, 0, 0, .2);
+            color: #FFF;
+        }
+    }
+}
+
+.table-actions {
+    a:last-child {
+        margin-left: 1rem;
+    }
+}
+
+/* Pagination desktop des tableaux */
+.table-nav {
+
+    i {
+        font-size: 1.2rem;
+        font-weight: 700;
+    }
+
+    .chevron-single-left,
+    .chevron-double-left {
+        margin-right: 2rem;
+
+        &:hover {
+            cursor: pointer;
+        }
+    }
+
+    .chevron-single-right,
+    .chevron-double-right {
+        margin-left: 2rem;
+
+        &:hover {
+            cursor: pointer;
+        }
+    }
+}
+
+/* Pagination mobile */
+.table-nav-mobile {
+    a {
+        color: rgba(0, 0, 0, .7);
+        transition: all .2s;
+
+        &:hover {
+            color: rgba(0, 0, 0, 1);
+        }
+    }
+}
+
+/*
+.table-nav {
+    position: relative;
+    font-weight: 600;
+
+    &::before, &::after {
+        font-size: 1.5rem;
+        position: absolute;
+        top: -15%;
+    }
+
+    &::before {
+        content: "<<";
+        left: 37%;
+    }
+
+    &::after {
+        content: ">>";
+        right: 37%;
+    }
+
+    p {
+        position: relative;
+        font-weight: 500;
+
+        &::before, &::after {
+            font-size: 1.5rem;
+            position: absolute;
+            top: -25%;
+        }
+
+        &::before {
+            content: "<";
+            left: -50%;
+        }
+
+        &::after {
+            content: ">";
+            right: -50%;
+        }
+    }
+}
+ */
+
+/* Comportement exclusif desktop */
+@media all and (min-width: 768px) {
+
+    #section-locations {order: 1}
+
+    #section-current-bookings {}
+
+    #section-passed-bookings {}
+
+    #section-requested-undone-bookings {order: 2}
+
+    #section-requested-done-bookings {order: 2}
+
+    /* Désactivation pagination mobile en mode desktop */
+    .table-nav-mobile {
+        display: none!important;
+    }
+
+}
+
+/* Comportement exclusif mobile */
+@media all and (max-width: 767px) {
+
+    /* Désactivation pagination desktop en mode mobile */
+    .table-nav {
+        display: none!important;
+    }
+}