astro-dev

Packages

Astro LightGallery

Using lightgallery in astro

Code Snippet

---
import { LightGallery } from 'astro-lightgallery'
---
<LightGallery
  class="..."
  options={{
    thumbnail: true,
    ...
    }} >
  {
      <a class="mygallery-one-img" href="img1.jpg">
          <img src="img1.jpg" />
      </a>
      <a class="mygallery-one-img" href="img2.jpg">
          <img src="img2.jpg" />
      </a>
      ...
  }
</LightGallery>

Go to the doc

Astro Swiper

Using swiper in astro

Code Snippet

---
import { Swiper, SwiperWrapper, SwiperSlide} from "astro-swiper";
---
<Swiper>
  <SwiperWrapper>
    <SwiperSlide> ... </SwiperSlide>
    <SwiperSlide> ... </SwiperSlide>
    <SwiperSlide> ... </SwiperSlide>
  </SwiperWrapper>
</Swiper>

Go to the doc

Astro Splide

Using @splidejs/splide in astro

• 
• 
• 
• 
• 

Code Snippet

---
import { Splide, SplideSlide } from 'astro-splide';
---
<Splide>
  <SplideSlide> ...  </SplideSlide>
  <SplideSlide> ...  </SplideSlide>
  <SplideSlide> ...  </SplideSlide>
</Splide>

Go to the doc

Astro Sprite

Work-in-progress

Astro Webtools

Astro Components

Go to the doc!

Resources

Resources that can be used in Astro, such as fonts,…

Fonts