diff --git a/src/ui/App.css b/src/ui/App.css index 7e50998..56da799 100644 --- a/src/ui/App.css +++ b/src/ui/App.css @@ -109,6 +109,11 @@ select:focus { margin: 0; text-align: right; + + /* Gradient shadow */ + -webkit-box-shadow: inset 0px -150px 96px -85px rgba(0,0,0,0.43); + -moz-box-shadow: inset 0px -150px 96px -85px rgba(0,0,0,0.43); + box-shadow: inset 0px -150px 96px -85px rgba(0,0,0,0.43); } @media (max-height: 580px) { diff --git a/src/ui/components/ServerLaunchSection.css b/src/ui/components/ServerLaunchSection.css index 97354c9..5be0824 100644 --- a/src/ui/components/ServerLaunchSection.css +++ b/src/ui/components/ServerLaunchSection.css @@ -25,8 +25,10 @@ #serverControls { color: white; - text-shadow: 1px 1px 8px black; + align-self: flex-end; + margin-top: 10px; + margin-bottom: -10px; } .BottomSection .CheckboxDisplay { @@ -55,8 +57,8 @@ .ServerConfig .Checkbox { display: inline-grid; - vertical-align: middle; - margin-left: 8px; + margin-top: 10px; + } .ServerLaunchButtons { @@ -102,8 +104,24 @@ box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.2); } -.ServerConfig .TextInputWrapper { - display: inline-block; +.ServerConfig { + display: grid; + height: 100px; + grid-template-columns: 1; + grid-template-rows: repeat(2, 1fr); + justify-content: flex-end; +} + +.ServerConfigGrid { + display: flex; + justify-content: flex-end; + align-items: center; +} + +#ServerConfigCheckbox { + margin-bottom: -10px; + margin-top: 10px; + } #ip { diff --git a/src/ui/components/ServerLaunchSection.tsx b/src/ui/components/ServerLaunchSection.tsx index c8ef226..0c25523 100644 --- a/src/ui/components/ServerLaunchSection.tsx +++ b/src/ui/components/ServerLaunchSection.tsx @@ -277,30 +277,34 @@ export default class ServerLaunchSection extends React.Component {this.state.grasscutterEnabled && (
- - - - +
+ +
+
+ + + +
)} @@ -314,6 +318,7 @@ export default class ServerLaunchSection extends React.Component )} +