dvkei/Pterodactyl-Panel
1
0
Fork 0
forked from Alex/Pterodactyl-Panel
Code Issues Pull Requests Projects Releases Wiki Activity

Finish UI stuff for today

Browse Source
This commit is contained in:
Dane Everitt 2019-02-03 17:45:22 -08:00
parent 89d29cf46b
commit 6c7a5d5bb9
No known key found for this signature in database
GPG Key ID: EEA66103B3D71F53
6 changed files with 27 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
resources/assets/scripts/components/server/subpages/Console.ts
View File

@ -159,7 +159,7 @@ export default Vue.component('server-console', {
},
template: `
<div class="content-box animate fadein">
<div class="animate fadein shadow-md">
<div class="text-xs font-mono">
<div class="rounded-t p-2 bg-black overflow-scroll w-full" style="min-height: 16rem;max-height:64rem;">
<div class="mb-2 text-grey-light" ref="terminal" v-if="connected"></div>

32
resources/assets/scripts/components/server/subpages/FileManager.ts
View File

@ -115,7 +115,7 @@ export default Vue.component('file-manager', {
},
template: `
<div class="content-box animate fadein">
<div class="animate fadein">
<div class="filemanager-breadcrumbs">
/<span class="px-1">home</span><!--
-->/<router-link :to="{ name: 'server-files' }" class="px-1">container</router-link><!--
@ -128,24 +128,24 @@ export default Vue.component('file-manager', {
</span>
</span>
</div>
<div v-if="loading">
<div class="spinner spinner-xl blue"></div>
</div>
<div v-else-if="!loading && errorMessage">
<div class="alert error" v-text="errorMessage"></div>
</div>
<div class="filemanager" v-else>
<div class="header">
<div class="flex-none w-8"></div>
<div class="flex-1">Name</div>
<div class="flex-1 text-right">Size</div>
<div class="flex-1 text-right">Modified</div>
<div class="flex-none w-1/6">Actions</div>
<div class="content-box">
<div v-if="loading">
<div class="spinner spinner-xl blue"></div>
</div>
<div v-if="!directories.length && !files.length">
<div v-else-if="!loading && errorMessage">
<div class="alert error" v-text="errorMessage"></div>
</div>
<div v-else-if="!directories.length && !files.length">
<p class="text-grey text-sm text-center p-6 pb-4">This directory is empty.</p>
</div>
<div v-else>
<div class="filemanager" v-else>
<div class="header">
<div class="flex-none w-8"></div>
<div class="flex-1">Name</div>
<div class="flex-1 text-right">Size</div>
<div class="flex-1 text-right">Modified</div>
<div class="flex-none w-1/6">Actions</div>
</div>
<div v-for="directory in directories">
<folder-row :directory="directory"/>
</div>

11
resources/assets/styles/components/filemanager.css
View File

@ -15,11 +15,11 @@
}
&.clickable {
@apply .no-underline;
@apply .no-underline .cursor-pointer;
}
&.active-selection, &.clickable:hover {
@apply .bg-grey-lightest .border-blue-light .text-blue-dark;
@apply .bg-grey-lightest .text-grey-darkest .shadow;
}
& > .icon {
@ -65,13 +65,14 @@
}
.filemanager-breadcrumbs {
@apply .px-4 .py-3 .mb-6 .rounded .border .bg-grey-lightest .text-grey-darker;
@apply .px-4 .py-3 .mb-6 .rounded .bg-white .text-grey-darker .shadow-md;
& a {
@apply .no-underline .text-blue-light;
@apply .no-underline .text-blue;
transition: color 50ms ease-in;
&:hover {
@apply .text-blue-dark;
@apply .text-blue-darker;
}
}
}

2
resources/assets/styles/components/modal.css
View File

@ -4,7 +4,7 @@
transition: opacity 250ms ease;
& > .modal-container {
@apply .relative .p-8 .bg-white .w-full .max-w-md .m-auto .flex-col .flex;
@apply .relative .p-8 .bg-white .w-full .max-w-md .m-auto .flex-col .flex .rounded;
transition: all 250ms ease;
margin-top: 15%;

2
resources/assets/styles/components/navigation.css
View File

@ -1,5 +1,5 @@
.nav {
@apply .bg-blue .border-b .border-t .border-blue-darkest;
@apply .bg-blue-dark .border-b .border-t .border-blue-darkest;
height: 56px;
& .logo {

4
tailwind.js
View File

@ -92,8 +92,8 @@ let colors = {
'blue-lightest': '#E6F6FF',
'blue-lighter': '#BAE3FF',
'blue-light': '#2186EB',
'blue': '#0552B5',
'blue-dark': '#03449E',
'blue': '#0967D2',
'blue-dark': '#0552B5',
'blue-darker': '#01337D',
'blue-darkest': '#002159',