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

fix css

Browse Source
This commit is contained in:
AntoninoP 2024-07-18 13:52:42 +02:00
parent 810d190f31
commit 607a7d04cb
1 changed files with 100 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

164
src/pages/ServerDetails/ServerDetails.module.scss
View File

@ -1,83 +1,107 @@
/* ServerDetails.module.scss */
.serverDetailsContainer { .serverDetailsContainer {
padding-top: var(--navbar-height); padding-top: var(--navbar-height);
background-color: var(--main-bg-color); background-color: var(--main-bg-color);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
color: var(--text-color); 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;
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 { .details {
margin-top: 5rem; width: 90%;
padding: 3rem; padding: 2rem;
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;
} }
.formGroup input, .formGroup input,
.formGroup select { .formGroup select {
width: calc(100% - 2px); height: 3rem;
padding: 1.2rem; font-size: 1rem;
height: 3.5rem; padding: 1rem;
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;
} }
.saveButton { .saveButton,
padding: 1.2rem 2.5rem; .quitButton {
background-color: var(--button-bg-color); padding: 1rem 2rem;
color: var(--button-text-color); font-size: 1rem;
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;
} }
.details h1 { .details h1 {
font-size: 2.5rem; font-size: 2rem;
margin-bottom: 3rem; margin-bottom: 2rem;
} }
}