https://github.com/thinknathan/pcss-mixins

Various mixins for use with postcss-mixins
https://github.com/thinknathan/pcss-mixins

Last synced: 5 months ago
JSON representation

Various mixins for use with postcss-mixins

• Host: GitHub
• URL: https://github.com/thinknathan/pcss-mixins
• Owner: thinknathan
• License: cc0-1.0
• Created: 2024-04-25T00:23:33.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-12-15T02:57:17.000Z (over 1 year ago)
• Last Synced: 2025-04-30T16:09:20.663Z (about 1 year ago)
• Language: CSS
• Homepage:
• Size: 863 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Various Mixins for PostCSS

Provides convenient and stylish mixins for your stylesheets.

## Overview

- `mixins/_divider.css`

  - CSS shapes using psuedo-selectors to visually separate one element from another

- `mixins/_gg-css-icons.css`

  - CSS-only icons from [css.gg](https://css.gg/)

- `mixins/_gg-icons.css`

  - SVG background images from [css.gg](https://css.gg/)

- `mixins/_lazyload.css`

  - An animation for use as a placeholder for loading images

- `mixins/_lucide-icons.css`

  - [Lucide icons](https://lucide.dev/icons/) as SVG background images

- `mixins/_placeholder.css`

  - A skeleton style of placeholder for use when content is loading in

- `mixins/_ripple.css`

  - An interaction confirmation animation using psuedo-selectors, inspired by material design

## Requirements

- NodeJS or equivalent

- [PostCSS](https://postcss.org/)

- [PostCSS-Mixins](https://github.com/postcss/postcss-mixins)

## Installation

`npm install pcss-mixins`

OR

`yarn add pcss-mixins`