import { __ } from "@wordpress/i18n"; import { Dashicon } from "@wordpress/components"; // the consts defined here should be unique from one another export const WRAPPER_MARGIN = "wrpMargin"; export const BUTTONS_MARGIN = "buttonsMargin"; export const BUTTONS_PADDING = "buttonsPadding"; export const BUTTON_ONE_BACKGROUND = "Btn1Bg"; export const BUTTON_TWO_BACKGROUND = "Btn2Bg"; export const BUTTON_ONE_BORDER_SHADOW = "buttonOneBorderShadow"; export const BUTTON_TWO_BORDER_SHADOW = "buttonTwoBorderShadow"; export const BUTTON_ONE_BG = "button1Bg"; export const BUTTON_TWO_BG = "button2Bg"; export const BUTTONS_WIDTH = "buttonsWidth"; export const BUTTONS_GAP = "buttonsGap"; export const BUTTONS_CONNECTOR_SIZE = "buttonsConnectorSize"; export const BUTTONS_CONNECTOR_ICON_SIZE = "buttonsConnectorIconSize"; export const BUTTON_STYLES = [ { label: __("Fill", "essential-blocks"), value: "fill" }, { label: __("Outline", "essential-blocks"), value: "outline" }, { label: __("Text", "essential-blocks"), value: "text" }, ]; export const UNIT_TYPES = [ { label: "px", value: "px" }, { label: "em", value: "em" }, ]; export const NORMAL_HOVER = [ { label: "Normal", value: "normal" }, { label: "Hover", value: "hover" }, ]; export const BUTTON_WIDTH_TYPE = [ { label: "Custom Width", value: "custom" }, { label: "Auto", value: "auto" }, ]; export const CONNECTOR_TYPE = [ { label: __("Text", "essential-blocks"), value: "text" }, { label: __("Icon", "essential-blocks"), value: "icon" }, ]; export const PRESETS = [ { label: __("Preset 1", "essential-blocks"), value: "preset-1" }, { label: __("Preset 2", "essential-blocks"), value: "preset-2" }, { label: __("Preset 3", "essential-blocks"), value: "preset-3" }, { label: __("Preset 4", "essential-blocks"), value: "preset-4" }, ]; export const TEXT_ALIGN = [ { label: __(), value: "left" }, { label: __(), value: "center" }, { label: __(), value: "right" } ]; export const CONTENT_POSITION = [ { label: __(), value: "flex-start" }, { label: __(), value: "center" }, { label: __(), value: "flex-end" } ]; export const BUTTON_ONE_KEYS = { buttonText: 'buttonTextOne', textColor: 'textOneColor', hoverTextColor: 'hoverTextOneColor', buttonURL: 'buttonURLOne' } export const BUTTON_TWO_KEYS = { buttonText: 'buttonTextTwo', textColor: 'textTwoColor', hoverTextColor: 'hoverTextTwoColor', buttonURL: 'buttonURLTwo' } March 2024 – Ashe Ville Diy Bio
Wednesday, June 25 2025
/** * @prop --track-color: The color of the spinner's track. * @prop --indicator-color: The color of the spinner's indicator. * @prop --stroke-width: The width of the indicator. */ :host { position: relative; box-sizing: border-box; --track-color: #0d131e20; --indicator-color: var(--plyr-color-main); --stroke-width: 2px; display: inline-flex; } :host *, :host *:before, :host *:after { box-sizing: inherit; } .spinner { display: inline-block; width: 1em; height: 1em; border-radius: 50%; border: solid var(--stroke-width) var(--track-color); border-top-color: var(--indicator-color); border-right-color: var(--indicator-color); animation: 1s linear infinite spin; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }