lucasvbr/Cards-Rush
1
0
Fork 0
mirror of https://github.com/kmitresse/Cards-Rush.git synced 2026-05-16 17:11:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: dev-web - begin front

Browse Source
This commit is contained in:
kmitresse
2024-04-05 18:00:33 +02:00
parent eeea468845
commit a541ba929a
13 changed files with 319 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
S2/DevWeb/Projet/src/main/webapp/static/css/global.css
+39
View File
@@ -0,0 +1,39 @@
:root {
--color-red-800: #991B1B;
--color-rose-700: #BE123C;
--sizes-button-input-nav-larger-padding-v: 12px;
--sizes-button-input-nav-larger-padding-h: 32px;
--sizes-button-input-nav-larger-gap: 12px;
--Button-Border-radius: 8px;
--Button-Light-Default-Border: rgba(255, 255, 255, 0.00);
--Button-Light-Default-Background: rgba(255, 255, 255, 0.30);
}
html{
height: 100%;
width: 100%;
}
body {
width: 100%;
height: 832px;
flex-shrink: 0;
background: url("../img/Home.svg") lightgray 50% / cover no-repeat;
opacity: 0.6;
color: #FFF;
}
a.button, input.button button.button{
display: flex;
padding: var(--sizes-button-input-nav-larger-padding-v) var(--sizes-button-input-nav-larger-padding-h);
justify-content: center;
align-items: center;
gap: var(--sizes-button-input-nav-larger-gap);
border-radius: var(--Button-Border-radius);
border: 1px solid var(--Button-Light-Default-Border);
background: var(--Button-Light-Default-Background);
color: #FFF;
text-decoration: none;
height: fit-content;
}
S2/DevWeb/Projet/src/main/webapp/static/css/index.css
+56
View File
@@ -0,0 +1,56 @@
html{
height: 100%;
}
.content {
display: inline-flex;
flex-direction: column;
align-items: flex-start;
gap: 30px;
padding: 10%
}
h1 {
width: 656px;
height: 122px;
color: #FFF;
font-family: Poppins;
font-size: 48px;
font-style: normal;
font-weight: 900;
line-height: 63px; /* 131.25% */
letter-spacing: 0.48px;
}
p {
width: 389px;
color: #FFF;
/* Text/Medium */
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px; /* 150% */
}
.buttons {
display: flex;
align-items: flex-start;
gap: 30px;
}
a.button{
display: flex;
padding: var(--sizes-button-input-nav-larger-padding-v) var(--sizes-button-input-nav-larger-padding-h);
justify-content: center;
align-items: center;
gap: var(--sizes-button-input-nav-larger-gap);
border-radius: var(--Button-Border-radius);
border: 1px solid var(--Button-Light-Default-Border);
background: var(--Button-Light-Default-Background);
color: #FFF;
text-decoration: none;
}
S2/DevWeb/Projet/src/main/webapp/static/css/login.css
+26 -36
View File
@@ -1,19 +1,13 @@
html {
height: 100%;
display: flex;
align-items: center;
:root {
--spacing-615-rem-24-px: 12px;
}
body {
width: 100%;
}
main {
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
/*Common */
@@ -42,39 +36,35 @@ hr {
}
h1 {
justify-self: center;
}
.flex-column {
display: flex;
flex-direction: column;
justify-content: left;
font-family: Poppins;
font-size: 48px;
font-style: normal;
font-weight: 900;
line-height: 63px; /* 131.25% */
letter-spacing: 0.48px;
}
.login-gap {
gap: 20px;
}
.register-gap {
gap: 75px;
}
#login-form, #register-form {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 8% 2%;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: var(--spacing-615-rem-24-px);
}
#login-submit {
grid-column: 2/2;
grid-row: 3/3;
justify-self: right;
label {
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px; /* 150% */
}
#register-submit {
grid-column: 2/2;
grid-row: 7/7;
justify-self: right;
input {
width: 100%;
}
a {
color: #ffffff;
bold: true;
}
S2/DevWeb/Projet/src/main/webapp/static/css/main-menu.css
+41
View File
@@ -0,0 +1,41 @@
#main {
width: 100%;
display: inline-flex;
height: 392px;
flex-direction: column;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
}
#title {
color: #FFF;
text-align: center;
font-family: Poppins;
font-size: 80px;
font-style: normal;
font-weight: 900;
line-height: 63px; /* 78.75% */
letter-spacing: 0.8px;
}
.main-button {
display: flex;
flex-direction: column;
align-items: center;
gap: 30px;
}
button {
display: flex;
padding: var(--sizes-button-input-nav-larger-padding-v) var(--sizes-button-input-nav-larger-padding-h);
justify-content: center;
align-items: center;
gap: var(--sizes-button-input-nav-larger-gap);
border-radius: var(--Button-Border-radius);
border: 1px solid var(--Button-Light-Default-Border);
background: var(--Button-Light-Default-Background);
color: #FFF;
text-decoration: none;
height: fit-content;
}
S2/DevWeb/Projet/src/main/webapp/static/css/modal.css
-12
View File
@@ -1,17 +1,5 @@
body {
font-family: sans-serif;
padding: 30px;
}
.demo-description {
max-width: 460px;
margin: 0 auto;
line-height: 1.5;
}
.modal-toggle {
cursor: pointer;
color: #268bd2;
}
.modal-wrapper {
S2/DevWeb/Projet/src/main/webapp/static/css/navbar.css
+11 -1
View File
@@ -1,5 +1,15 @@
nav {
display: flex;
justify-content: right;
flex-direction: row;
justify-content: space-between;
padding: 10px;
}
.content {
display: flex;
flex-direction: row;
gap: 40px;
}
p.user{
padding:10px;
}