StarMC/Astral-nook
StarMC/Astral-nook
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Assorted UI tweaking

Browse source
This commit is contained in:
Dane Everitt 2019-02-03 17:27:19 -08:00
parent a28a9887c1
commit 89d29cf46b
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
5 changed files with 67 additions and 63 deletions
Download patch file Download diff file Expand all files Collapse all files

12
resources/assets/scripts/components/server/Server.ts
View file

@ -78,20 +78,20 @@ export default Vue.component('server', {
</div>
<div v-else class="container">
<div class="my-6 flex flex-no-shrink rounded animate fadein">
<div class="sidebar border-grey-lighter flex-no-shrink w-1/3 max-w-xs">
<div class="sidebar flex-no-shrink w-1/3 max-w-xs">
<div class="mr-6">
<div class="p-6 text-center bg-white border rounded">
<div class="p-6 text-center bg-white rounded shadow">
<h3 class="mb-2 text-blue font-medium">{{server.name}}</h3>
<span class="text-grey-dark text-sm">{{server.node}}</span>
<power-buttons class="mt-6 pt-6 text-center border-t border-grey-lighter"/>
</div>
</div>
<div class="mt-6 sidenav mr-6 bg-white border rounded">
<div class="mt-6 sidenav mr-6">
<router-link :to="{ name: 'server', params: { id: $route.params.id } }">
<icon name="terminal" class="h-4"></icon> Console
Console
</router-link>
<router-link :to="{ name: 'server-files' }">
<icon name="folder" class="h-4"></icon> Files
File Manager
</router-link>
<!--<router-link :to="{ name: 'server-subusers' }">-->
<!--<icon name="users" class="h-4"></icon> Subusers-->
@ -100,7 +100,7 @@ export default Vue.component('server', {
<!--<icon name="calendar" class="h-4"></icon> Schedules-->
<!--</router-link>-->
<router-link :to="{ name: 'server-databases' }">
<icon name="database" class="h-4"></icon> Databases
Databases
</router-link>
<!--<router-link :to="{ name: 'server-allocations' }">-->
<!--<icon name="globe" class="h-4"></icon> Allocations-->

4
resources/assets/styles/components/miscellaneous.css
View file

@ -46,7 +46,7 @@ code {
* Styling for elements that contain the core page content.
*/
.content-box {
@apply .bg-white .p-6 .border .border-grey-light .rounded;
@apply .bg-white .p-6 .rounded .shadow-md;
}
/**
@ -82,6 +82,7 @@ code {
.server-card {
@apply .block .no-underline .shadow;
transition: all 100ms ease-in;
& .identifier-icon {
@apply .inline-block .rounded-full .text-white .text-center .leading-none .justify-center .w-8 .h-8 .mr-2 .flex .flex-row .items-center;
@ -110,6 +111,7 @@ code {
& > input[type="text"] {
@apply .w-full .p-3 .rounded .border .text-grey-darker;
transition: border 150ms ease-in;
&:focus {
@apply .border-blue-light;

16
resources/assets/styles/components/navigation.css
View file

@ -60,6 +60,21 @@
}
}
.sidenav {
a {
@apply .block .no-underline .text-grey-darker .py-2;
transition: color 75ms ease-in;
&:hover {
@apply .text-grey;
}
&.router-link-exact-active {
@apply .font-medium;
}
}
}
/*
.sidenav {
@apply .py-2;
@ -78,3 +93,4 @@
}
}
}
*/

2
resources/themes/pterodactyl/templates/wrapper.blade.php
View file

@ -32,7 +32,7 @@
@include('layouts.scripts')
</head>
<body class="{{ $css['body'] ?? 'bg-grey-lighter' }}">
<body class="{{ $css['body'] ?? 'bg-grey-lightest' }}">
@section('content')
@yield('above-container')
<div id="pterodactyl" class="flex flex-col">