charleslemaux/servii-frontend
1
0
Fork 0
mirror of https://github.com/hubHarmony/servii-frontend.git synced 2024-11-18 05:40:31 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

+stylax

Browse Source
This commit is contained in:
AntoninoP 2024-07-03 21:54:21 +02:00
parent df742285ba
commit 915307a245
2 changed files with 43 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/CreateServer/CreateServer.jsx
View File

@ -55,11 +55,12 @@ const CreateServer = ({ user, onCreateServer }) => {
{subdomain === '' ? ( {subdomain === '' ? (
<div className={styles.container}> <div className={styles.container}>
<div className={styles.mainCardSubdomain}> <div className={styles.mainCardSubdomain}>
<div className={styles.Title}>Ecrivez votre sous domaine</div> <div className={styles.title}>Ecrivez votre sous domaine</div>
<div className={styles.SubTitlesdomain}> <div className={styles.subtitle}>
Le sous-domaine est le nom sous lequel vos amis et vous rejoignez le serveur, un peu comme une adresse. Choisissez-le bien, car il n'est pas facilement modifiable ! Le sous-domaine est le nom sous lequel vos amis et vous rejoignez le serveur, un peu comme une adresse. Choisissez-le bien, car il n'est pas facilement modifiable !
</div> </div>
<input <input
className={styles.input}
type="text" type="text"
value={subdomainInput} value={subdomainInput}
onChange={(e) => setSubdomainInput(e.target.value)} onChange={(e) => setSubdomainInput(e.target.value)}
@ -72,15 +73,16 @@ const CreateServer = ({ user, onCreateServer }) => {
) : ( ) : (
<div className={styles.container}> <div className={styles.container}>
<div className={styles.mainCard}> <div className={styles.mainCard}>
<div className={styles.SubTitle}>Création du serveur</div> <div className={styles.title}>Création du serveur</div>
<input <input
className={styles.Input} className={styles.input}
type="text" type="text"
placeholder="Nom du serveur" placeholder="Nom du serveur"
value={serverName} value={serverName}
onChange={(e) => setServerName(e.target.value)} onChange={(e) => setServerName(e.target.value)}
/> />
<select <select
className={styles.select}
name="version" name="version"
id="version-select" id="version-select"
value={serverVersion} value={serverVersion}

51
src/components/CreateServer/CreateServer.module.scss
View File

@ -11,35 +11,50 @@
align-items: start; align-items: start;
flex-direction: column; flex-direction: column;
width: 75rem; width: 75rem;
padding: 4rem 5rem 3rem 5rem;
background-color: #1D1836; background-color: #1D1836;
border-radius: 1.5rem; border-radius: 1.5rem;
} }
.Title{ .title {
font-size: 3.5rem; font-size: 2.5rem;
color: #F2F2F2; color: #F2F2F2;
font-weight: 900; font-weight: 700;
margin-bottom: 1.5rem;
} }
.SubTitle{ .subtitle {
font-size: 1.8rem; font-size: 1.2rem;
color: #AAA6C3; color: #AAA6C3;
font-weight: 300; font-weight: 300;
text-align: center;
margin-bottom: 2rem;
} }
.btnServCreate{ .input, .select {
display: flex; width: 100%;
justify-content: center; padding: 1rem;
align-items: center; margin-top: 1rem;
background-color: #090325; background-color: #090325;
width: 40rem; border: none;
height: 5rem; border-radius: 0.5rem;
color: white; color: white;
margin-top: 5rem; font-size: 1rem;
border: solid 0.1rem #090325;
cursor: pointer;
font-size: 2rem;
font-weight: 900;
border-radius: 1rem;
} }
.btnSubCreate, .btnServCreate {
margin-top: 2rem;
padding: 1rem 2rem;
background-color: #090325;
color: white;
border: none;
border-radius: 0.5rem;
cursor: pointer;
font-size: 1rem;
transition: background-color 0.3s, transform 0.3s;
}
.btnSubCreate:hover, .btnServCreate:hover {
background-color: #120a8f;
transform: scale(1.05);
}