pterodactyl/documentation
1
0
Fork 0
mirror of https://github.com/pterodactyl/documentation.git synced 2025-12-10 10:44:43 -06:00
Code Issues Packages Projects Releases Wiki Activity

fix arrow and make it a little lighter

Browse Source
This commit is contained in:
Jakob Schrettenbrunner 2020-04-13 20:34:07 +02:00
parent d6cdc74f79
commit 6b36f8916e
3 changed files with 13 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.vuepress/theme/VersionSelect.vue
View File

@ -2,7 +2,7 @@
<div class="version-select custom-select" :tabindex="tabindex" @blur="open = false"> <div class="version-select custom-select" :tabindex="tabindex" @blur="open = false">
<div class="selected" :class="{open: open}" @click="open = !open"> <div class="selected" :class="{open: open}" @click="open = !open">
<VersionSelectItem :version="selected" /> <VersionSelectItem :version="selected" />
<span class="arrow down"></span> <span class="arrow"></span>
</div> </div>
<div class="items" :class="{hidden: !open}"> <div class="items" :class="{hidden: !open}">
<div <div

2
.vuepress/theme/VersionSelectItem.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="inline-block"> <div class="inline-block">
{{ version.name }} {{ version.name }}
<span class="rounded-full px-2 ml-1" :class="classes">{{version.status}}</span> <span class="rounded-full ml-2" :class="classes">{{version.status}}</span>
</div> </div>
</template> </template>

25
.vuepress/theme/styles/sidebar.css
View File

@ -99,27 +99,24 @@ $arrow-bg: #000;
} }
.selected { .selected {
@apply .select-none .border .cursor-pointer .px-4; @apply .select-none .border .border-grey-lighter .cursor-pointer .px-4;
border-radius: 1rem; border-radius: 1rem;
&:hover { &:hover, &.open {
@apply .border-blue; @apply .bg-grey-lighter .border-grey-lighter;
}
&.open {
@apply .border-blue;
} }
&:after { .arrow {
position: absolute; @apply .inline-block .relative;
content: ""; top: -0.16em;
top: .5em; left: .5em;
right: 10px;
width: 0; width: 0;
height: 0; height: 0;
border: 4px solid transparent; border-left: 4px solid transparent;
border-color: #fff transparent transparent transparent; border-right: 4px solid transparent;
border-top: 6px solid #b8c2cc;
} }
} }
.items { .items {