mirror of
https://github.com/hubHarmony/servii-frontend.git
synced 2024-11-17 21:40:30 +00:00
Merge branch 'master' of https://github.com/hubHarmony/servii-frontend
This commit is contained in:
Charles Le Maux
commit
01ba3fa200
@ -38,8 +38,8 @@ const App = () => {
|
||||
<Route path="*" element={<NotFoundPage />} />
|
||||
</Routes>
|
||||
<ToastContainer
|
||||
position="top-center"
|
||||
autoClose={2500}
|
||||
position="top-right"
|
||||
autoClose={3500}
|
||||
hideProgressBar={false}
|
||||
newestOnTop={false}
|
||||
closeOnClick
|
||||
@ -47,7 +47,7 @@ const App = () => {
|
||||
pauseOnFocusLoss
|
||||
draggable
|
||||
pauseOnHover
|
||||
theme="colored"
|
||||
theme="light"
|
||||
/>
|
||||
</div>
|
||||
</Router>
|
||||
|
||||
@ -102,7 +102,7 @@ const CreateServer = ({ user, onCreateServer, onSubdomainUpdate, onCancel, noSer
|
||||
<option>Version</option>
|
||||
<option value="1.21">1.21</option>
|
||||
</select>
|
||||
<div>
|
||||
<div className={styles.buttonContainer}>
|
||||
<button className={styles.btnServCreate} onClick={handleCreateServer}>
|
||||
Créer
|
||||
</button>
|
||||
|
||||
@ -46,7 +46,6 @@
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
|
||||
.containerNoserveur {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -85,7 +84,7 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btnServCreate{
|
||||
.btnServCreate {
|
||||
width: 15rem;
|
||||
height: 3.5rem;
|
||||
margin-top: 2.5rem;
|
||||
@ -93,10 +92,9 @@
|
||||
font-weight: 900;
|
||||
border-radius: 1rem;
|
||||
background-color: #090325;
|
||||
|
||||
}
|
||||
|
||||
.mainCardCreateServ{
|
||||
.mainCardCreateServ {
|
||||
margin-top: 5rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -107,7 +105,7 @@
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.mainCardSubdomain{
|
||||
.mainCardSubdomain {
|
||||
background-color: #1D1836;
|
||||
padding: 3rem;
|
||||
margin-top: 5rem;
|
||||
@ -115,7 +113,7 @@
|
||||
width: 55rem;
|
||||
}
|
||||
|
||||
.subtitle{
|
||||
.subtitle {
|
||||
font-size: 1.2rem;
|
||||
color: #AAA6C3;
|
||||
font-weight: 600;
|
||||
@ -123,7 +121,7 @@
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.inputsubdomain{
|
||||
.inputsubdomain {
|
||||
width: 50rem;
|
||||
padding: 1rem;
|
||||
margin-top: 1rem;
|
||||
@ -133,3 +131,83 @@
|
||||
color: white;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
|
||||
.buttonContainer{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 1.8rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.input, .select {
|
||||
width: 100%;
|
||||
padding: 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.btnSubCreate, .btnServCreate {
|
||||
margin-top: 2rem;
|
||||
padding: 1rem 2.5rem;
|
||||
font-size: 1rem;
|
||||
margin-right: 2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mainCardNoserveur {
|
||||
padding: 2rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.nsTitle {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.nsSubTitle {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.btnnoServCreate {
|
||||
width: 100%;
|
||||
height: 3.5rem;
|
||||
font-size: 1.5rem;
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.btnServCreate {
|
||||
width: 100%;
|
||||
height: 2.5rem;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.mainCardCreateServ {
|
||||
margin-top: 3rem;
|
||||
padding: 1.5rem;
|
||||
width: 35rem;
|
||||
}
|
||||
|
||||
.mainCardSubdomain {
|
||||
padding: 2rem;
|
||||
margin-top: 3rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.inputsubdomain {
|
||||
width: 100%;
|
||||
padding: 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
@ -30,7 +30,7 @@
|
||||
background-color: #008d5f;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
padding: 1rem 1.6rem;
|
||||
border-radius: 0.6rem;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
@ -42,7 +42,7 @@
|
||||
background-color: #8d213e;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
padding: 1rem 1.6rem;
|
||||
border-radius: 0.6rem;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
|
||||
@ -1,83 +1,116 @@
|
||||
/* ServerDetails.module.scss */
|
||||
.serverDetailsContainer {
|
||||
padding-top: var(--navbar-height);
|
||||
background-color: var(--main-bg-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: var(--text-color);
|
||||
}
|
||||
padding-top: var(--navbar-height);
|
||||
background-color: var(--main-bg-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: var(--text-color);
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.details {
|
||||
margin-top: 5rem;
|
||||
padding: 3rem;
|
||||
padding-top: 0;
|
||||
background-color: var(--card-bg-color);
|
||||
width: 100%;
|
||||
max-width: 60rem;
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.formGroup {
|
||||
margin-bottom: 2.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.formGroup label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 1.2rem;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.formGroup input,
|
||||
.formGroup select {
|
||||
width: 100%;
|
||||
padding: 1.2rem;
|
||||
height: 3.5rem;
|
||||
background-color: var(--input-bg-color);
|
||||
border: 1px solid var(--input-border-color);
|
||||
border-radius: 0.5rem;
|
||||
color: var(--text-color);
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.4rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.saveButton,
|
||||
.quitButton {
|
||||
padding: 1.2rem 2.5rem;
|
||||
color: var(--button-text-color);
|
||||
border: none;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
font-size: 1.2rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.saveButton {
|
||||
background-color: var(--button-bg-color);
|
||||
}
|
||||
|
||||
.quitButton {
|
||||
background-color: gray;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.saveButton:hover {
|
||||
background-color: var(--button-bg-hover-color);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: red;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.details h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.details {
|
||||
margin-top: 5rem;
|
||||
padding: 3rem;
|
||||
padding-top: 0rem;
|
||||
background-color: var(--card-bg-color);
|
||||
width: 60rem;
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.formGroup {
|
||||
margin-bottom: 2.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.formGroup label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 1.2rem;
|
||||
font-size: 1.4rem;
|
||||
width: 90%;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.formGroup input,
|
||||
.formGroup select {
|
||||
width: calc(100% - 2px);
|
||||
padding: 1.2rem;
|
||||
height: 3.5rem;
|
||||
background-color: var(--input-bg-color);
|
||||
border: 1px solid var(--input-border-color);
|
||||
border-radius: 0.5rem;
|
||||
color: var(--text-color);
|
||||
font-size: 1.2rem;
|
||||
box-sizing: border-box;
|
||||
height: 3rem;
|
||||
font-size: 1rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.saveButton {
|
||||
padding: 1.2rem 2.5rem;
|
||||
background-color: var(--button-bg-color);
|
||||
color: var(--button-text-color);
|
||||
border: none;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
font-size: 1.2rem;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.quitButton{
|
||||
padding: 1.2rem 2.5rem;
|
||||
background-color: gray;
|
||||
color: var(--button-text-color);
|
||||
border: none;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
font-size: 1.2rem;
|
||||
align-self: flex-start;
|
||||
margin-left: 3rem;
|
||||
}
|
||||
|
||||
.saveButton:hover {
|
||||
background-color: var(--button-bg-hover-color);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: red;
|
||||
font-size: 1.2rem;
|
||||
.saveButton,
|
||||
.quitButton {
|
||||
padding: 1rem 2rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.details h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 3rem;
|
||||
font-size: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.formGroup input[type="number"],
|
||||
.formGroup input[type="text"],
|
||||
.formGroup select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { getAuth } from 'firebase/auth';
|
||||
import {Bounce, toast} from "react-toastify";
|
||||
import { Bounce, toast } from "react-toastify";
|
||||
|
||||
const apiUrl: string = 'https://www.servii.fr/api';
|
||||
|
||||
@ -69,17 +69,30 @@ class serviiApi {
|
||||
}
|
||||
return { return_code: status, message: json };
|
||||
}
|
||||
toast.info(json.message, {
|
||||
position: "top-center",
|
||||
autoClose: 2500,
|
||||
|
||||
let toastType: 'success' | 'error' | 'info';
|
||||
let toastColor: string;
|
||||
|
||||
if (status >= 200 && status < 300) {
|
||||
toastType = 'success';
|
||||
} else if (status >= 400 && status < 600) {
|
||||
toastType = 'error';
|
||||
} else {
|
||||
toastType = 'info';
|
||||
}
|
||||
|
||||
toast[toastType](json.message, {
|
||||
position: "top-right",
|
||||
autoClose: 3500,
|
||||
hideProgressBar: false,
|
||||
closeOnClick: true,
|
||||
pauseOnHover: true,
|
||||
draggable: true,
|
||||
progress: undefined,
|
||||
theme: "colored",
|
||||
theme: "light",
|
||||
transition: Bounce,
|
||||
});
|
||||
|
||||
return { return_code: status, message: json.message };
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user