Mask Image Position

Reference

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

  properties: {
    mask: {
      position: {
        DEFAULT: {
          property: "mask-position: <v><i>;",
          values: {
            // mask-position: x [spacing] [y] [spacing];
            center: "center",
            right: "right",
            left: "left",
            top: {
              DEFAULT: "top",
              left: "left top",
              right: "right top",
            },
            bottom: {
              DEFAULT: "bottom",
              left: "left bottom",
              right: "right bottom",
            },
          },
        },

        x: {
          property: "mask-position-x: <v><i>;",
          values: {
            // mask-position-x: v [spacing];
          },
        },

        y: {
          property: "mask-position-y: <v><i>;",
          values: {
            // mask-position-y: v [spacing];
          },
        },
      },
    },
  },
};

export default shilpConfig;