Skynet/misc_pterodactyl-panel
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Cleanup more filemanager design

Browse source
This commit is contained in:
Dane Everitt 2019-02-09 17:26:08 -08:00
parent caca6cff8a
commit 8385ec7feb
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
3 changed files with 30 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
resources/assets/scripts/components/server/components/filemanager/FileContextMenu.ts
View file

@ -25,6 +25,12 @@ export default Vue.component('file-context-menu', {
</div> </div>
<div class="action">Copy</div> <div class="action">Copy</div>
</div> </div>
<div class="context-row">
<div class="icon">
<icon name="download" class="h-4"/>
</div>
<div class="action">Download</div>
</div>
</div> </div>
<div> <div>
<div class="context-row"> <div class="context-row">
@ -41,12 +47,6 @@ export default Vue.component('file-context-menu', {
</div> </div>
</div> </div>
<div> <div>
<div class="context-row">
<div class="icon">
<icon name="download" class="h-4"/>
</div>
<div class="action">Download</div>
</div>
<div class="context-row danger"> <div class="context-row danger">
<div class="icon"> <div class="icon">
<icon name="delete" class="h-4"/> <icon name="delete" class="h-4"/>

18
resources/assets/styles/components/filemanager.css
View file

@ -31,14 +31,15 @@
} }
.context-menu { .context-menu {
@apply .absolute .bg-white .py-2 .border .rounded .text-neutral-800 .text-sm .cursor-pointer; @apply .absolute .bg-white .py-2 .border .border-neutral-300 .shadow-lg .rounded .text-neutral-600 .text-sm .cursor-pointer;
& > div:not(:last-of-type) { & > div:not(:last-of-type) {
@apply .border-b .border-neutral-50 .pb-2 .mb-2; @apply .border-b .border-neutral-100 .pb-2 .mb-2;
} }
& .context-row { & .context-row {
@apply .flex .flex-row .items-center .py-2 .px-8 .border-t .border-b .border-transparent; @apply .flex .flex-row .items-center .py-2 .px-8 .mx-2 .rounded;
transition: background-color 50ms linear;
& > .icon { & > .icon {
@apply .flex-none; @apply .flex-none;
@ -53,11 +54,16 @@
} }
&:hover { &:hover {
@apply .bg-neutral-50 .border-t .border-b .border-neutral-100; @apply .bg-neutral-50 .text-neutral-800;
} }
&.danger:hover { &.danger {
@apply .bg-red-50 .border-t .border-b .border-red-100; @apply .border .border-transparent;
transition: border 50ms linear;
&:hover {
@apply .bg-red-50 .border-red-100;
}
} }
} }

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

@ -69,7 +69,7 @@
transition: border-left-color 250ms linear, color 250ms linear; transition: border-left-color 250ms linear, color 250ms linear;
@apply .block .px-4 .py-3 .border-l-3 .border-neutral-100 .no-underline .text-neutral-400 .font-medium; @apply .block .px-4 .py-3 .border-l-3 .border-neutral-100 .no-underline .text-neutral-400 .font-medium;
&:hover, &.router-link-exact-active { &:hover, &.router-link-exact-active, &.router-link-active {
@apply .text-neutral-800; @apply .text-neutral-800;
} }
@ -77,6 +77,17 @@
@apply .border-primary-500 .cursor-default; @apply .border-primary-500 .cursor-default;
} }
} }
/**
* Because of how the router works the first sidebar link is always active
* since that is the container for all of the server things. Override the
* style for active links if its the first one and not an exact route match.
*/
&:first-of-type > a {
&.router-link-active:not(.router-link-exact-active) {
@apply .border-neutral-100 .text-neutral-400 .cursor-pointer;
}
}
} }
} }
} }