Skip to content

Commit 89d29cf

Browse files
DaneEverittDaneEveritt
committed
Assorted UI tweaking
1 parent a28a988 commit 89d29cf

File tree

5 files changed

+70
-66
lines changed

5 files changed

+70
-66
lines changed

‎resources/assets/scripts/components/server/Server.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -78,20 +78,20 @@ export default Vue.component('server', {
7878
</div>
7979
<div v-else class="container">
8080
<div class="my-6 flex flex-no-shrink rounded animate fadein">
81-
<div class="sidebar border-grey-lighter flex-no-shrink w-1/3 max-w-xs">
81+
<div class="sidebar flex-no-shrink w-1/3 max-w-xs">
8282
<div class="mr-6">
83-
<div class="p-6 text-center bg-white border rounded">
83+
<div class="p-6 text-center bg-white rounded shadow">
8484
<h3 class="mb-2 text-blue font-medium">{{server.name}}</h3>
8585
<span class="text-grey-dark text-sm">{{server.node}}</span>
8686
<power-buttons class="mt-6 pt-6 text-center border-t border-grey-lighter"/>
8787
</div>
8888
</div>
89-
<div class="mt-6 sidenav mr-6 bg-white border rounded">
89+
<div class="mt-6 sidenav mr-6">
9090
<router-link :to="{ name: 'server', params: { id: $route.params.id } }">
91-
<icon name="terminal" class="h-4"></icon> Console
91+
Console
9292
</router-link>
9393
<router-link :to="{ name: 'server-files' }">
94-
<icon name="folder" class="h-4"></icon> Files
94+
File Manager
9595
</router-link>
9696
<!--<router-link :to="{ name: 'server-subusers' }">-->
9797
<!--<icon name="users" class="h-4"></icon> Subusers-->
@@ -100,7 +100,7 @@ export default Vue.component('server', {
100100
<!--<icon name="calendar" class="h-4"></icon> Schedules-->
101101
<!--</router-link>-->
102102
<router-link :to="{ name: 'server-databases' }">
103-
<icon name="database" class="h-4"></icon> Databases
103+
Databases
104104
</router-link>
105105
<!--<router-link :to="{ name: 'server-allocations' }">-->
106106
<!--<icon name="globe" class="h-4"></icon> Allocations-->

‎resources/assets/styles/components/miscellaneous.css‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ code {
4646
* Styling for elements that contain the core page content.
4747
*/
4848
.content-box {
49-
@apply .bg-white .p-6 .border .border-grey-light .rounded;
49+
@apply .bg-white .p-6 .rounded .shadow-md;
5050
}
5151

5252
/**
@@ -82,6 +82,7 @@ code {
8282

8383
.server-card {
8484
@apply .block .no-underline .shadow;
85+
transition: all 100ms ease-in;
8586

8687
& .identifier-icon {
8788
@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 {
110111

111112
& > input[type="text"] {
112113
@apply .w-full .p-3 .rounded .border .text-grey-darker;
114+
transition: border 150ms ease-in;
113115

114116
&:focus {
115117
@apply .border-blue-light;

‎resources/assets/styles/components/navigation.css‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,21 @@
6060
}
6161
}
6262

63+
.sidenav {
64+
a {
65+
@apply .block .no-underline .text-grey-darker .py-2;
66+
transition: color 75ms ease-in;
67+
68+
&:hover {
69+
@apply .text-grey;
70+
}
71+
72+
&.router-link-exact-active {
73+
@apply .font-medium;
74+
}
75+
}
76+
}
77+
/*
6378
.sidenav {
6479
@apply .py-2;
6580
@@ -78,3 +93,4 @@
7893
}
7994
}
8095
}
96+
*/

‎resources/themes/pterodactyl/templates/wrapper.blade.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232

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

‎tailwind.js‎

Lines changed: 44 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -45,31 +45,33 @@ View the full documentation at https://tailwindcss.com.
4545
let colors = {
4646
'transparent': 'transparent',
4747

48-
'black': '#22292f',
49-
'grey-darkest': '#3d4852',
50-
'grey-darker': '#606f7b',
51-
'grey-dark': '#8795a1',
52-
'grey': '#b8c2cc',
53-
'grey-light': '#dae1e7',
54-
'grey-lighter': '#f1f5f8',
55-
'grey-lightest': '#f8fafc',
48+
'black': '#1F2933',
5649
'white': '#ffffff',
57-
58-
'red-lightest': '#f9eded',
59-
'red-lighter': '#e7b6b6',
60-
'red-light': '#d58080',
61-
'red': '#c34949',
62-
'red-dark': '#b04242',
63-
'red-darker': '#752c2c',
64-
'red-darkest': '#3b1616',
65-
66-
'orange-lightest': '#fcf4eb',
67-
'orange-lighter': '#f4d4ae',
68-
'orange-light': '#ecb371',
69-
'orange': '#e49334',
70-
'orange-dark': '#cd842f',
71-
'orange-darker': '#89581f',
72-
'orange-darkest': '#442c10',
50+
'basically-white': '#fafafb',
51+
52+
'grey-lightest': '#F5F7FA',
53+
'grey-lighter': '#E4E7EB',
54+
'grey-light': '#CBD2D9',
55+
'grey': '#9AA5B1',
56+
'grey-dark': '#52606D',
57+
'grey-darker': '#3E4C59',
58+
'grey-darkest': '#323F4B',
59+
60+
'red-lightest': '#FFE3E3',
61+
'red-lighter': '#FFBDBD',
62+
'red-light': '#F86A6A',
63+
'red': '#CF1124',
64+
'red-dark': '#AB091E',
65+
'red-darker': '#8A041A',
66+
'red-darkest': '#610316',
67+
68+
'orange-lightest': '#FFE8D9',
69+
'orange-lighter': '#FFD0B5',
70+
'orange-light': '#F9703E',
71+
'orange': '#DE3A11',
72+
'orange-dark': '#C52707',
73+
'orange-darker': '#AD1D07',
74+
'orange-darkest': '#841003',
7375

7476
'yellow-lightest': '#fbfae9',
7577
'yellow-lighter': '#ede9a7',
@@ -87,37 +89,21 @@ let colors = {
8789
'green-darker': '#34681f',
8890
'green-darkest': '#1a3410',
8991

90-
'teal-lightest': '#ecf7f5',
91-
'teal-lighter': '#b3ded7',
92-
'teal-light': '#7ac5ba',
93-
'teal': '#41ac9c',
94-
'teal-dark': '#3b9b8c',
95-
'teal-darker': '#27675e',
96-
'teal-darkest': '#14342f',
97-
98-
'blue-lightest': '#e7eef5',
99-
'blue-lighter': '#9fbad9',
100-
'blue-light': '#5886bc',
101-
'blue': '#10529f',
102-
'blue-dark': '#0e4a8f',
103-
'blue-darker': '#0a315f',
104-
'blue-darkest': '#051930',
105-
106-
'indigo-lightest': '#f0f1fa',
107-
'indigo-lighter': '#c1c7eb',
108-
'indigo-light': '#939edc',
109-
'indigo': '#6574cd',
110-
'indigo-dark': '#5b68b9',
111-
'indigo-darker': '#3d467b',
112-
'indigo-darkest': '#1e233e',
113-
114-
'purple-lightest': '#f6eaf5',
115-
'purple-lighter': '#dcaad8',
116-
'purple-light': '#c16bba',
117-
'purple': '#a72b9d',
118-
'purple-dark': '#96278d',
119-
'purple-darker': '#641a5e',
120-
'purple-darkest': '#320d2f',
92+
'blue-lightest': '#E6F6FF',
93+
'blue-lighter': '#BAE3FF',
94+
'blue-light': '#2186EB',
95+
'blue': '#0552B5',
96+
'blue-dark': '#03449E',
97+
'blue-darker': '#01337D',
98+
'blue-darkest': '#002159',
99+
100+
'cyan-lightest': '#E1FCF8',
101+
'cyan-lighter': '#C1FEF6',
102+
'cyan-light': '#62F4EB',
103+
'cyan': '#0FB5BA',
104+
'cyan-dark': '#099AA4',
105+
'cyan-darker': '#07818F',
106+
'cyan-darkest': '#05606E',
121107
};
122108

123109
module.exports = {
@@ -188,11 +174,11 @@ module.exports = {
188174

189175
fonts: {
190176
'sans': [
191-
'"Source Sans Pro"',
192-
'system-ui',
193-
'BlinkMacSystemFont',
194177
'-apple-system',
178+
'BlinkMacSystemFont',
195179
'"Helvetica Neue"',
180+
'"Roboto"',
181+
'system-ui',
196182
'sans-serif',
197183
],
198184
'serif': [

0 commit comments

Comments
 (0)