properties
changelog

@siblings Mixin

Use @siblings mixin to style sibling elements.

Usage:

.any-class {
	/* functions */
	@siblings <variant>("<arguments>") { ... }
}

Reference

shilp.config.js
/** @type {import('shilpcss/types').ShilpConfig} */
const shilpConfig = {
  source: "react",

  mixins: {
    siblings: {
      // https://www.youtube.com/watch?v=rndMS4pEKP8&t=145s

      /* functions */
      match: "& ~ <1>", // not nested, not from other parents, all following
      "match-closest": "& + <1>", // not nested, not from other parents, all direct following
    },
  },
};

export default shilpConfig;

Published at:

Last updated at:

Self MixinState Mixin