diff --git a/package.json b/package.json index 14a2789..cb51cee 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "astroplate", - "version": "2.1.0", + "version": "2.1.1", "description": "Astro and Tailwindcss boilerplate", "author": "zeon.studio", "license": "MIT", @@ -44,10 +44,10 @@ "@tailwindcss/typography": "^0.5.10", "@types/marked": "^5.0.2", "@types/node": "20.8.7", - "@types/react": "18.2.29", + "@types/react": "18.2.31", "@types/react-dom": "18.2.14", "autoprefixer": "^10.4.16", - "eslint": "^8.51.0", + "eslint": "^8.52.0", "postcss": "^8.4.31", "prettier": "^3.0.3", "prettier-plugin-astro": "^0.12.0", diff --git a/src/layouts/components/Logo.astro b/src/layouts/components/Logo.astro index f8f5bae..1e6c94a 100644 --- a/src/layouts/components/Logo.astro +++ b/src/layouts/components/Logo.astro @@ -33,8 +33,6 @@ const { theme_switcher }: { theme_switcher: boolean } = config.settings; width={logo_width.replace("px", "") * 2} height={logo_height.replace("px", "") * 2} alt={title} - fit={"contain"} - background={"rgba(0,0,0,0)"} style={{ height: logo_height.replace("px", "") + "px", width: logo_width.replace("px", "") + "px", @@ -48,8 +46,6 @@ const { theme_switcher }: { theme_switcher: boolean } = config.settings; width={logo_width.replace("px", "") * 2} height={logo_height.replace("px", "") * 2} alt={title} - fit={"contain"} - background={"rgba(0,0,0,0)"} style={{ height: logo_height.replace("px", "") + "px", width: logo_width.replace("px", "") + "px", diff --git a/src/layouts/partials/Testimonial.astro b/src/layouts/partials/Testimonial.astro index 478778f..d520766 100644 --- a/src/layouts/partials/Testimonial.astro +++ b/src/layouts/partials/Testimonial.astro @@ -85,28 +85,31 @@ const { testimonial } = Astro.props; import "swiper/css/pagination"; import { Autoplay, Pagination } from "swiper/modules"; - new Swiper(".testimonial-slider", { - modules: [Pagination, Autoplay], - spaceBetween: 24, - loop: true, - loopedSlides: 2, - centeredSlides: true, - autoplay: { - delay: 2500, - disableOnInteraction: false, - }, - pagination: { - el: ".testimonial-slider-pagination", - type: "bullets", - clickable: true, - }, - breakpoints: { - 768: { - slidesPerView: 2, + // astro:page-load event is fired when the page is loaded + document.addEventListener("astro:page-load", () => { + new Swiper(".testimonial-slider", { + modules: [Pagination, Autoplay], + spaceBetween: 24, + loop: true, + loopedSlides: 2, + centeredSlides: true, + autoplay: { + delay: 2500, + disableOnInteraction: false, }, - 992: { - slidesPerView: 3, + pagination: { + el: ".testimonial-slider-pagination", + type: "bullets", + clickable: true, }, - }, + breakpoints: { + 768: { + slidesPerView: 2, + }, + 992: { + slidesPerView: 3, + }, + }, + }); }); diff --git a/src/pages/index.astro b/src/pages/index.astro index 14fd928..0966bc6 100755 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -71,8 +71,6 @@ const { banner, features }: Homepage = homepage.data; src={feature.image} height={480} width={520} - fit="contain" - background="rgba(0,0,0,0)" alt={feature.title} format="webp" /> diff --git a/src/styles/components.scss b/src/styles/components.scss index 7b83f91..b48309b 100755 --- a/src/styles/components.scss +++ b/src/styles/components.scss @@ -75,11 +75,13 @@ } // swiper pagination -.swiper-pagination-bullet { - @apply h-2.5 w-2.5 bg-theme-light opacity-100 dark:bg-darkmode-theme-light; +.testimonial-slider-pagination { + .swiper-pagination-bullet { + @apply h-2.5 w-2.5 bg-theme-light opacity-100 dark:bg-darkmode-theme-light; - &-active { - @apply h-4 w-4 bg-primary dark:bg-darkmode-primary; + &-active { + @apply h-4 w-4 bg-primary dark:bg-darkmode-primary; + } } }