m3tam3re/fabric
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

made gui look a little nicer

Browse Source
This commit is contained in:
Jonathan Dunn 2024-04-01 10:14:45 -04:00
parent 7eb5f953d7
commit 7e3e38ee18
2 changed files with 31 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
installer/client/gui/index.html
View File

@ -46,8 +46,10 @@
</nav>
<main>
<div class="container" id="my-form">
<select class="form-control" id="patternSelector"></select>
<select class="form-control" id="modelSelector"></select>
<div class="selector-container">
<select class="form-control" id="patternSelector"></select>
<select class="form-control" id="modelSelector"></select>
</div>
<textarea
rows="5"
class="form-control"

32
installer/client/gui/static/stylesheet/style.css
View File

@ -37,14 +37,27 @@ body {
border: 1px solid #555; /* Adjusted border color */
padding: 10px; /* Added padding for better text visibility */
}
#patternSelector {
.selector-container {
display: flex;
gap: 10px;
margin-bottom: 10px;
background-color: #424242; /* Darker shade for textarea */
color: #e0e0e0; /* Light text for readability */
border: 1px solid #555; /* Adjusted border color */
padding: 10px; /* Added padding for better text visibility */
}
#patternSelector,
#modelSelector {
flex: 1;
background-color: #424242;
color: #e0e0e0;
border: 1px solid #555;
padding: 10px;
height: 40px;
}
.light-theme #modelSelector {
background-color: #fff;
color: #333;
border: 1px solid #ddd;
}
@media (min-width: 768px) {
.container {
@ -78,6 +91,7 @@ body {
.hidden {
display: none;
}
.drag-over {
background-color: #505050; /* Slightly lighter than the regular background for visibility */
border: 2px dashed #007bff; /* Dashed border with the primary button color for emphasis */
@ -123,6 +137,7 @@ body.light-theme .navbar-toggler-icon {
padding: 0.25rem 0.5rem; /* Adjust padding for the toggle button */
}
}
#responseContainer {
position: relative; /* Needed for absolute positioning of the child button */
}
@ -158,6 +173,7 @@ body.light-theme .navbar-toggler-icon {
#copyButton:focus {
outline: none;
}
#patternCreatedMessage {
margin-top: 10px;
padding: 10px;
@ -177,8 +193,14 @@ body.light-theme .navbar-toggler-icon {
color: #333;
border: 1px solid #ddd;
}
#patternCreator textarea {
background-color: #424242;
color: #e0e0e0;
border: 1px solid #555;
}
#patternCreator input {
background-color: #424242;
color: #e0e0e0;
border: 1px solid #555;
}