mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-29 07:53:23 +00:00
chore: Initial Commit
feat: Gestion des inscriptions [#1] feat(frontend): Création des vues pour le paramétrage de l'école [#2] feat: Gestion du login [#6] fix: Correction lors de la migration des modèle [#8] feat: Révision du menu principal [#9] feat: Ajout d'un footer [#10] feat: Création des dockers compose pour les environnements de développement et de production [#12] doc(ci): Mise en place de Husky et d'un suivi de version automatique [#14]
This commit is contained in:
Luc SORIGNET
22
Back-End/static/css/headings.css
Normal file
22
Back-End/static/css/headings.css
Normal file
@ -0,0 +1,22 @@
|
||||
h1,h2,h3,h4,h5,h6{
|
||||
font-family: var(--font-text);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
h1,h2,h3,h4,h5,h6{
|
||||
color: var(--dark-teal);
|
||||
}
|
||||
|
||||
h1.negative,h2.negative,h3.negative,h4.negative,h5.negative,h6.negative{
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.heading-title{
|
||||
font-size: 2em;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
80
Back-End/static/css/icons.css
Normal file
80
Back-End/static/css/icons.css
Normal file
@ -0,0 +1,80 @@
|
||||
|
||||
/**
|
||||
* ICONS
|
||||
**/
|
||||
.icon{
|
||||
display: block;
|
||||
height: 1.5rem;
|
||||
width: 1.5rem;
|
||||
background-color: #8F8F8F;
|
||||
background: no-repeat;
|
||||
-webkit-mask-size: cover;
|
||||
mask-size: cover;
|
||||
}
|
||||
|
||||
.icon.user-add{
|
||||
mask: url(../img/icons/user-add.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/user-add.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.directbox-send{
|
||||
mask: url(../img/icons/directbox-send.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/directbox-send.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.arrow-square-up{
|
||||
mask: url(../img/icons/arrow-square-up.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/arrow-square-up.svg) no-repeat 50% 50% ;
|
||||
}
|
||||
.icon.arrow-square-down{
|
||||
transform: rotate(180deg);
|
||||
mask: url(../img/icons/arrow-square-up.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/arrow-square-up.svg) no-repeat 50% 50% ;
|
||||
}
|
||||
.icon.book{
|
||||
mask: url(../img/icons/book.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/book.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.briefcase{
|
||||
mask: url(../img/icons/briefcase.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/briefcase.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.calculator{
|
||||
mask: url(../img/icons/calculator.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/calculator.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.key{
|
||||
mask: url(../img/icons/key.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/key.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.receipt-edit{
|
||||
mask: url(../img/icons/receipt-edit.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/receipt-edit.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.teacher{
|
||||
mask: url(../img/icons/teacher.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/teacher.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.user-line{
|
||||
mask: url(../img/icons/user-line.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/user-line.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.user{
|
||||
mask: url(../img/icons/user.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/user.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.user-minus{
|
||||
mask: url(../img/icons/user-minus.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/user-minus.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.profile-add{
|
||||
mask: url(../img/icons/profile-add.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/profile-add.svg) no-repeat 50% 50%;
|
||||
}
|
||||
.icon.edit{
|
||||
mask: url(../img/icons/edit.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/edit.svg) no-repeat 50% 50%;
|
||||
}
|
||||
|
||||
.icon.user-search {
|
||||
mask: url(../img/icons/user-search.svg) no-repeat 50% 50%;
|
||||
-webkit-mask: url(../img/icons/user-search.svg) no-repeat 50% 50%;
|
||||
}
|
||||
506
Back-End/static/css/main.css
Normal file
506
Back-End/static/css/main.css
Normal file
@ -0,0 +1,506 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
|
||||
@import url('./icons.css');
|
||||
@import url('./headings.css');
|
||||
:root{
|
||||
/*Colors*/
|
||||
--deep-blue:#3C87F4;
|
||||
--artic-blue:#DFE9F5;
|
||||
--light_grey:#8F8F8F;
|
||||
--darker-blue:#3572CA;
|
||||
--dark-teal:#011922;
|
||||
--darker-teal:#000E14;
|
||||
--clear-blue:#63A5BF;
|
||||
--lighter-grey:#F5F5F5;
|
||||
|
||||
/*component settings*/
|
||||
--primary-color:var(--dark-teal);
|
||||
--background-color:var(#FFF);
|
||||
--font-color:var(--light_grey);
|
||||
--font-text:"Roboto", sans-serif;
|
||||
--topbar-bg-color:#FFF;
|
||||
--sidebar-item-bg:var(--darker-teal);
|
||||
--sidebar-item-font-color:#FFF;
|
||||
--topbar-item-font-color:#000;
|
||||
--topbar-item-bg-color:#FFF;
|
||||
|
||||
}
|
||||
|
||||
|
||||
body{
|
||||
color:var(--font-color);
|
||||
background:var(--background-color);
|
||||
font-family: var(--font-text);
|
||||
font-size: 16px;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
color:var(--dark-teal)
|
||||
}
|
||||
a.negative{
|
||||
color: var(--clear-blue);
|
||||
}
|
||||
.right{
|
||||
text-align: right;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.sidebar{
|
||||
display: block;
|
||||
width: 300px;
|
||||
background-color: var(--primary-color);
|
||||
border-radius: 0px 1em 1em 0px ;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.sidebar>.itemlogo{
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
}
|
||||
.sidebar>.item{
|
||||
display: block;
|
||||
height: 75px;
|
||||
line-height: 75px;
|
||||
background-color: var(--sidebar-item-bg);
|
||||
color: var(--sidebar-item-font-color);
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar>.item:hover{
|
||||
background-color: var(--clear-blue);
|
||||
color: var(--dark-teal);
|
||||
}
|
||||
.sidebar>.item.active{
|
||||
background-color: #FFF;
|
||||
color: var(--dark-teal);
|
||||
}
|
||||
.sidebar>.item>.icon{
|
||||
background-color: var(--sidebar-item-font-color);
|
||||
line-height: 75px;
|
||||
display: block;
|
||||
float: left;
|
||||
height: 32px;
|
||||
margin-top: 20px;
|
||||
margin-left: 40px;
|
||||
|
||||
}
|
||||
.sidebar>.item:hover>.icon{
|
||||
background-color: var(--dark-teal);
|
||||
}
|
||||
.sidebar>.item.active>.icon{
|
||||
background-color: var(--dark-teal);
|
||||
}
|
||||
|
||||
|
||||
.circle{
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: #FFF;
|
||||
border-radius: 100px;
|
||||
margin: auto;
|
||||
margin-top: 75px;
|
||||
}
|
||||
|
||||
.container{
|
||||
display: block;
|
||||
padding: 20px;
|
||||
position: absolute;
|
||||
width: calc(100% - 340px);
|
||||
top: 0px;
|
||||
bottom:0px;
|
||||
right: 0px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.negative{
|
||||
background-color: var(--dark-teal);
|
||||
color:#FFF
|
||||
}
|
||||
|
||||
.container.full-size{
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
|
||||
.input-wrapper{
|
||||
width: 300px;
|
||||
height: 35px;
|
||||
border-radius: 5px;
|
||||
background-color: #FFF;
|
||||
border-color: #C3C3C3;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
}
|
||||
.input-group>label{
|
||||
font-size: 0.6em;
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #011922;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.negative>.input-group>label{
|
||||
color: #FFF;
|
||||
}
|
||||
.input-wrapper>span.icon-ctn{
|
||||
height: 35px;
|
||||
width: 35px;
|
||||
float: left;
|
||||
background-color: #f3f3f3;
|
||||
vertical-align: middle;
|
||||
border-radius: 8px 35px 35px 8px;
|
||||
}
|
||||
.input-wrapper>span.icon-ctn>.icon{
|
||||
height: 35px;
|
||||
width: 35px;
|
||||
background-size: 20px;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
display: block;
|
||||
margin: auto;
|
||||
background-color: #8F8F8F;
|
||||
}
|
||||
.input-wrapper>input{
|
||||
line-height: 35px;
|
||||
width: calc(100% - 50px);
|
||||
height: 35px;
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
margin-left: 5px;
|
||||
outline: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
.max{
|
||||
width: 100%;
|
||||
}
|
||||
.max-90{
|
||||
width: 90%;
|
||||
}
|
||||
.max-80{
|
||||
width: 80%;
|
||||
}
|
||||
/*
|
||||
* Bouton
|
||||
*/
|
||||
.btn{
|
||||
display: flex;
|
||||
font-family: var(--font-text);
|
||||
background-color: #8F8F8F;
|
||||
color: #FFF;
|
||||
height: 35px;
|
||||
min-width: 75px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
font-size: 1em;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
line-height: 35px;
|
||||
font-size: 0.6em;
|
||||
font-weight: bold;
|
||||
letter-spacing: 15%;
|
||||
vertical-align: middle;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.btn>*{
|
||||
display: flexbox;
|
||||
}
|
||||
.negative>.btn{
|
||||
background-color: #FFF;
|
||||
color: var(--dark-teal);
|
||||
}
|
||||
.btn>.icon{
|
||||
display: inline-block;
|
||||
background-color: #FFF;
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.btn:hover{
|
||||
background-color:#606060;
|
||||
}
|
||||
.btn.primary{
|
||||
background-color: var(--dark-teal);
|
||||
}
|
||||
.negative>.btn.primary{
|
||||
background-color: var(--clear-blue);
|
||||
}
|
||||
.btn.primary:hover{
|
||||
background-color: var(--darker-teal);
|
||||
}
|
||||
|
||||
.negative>.btn.primary:hover{
|
||||
background-color: #3b687a;
|
||||
}
|
||||
|
||||
.logo-circular{
|
||||
margin-top: 50px;
|
||||
text-align: center;
|
||||
width: 125px;
|
||||
height: 125px;
|
||||
border-radius: 125px;
|
||||
background-color: #FFF;
|
||||
}
|
||||
.login-heading{
|
||||
margin-top: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
.login-heading.negative{
|
||||
color: #FFF;;
|
||||
}
|
||||
.login-form{
|
||||
margin-top: 50px;
|
||||
width: 300px;
|
||||
}
|
||||
.form-group-submit{
|
||||
margin-top: 50px;
|
||||
}
|
||||
.centered{
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.centered>*{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.table-action{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.splited-row-table{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 90%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.splited-row-table>thead>tr>th{
|
||||
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
color: #000;
|
||||
}
|
||||
.splited-row-table>tbody>tr{
|
||||
background-color: #f4f4f4;
|
||||
color:#8F8F8F;
|
||||
line-height:50px;
|
||||
}
|
||||
.table-actions .icon{
|
||||
background-color: #8F8F8F;
|
||||
}
|
||||
|
||||
|
||||
.table{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 90%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
}
|
||||
.table>thead>tr>th{
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
color: #48586B;
|
||||
font-weight: bold;
|
||||
text-transform: Capitalise;
|
||||
background-color: #F5F6F8;
|
||||
border-bottom: 1px solid #EBECF0;
|
||||
border-top: 1px solid #EBECF0;
|
||||
}
|
||||
.table>thead>tr>th:first-child{
|
||||
border-radius: 15px 0 0 0;
|
||||
border-left: 1px solid #EBECF0;
|
||||
}
|
||||
.table>thead>tr>th:last-child{
|
||||
border-radius: 0 15px 0 0 ;
|
||||
border-right: 1px solid #EBECF0;
|
||||
}
|
||||
.table>tbody>tr>td>.avatar{
|
||||
height: 42px;
|
||||
width: 42px;
|
||||
border-radius: 42px;
|
||||
background-color: #8F8F8F;
|
||||
display: block;
|
||||
margin: auto;
|
||||
float: left;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.table>tbody>tr>td{
|
||||
padding: 15px;
|
||||
color: #48586B;
|
||||
border-bottom: 1px solid #EBECF0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.table>tbody>tr:nth-child(even)>td{
|
||||
padding: 15px;
|
||||
background-color: #F5F6F8;
|
||||
border-bottom: 1px solid #EBECF0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.table>tbody>tr>td:first-child{
|
||||
border-left: 1px solid #EBECF0;
|
||||
}
|
||||
.table>tbody>tr>td:last-child{
|
||||
border-right: 1px solid #EBECF0;
|
||||
}
|
||||
.table>tfoot>tr>td{
|
||||
padding: 35px;
|
||||
color: #48586B;
|
||||
border-bottom: 1px solid #EBECF0;
|
||||
}
|
||||
.table>tfoot>tr>td:first-child{
|
||||
border-radius: 0 0 0 15px;
|
||||
border-left: 1px solid #EBECF0;
|
||||
}
|
||||
.table>tfoot>tr>td:last-child{
|
||||
border-radius: 0 0 15px 0 ;
|
||||
border-right: 1px solid #EBECF0;
|
||||
}
|
||||
|
||||
.pagination{
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
.pagination>a.item{
|
||||
display: inline-block;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
background-color: #F5F6F8;
|
||||
color: #48586B;
|
||||
margin: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.pagination>a.item.active{
|
||||
background-color: var(--dark-teal);
|
||||
color: #FFF;
|
||||
}
|
||||
.alphabet-filter{
|
||||
text-align: center;
|
||||
}
|
||||
.alphabet-filter>a.item{
|
||||
display: inline-block;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
background-color: #F5F6F8;
|
||||
color: #48586B;
|
||||
margin: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.alphabet-filter>a.item.active{
|
||||
background-color: var(--dark-teal);
|
||||
color: #FFF;
|
||||
}
|
||||
.tag{
|
||||
padding: 5px;
|
||||
display: block;
|
||||
background-color: #F5F6F8;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
color: #48586B;
|
||||
border: 1px solid #48586B;
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
.tag.green{
|
||||
background-color: #E0F5EE;
|
||||
border: 1px solid #4BC097;
|
||||
color: #4BC097;
|
||||
}
|
||||
.tag.red{
|
||||
background-color: #ffe4e4;
|
||||
border: 1px solid #ff6a6a;
|
||||
color: #ff6a6a;
|
||||
}
|
||||
.tag.orange{
|
||||
background-color: #FFF0E4;
|
||||
border: 1px solid #FFB06A;
|
||||
color: #FFB06A;
|
||||
}
|
||||
.tag.purple{
|
||||
background-color: #fae4ff;
|
||||
border: 1px solid #e66aff;
|
||||
color: #e66aff;
|
||||
}
|
||||
.tag.blue{
|
||||
background-color: #E7E9FD;
|
||||
border: 1px solid #7E89F1;
|
||||
color: #7E89F1;
|
||||
}
|
||||
.tag.teal{
|
||||
background-color: #b3f5f9;
|
||||
border: 1px solid #359ab3;
|
||||
color: #359ab3;
|
||||
}
|
||||
|
||||
.icon-btn {
|
||||
display: block;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
text-align: center;
|
||||
line-height: 35px;
|
||||
background-color: #F5F6F8;
|
||||
color: #48586B;
|
||||
border: none;
|
||||
border-radius: 0.5rem;
|
||||
outline: none;
|
||||
}
|
||||
.icon-btn:hover{
|
||||
background-color: #dfe0e1;
|
||||
color: #FFF;
|
||||
}
|
||||
.icon-btn>.icon{
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-size: 20px;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
margin: auto;
|
||||
background-color: #8F8F8F;
|
||||
}
|
||||
.icon-btn.primary{
|
||||
background-color: var(--dark-teal);
|
||||
}
|
||||
.icon-btn.primary>.icon{
|
||||
background-color: #FFF;
|
||||
}
|
||||
.icon-btn.primary:hover{
|
||||
background-color: var(--darker-teal);
|
||||
}
|
||||
.icon-btn.red{
|
||||
background-color: rgb(202, 34, 34);
|
||||
}
|
||||
.icon-btn.red>.icon{
|
||||
background-color: #FFF;
|
||||
}
|
||||
.icon-btn.red:hover{
|
||||
background-color: rgb(148, 25, 25);
|
||||
}
|
||||
|
||||
.actions > .icon-btn{
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.heading-section{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width:90%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
text-align: center;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
Reference in New Issue
Block a user