actions.js
1 month ago
booking.js
1 month ago
cabinet.js
1 month ago
cart.js
1 month ago
catalog.js
1 month ago
coupon.js
1 month ago
customFields.js
1 month ago
customFontFace.js
1 month ago
eventFormCssVars.js
1 month ago
events.js
1 month ago
facebookPixel.js
1 month ago
ivy.js
1 month ago
package.js
1 month ago
panel.js
1 month ago
public.js
1 month ago
renderActions.js
1 month ago
restore.js
1 month ago
slots.js
1 month ago
translation.js
1 month ago
user.js
1 month ago
eventFormCssVars.js
55 lines
| 1 | import { computed, unref } from 'vue' |
| 2 | import { useColorTransparency } from '../common/colorManipulation' |
| 3 | |
| 4 | /** |
| 5 | * Shared CSS custom properties for event list / calendar / WPA landing containers |
| 6 | * and EventBookingDialog. |
| 7 | * |
| 8 | * @param {import('vue').ComputedRef<object>|import('vue').Ref<object>} amColors |
| 9 | * @param {import('vue').Ref<object>} amFonts |
| 10 | * @param {import('vue').Ref<number>} dynamicVh |
| 11 | */ |
| 12 | export function eventFormCssVars(amColors, amFonts, dynamicVh) { |
| 13 | return computed(() => { |
| 14 | const c = unref(amColors) |
| 15 | const f = unref(amFonts) |
| 16 | const vh = unref(dynamicVh) |
| 17 | |
| 18 | return { |
| 19 | '--am-c-primary': c.colorPrimary, |
| 20 | '--am-c-success': c.colorSuccess, |
| 21 | '--am-c-error': c.colorError, |
| 22 | '--am-c-warning': c.colorWarning, |
| 23 | '--am-c-main-bgr': c.colorMainBgr, |
| 24 | '--am-c-main-heading-text': c.colorMainHeadingText, |
| 25 | '--am-c-main-text': c.colorMainText, |
| 26 | '--am-c-main-text-op15': useColorTransparency(c.colorMainText, 0.15), |
| 27 | '--am-c-sb-bgr': c.colorSbBgr, |
| 28 | '--am-c-sb-text': c.colorSbText, |
| 29 | '--am-c-inp-bgr': c.colorInpBgr, |
| 30 | '--am-c-inp-border': c.colorInpBorder, |
| 31 | '--am-c-inp-text': c.colorInpText, |
| 32 | '--am-c-inp-placeholder': c.colorInpPlaceHolder, |
| 33 | '--am-c-drop-bgr': c.colorDropBgr, |
| 34 | '--am-c-drop-text': c.colorDropText, |
| 35 | '--am-c-card-bgr': c.colorCardBgr, |
| 36 | '--am-c-card-text': c.colorCardText, |
| 37 | '--am-c-card-border': c.colorCardBorder, |
| 38 | '--am-c-btn-prim': c.colorBtnPrim, |
| 39 | '--am-c-btn-prim-text': c.colorBtnPrimText, |
| 40 | '--am-c-btn-sec': c.colorBtnSec, |
| 41 | '--am-c-btn-sec-text': c.colorBtnSecText, |
| 42 | '--am-c-skeleton-op20': useColorTransparency(c.colorMainText, 0.2), |
| 43 | '--am-c-skeleton-op60': useColorTransparency(c.colorMainText, 0.6), |
| 44 | '--am-font-family': f.fontFamily, |
| 45 | '--am-dvh': vh ? `${vh}px` : '100dvh', |
| 46 | '--am-mw-main': '792px', |
| 47 | '--am-hd-main': '652px', |
| 48 | '--am-c-scroll-op30': useColorTransparency(c.colorPrimary, 0.3), |
| 49 | '--am-c-scroll-op10': useColorTransparency(c.colorPrimary, 0.1), |
| 50 | '--am-rad-inp': '6px', |
| 51 | '--am-mb-dialog': '300px', |
| 52 | } |
| 53 | }) |
| 54 | } |
| 55 |