Buck9195/doesitarm
1
0
Fork 0
mirror of https://github.com/ThatGuySam/doesitarm.git synced 2026-05-18 06:44:46 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

#1 Improve shadows scroll performance

Browse source
This commit is contained in:
Sam Carlton 2020-10-29 18:50:15 -05:00
parent d4c1baacb3
commit aefdcc499e
2 changed files with 13 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

14
assets/css/tailwind.css
View file

@ -73,16 +73,24 @@
inset -8rem -8rem 8rem rgba(255, 255, 255, 0.05); inset -8rem -8rem 8rem rgba(255, 255, 255, 0.05);
} }
.neumorphic-shadow-outer,
.hover\:neumorphic-shadow-outer:hover {
/* box-shadow: -0.25rem -0.25rem 0.5rem rgba(255, 255, 255, 0.07); */
box-shadow:
-0.25rem -0.25rem 0.5rem rgba(255, 255, 255, 0.07),
0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.12),
-.75rem -.75rem 1.75rem rgba(255, 255, 255, 0.07),
0.75rem 0.75rem 1.75rem rgba(0, 0, 0, 0.12);
}
.neumorphic-shadow-inner, .neumorphic-shadow-inner,
.hover\:neumorphic-shadow-inner:hover { .hover\:neumorphic-shadow-inner:hover {
/* box-shadow: -0.25rem -0.25rem 0.5rem rgba(255, 255, 255, 0.07); */
box-shadow: box-shadow:
inset -0.25rem -0.25rem 0.5rem rgba(255, 255, 255, 0.07), inset -0.25rem -0.25rem 0.5rem rgba(255, 255, 255, 0.07),
inset 0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.12), inset 0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.12),
inset -.75rem -.75rem 1.75rem rgba(255, 255, 255, 0.07), inset -.75rem -.75rem 1.75rem rgba(255, 255, 255, 0.07),
inset 0.75rem 0.75rem 1.75rem rgba(0, 0, 0, 0.12); inset 0.75rem 0.75rem 1.75rem rgba(0, 0, 0, 0.12);
/* inset 8rem 8rem 8rem rgba(0, 0, 0, 0.05),
inset -8rem -8rem 8rem rgba(255, 255, 255, 0.05); */
} }
.bg-blur, .bg-blur,

4
components/search.vue
View file

@ -32,7 +32,7 @@
<div class="search-results py-8"> <div class="search-results py-8">
<ul class="results-container rounded-lg border border-gray-700 divide-y divide-gray-700 neumorphic-shadow px-5"> <ul class="results-container rounded-lg border border-gray-700 divide-y divide-gray-700 bg-gradient-to-br from-darker to-dark neumorphic-shadow-outer px-5">
<li <li
v-if="results.length === 0" v-if="results.length === 0"
class="text-center py-4" class="text-center py-4"
@ -51,7 +51,7 @@
<div class="min-w-0 flex-1 flex items-center"> <div class="min-w-0 flex-1 flex items-center">
<div class="flex-shrink-0"> <div class="flex-shrink-0">
<div <div
class="h-12 w-12 rounded-full flex items-center justify-center neumorphic-shadow-inner" class="h-12 w-12 rounded-full flex items-center justify-center"
> >
<div>{{ app.name.charAt(0) }}</div> <div>{{ app.name.charAt(0) }}</div>
</div> </div>