atridad/vue-bits
1
0
Fork 0
mirror of https://github.com/DavidHDev/vue-bits.git synced 2026-03-07 22:49:31 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add prettier config, format codebase

Browse Source
This commit is contained in:
David Haz
2025-07-12 11:59:33 +03:00
parent ac8b2c04d8
commit f4d97ee94e
211 changed files with 10586 additions and 8810 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/pages/CategoryPage.vue
View File

@@ -7,6 +7,7 @@
<template #default>
<component :is="SubcategoryComponent" v-if="SubcategoryComponent" />
</template>
<template #fallback>
<div class="loading-placeholder"></div>
</template>
@@ -18,49 +19,53 @@
</template>
<script setup lang="ts">
import { ref, computed, watch, onMounted, nextTick, defineAsyncComponent } from 'vue'
import { useRoute } from 'vue-router'
import { componentMap } from '../constants/Components'
import { decodeLabel } from '../utils/utils'
import BackToTopButton from '@/components/common/BackToTopButton.vue'
import '../css/category.css'
import { ref, computed, watch, onMounted, nextTick, defineAsyncComponent } from 'vue';
import { useRoute } from 'vue-router';
import { componentMap } from '../constants/Components';
import { decodeLabel } from '../utils/utils';
import BackToTopButton from '@/components/common/BackToTopButton.vue';
import '../css/category.css';
const route = useRoute()
const scrollRef = ref<HTMLDivElement | null>(null)
const route = useRoute();
const scrollRef = ref<HTMLDivElement | null>(null);
const subcategory = computed(() => route.params.subcategory as string)
const decodedLabel = computed(() => decodeLabel(subcategory.value))
const subcategory = computed(() => route.params.subcategory as string);
const decodedLabel = computed(() => decodeLabel(subcategory.value));
const SubcategoryComponent = computed(() => {
if (!subcategory.value) {
return null
return null;
}
const componentLoader = componentMap[subcategory.value as keyof typeof componentMap]
const componentLoader = componentMap[subcategory.value as keyof typeof componentMap];
if (!componentLoader) {
return null
return null;
}
return defineAsyncComponent(componentLoader)
})
return defineAsyncComponent(componentLoader);
});
watch(decodedLabel, (newLabel) => {
if (newLabel) {
document.title = `Vue Bits - ${newLabel}`
}
}, { immediate: true })
watch(
decodedLabel,
newLabel => {
if (newLabel) {
document.title = `Vue Bits - ${newLabel}`;
}
},
{ immediate: true }
);
watch(subcategory, async () => {
if (scrollRef.value) {
await nextTick()
scrollRef.value.scrollTo(0, 0)
await nextTick();
scrollRef.value.scrollTo(0, 0);
}
})
});
onMounted(() => {
if (scrollRef.value) {
scrollRef.value.scrollTo(0, 0)
scrollRef.value.scrollTo(0, 0);
}
})
</script>
});
</script>

42
src/pages/LandingPage.vue
View File

@@ -1,44 +1,48 @@
<template>
<section class="landing-wrapper">
<div v-if="isMobile" class="mobile-hero-background-container" style="z-index: 0;">
<div v-if="isMobile" class="mobile-hero-background-container" style="z-index: 0">
<img
:src="heroImage"
alt="Hero background"
class="mobile-hero-background-image"
style="transform: translateY(-200px);"
style="transform: translateY(-200px)"
/>
</div>
<PlasmaWave :y-offset="-300" :x-offset="100" :rotation-deg="-30" />
<Hero />
<FeatureCards />
<StartBuilding />
<Footer />
</section>
</template>
<script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'
import Hero from '../components/landing/Hero/Hero.vue'
import PlasmaWave from '@/components/landing/PlasmaWave/PlasmaWave.vue'
import Footer from '@/components/landing/Footer/Footer.vue'
import FeatureCards from '@/components/landing/FeatureCards/FeatureCards.vue'
import StartBuilding from '@/components/landing/StartBuilding/StartBuilding.vue'
import heroImage from '@/assets/common/hero.webp'
const isMobile = ref(false)
import { ref, onMounted, onUnmounted } from 'vue';
import Hero from '../components/landing/Hero/Hero.vue';
import PlasmaWave from '@/components/landing/PlasmaWave/PlasmaWave.vue';
import Footer from '@/components/landing/Footer/Footer.vue';
import FeatureCards from '@/components/landing/FeatureCards/FeatureCards.vue';
import StartBuilding from '@/components/landing/StartBuilding/StartBuilding.vue';
import heroImage from '@/assets/common/hero.webp';
const isMobile = ref(false);
const checkIsMobile = () => {
isMobile.value = window.innerWidth <= 768
}
isMobile.value = window.innerWidth <= 768;
};
onMounted(() => {
document.title = 'Vue Bits - Animated UI Components For Vue'
window.scrollTo(0, 0)
checkIsMobile()
window.addEventListener('resize', checkIsMobile)
})
document.title = 'Vue Bits - Animated UI Components For Vue';
window.scrollTo(0, 0);
checkIsMobile();
window.addEventListener('resize', checkIsMobile);
});
onUnmounted(() => {
window.removeEventListener('resize', checkIsMobile)
})
window.removeEventListener('resize', checkIsMobile);
});
</script>