barbican-reset 3.43.0 → 3.45.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/BrConfirmDone.vue +1 -1
- package/components/BrConfirmEmail.vue +1 -1
- package/icons.js +16 -0
- package/index.js +45 -51
- package/package.json +4 -8
- package/scss/_br-form-select.scss +1 -0
- package/scss/atomic/_margins.scss +5 -0
- package/scss/mixins/_br-form-radio.scss +0 -6
- package/scss/mixins/card/_membership.scss +0 -1
- package/scss/mixins/input/_text.scss +2 -1
- package/utils/datetimes.js +8 -0
- package/utils.js +6 -6
- package/icons/index.js +0 -19
- package/scss/card/_membership-new.scss +0 -32
package/icons.js
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export { default as BrBackArrow } from './icons/BackArrow.vue'
|
|
2
|
+
export { default as BrBarbicanLogo } from './icons/Barbican.vue'
|
|
3
|
+
export { default as BrCartIcon } from './icons/Cart.vue'
|
|
4
|
+
export { default as BrCityOfLondonLockup } from './icons/CityOfLondonLockup.vue'
|
|
5
|
+
export { default as BrCloseIcon } from './icons/Close.vue'
|
|
6
|
+
export { default as BrInfoIcon } from './icons/Info.vue'
|
|
7
|
+
export { default as BrRenewIcon } from './icons/Renew.vue'
|
|
8
|
+
export { default as BrDropdownIcon } from './icons/Dropdown.vue'
|
|
9
|
+
export { default as BrAccountContactIcon } from './icons/AccountContact.vue'
|
|
10
|
+
export { default as BrAccountDetailsIcon } from './icons/AccountPerson.vue'
|
|
11
|
+
export { default as BrAccountEditIcon } from './icons/AccountEdit.vue'
|
|
12
|
+
export { default as BrAccountMembershipIcon } from './icons/AccountMembership.vue'
|
|
13
|
+
export { default as BrAccountOrdersIcon } from './icons/AccountOrders.vue'
|
|
14
|
+
export { default as BrAccountPaymentIcon } from './icons/AccountPayment.vue'
|
|
15
|
+
export { default as BrAccountTicketIcon } from './icons/AccountTicket.vue'
|
|
16
|
+
export { default as BrAccountPersonalIcon } from './icons/AccountPersonal.vue'
|
package/index.js
CHANGED
|
@@ -1,51 +1,45 @@
|
|
|
1
|
-
export { default as BrAlert } from '
|
|
2
|
-
export { default as BrButton } from '
|
|
3
|
-
|
|
4
|
-
export { default as
|
|
5
|
-
export { default as
|
|
6
|
-
export { default as
|
|
7
|
-
export { default as
|
|
8
|
-
export { default as
|
|
9
|
-
export { default as
|
|
10
|
-
|
|
11
|
-
export { default as
|
|
12
|
-
export { default as
|
|
13
|
-
|
|
14
|
-
export { default as
|
|
15
|
-
export { default as
|
|
16
|
-
|
|
17
|
-
export { default as
|
|
18
|
-
export { default as
|
|
19
|
-
export { default as
|
|
20
|
-
export { default as
|
|
21
|
-
|
|
22
|
-
export { default as
|
|
23
|
-
export { default as
|
|
24
|
-
export { default as
|
|
25
|
-
export { default as
|
|
26
|
-
export { default as
|
|
27
|
-
export { default as
|
|
28
|
-
export { default as
|
|
29
|
-
export { default as
|
|
30
|
-
export { default as
|
|
31
|
-
export { default as
|
|
32
|
-
export { default as
|
|
33
|
-
export { default as
|
|
34
|
-
export { default as
|
|
35
|
-
export { default as
|
|
36
|
-
export { default as
|
|
37
|
-
export { default as
|
|
38
|
-
export { default as
|
|
39
|
-
export { default as
|
|
40
|
-
export { default as
|
|
41
|
-
export { default as
|
|
42
|
-
|
|
43
|
-
export { default as
|
|
44
|
-
export { default as
|
|
45
|
-
export { default as
|
|
46
|
-
export { default as BrSkiplink } from '#components/BrSkiplink.vue'
|
|
47
|
-
export { default as BrStatusBars } from '#components/BrStatusBars.vue'
|
|
48
|
-
export { default as BrTableCell } from '#components/BrTableCell.vue'
|
|
49
|
-
export { default as BrTableHeader } from '#components/BrTableHeader.vue'
|
|
50
|
-
export { default as BrTableRow } from '#components/BrTableRow.vue'
|
|
51
|
-
export { default as BrWrap } from '#components/BrWrap.vue'
|
|
1
|
+
export { default as BrAlert } from './components/BrAlert.vue'
|
|
2
|
+
export { default as BrButton } from './components/BrButton.vue'
|
|
3
|
+
export { default as BrCard } from './components/BrCard.vue'
|
|
4
|
+
export { default as BrCardBody } from './components/BrCardBody.vue'
|
|
5
|
+
export { default as BrCardSubtitle } from './components/BrCardSubtitle.vue'
|
|
6
|
+
export { default as BrCardText } from './components/BrCardText.vue'
|
|
7
|
+
export { default as BrCardTearoff } from './components/BrCardTearoff.vue'
|
|
8
|
+
export { default as BrCardTitle } from './components/BrCardTitle.vue'
|
|
9
|
+
export { default as BrCollapseButton } from './components/BrCollapse/Button.vue'
|
|
10
|
+
export { default as BrCollapseContent } from './components/BrCollapse/Content.vue'
|
|
11
|
+
export { default as BrConfirmDone } from './components/BrConfirmDone.vue'
|
|
12
|
+
export { default as BrConfirmEmail } from './components/BrConfirmEmail.vue'
|
|
13
|
+
export { default as BrContainer } from './components/BrContainer.vue'
|
|
14
|
+
export { default as BrDetails } from './components/BrDetails.vue'
|
|
15
|
+
export { default as BrFooterLower } from './components/BrFooterLower.vue'
|
|
16
|
+
export { default as BrFooterUpper } from './components/BrFooterUpper.vue'
|
|
17
|
+
export { default as BrFormBlock } from './components/BrFormBlock.vue'
|
|
18
|
+
export { default as BrFormCheckbox } from './components/BrFormCheckbox.vue'
|
|
19
|
+
export { default as BrFormCheckboxGroup } from './components/BrFormCheckboxGroup.vue'
|
|
20
|
+
export { default as BrFormDate } from './components/BrFormDate.vue'
|
|
21
|
+
export { default as BrFormEdit } from './components/BrFormEdit.vue'
|
|
22
|
+
export { default as BrFormEmail } from './components/BrFormEmail.vue'
|
|
23
|
+
export { default as BrFormFieldset } from './components/BrFormFieldset.vue'
|
|
24
|
+
export { default as BrFormInput } from './components/BrFormInput.vue'
|
|
25
|
+
export { default as BrFormLabel } from './components/BrFormLabel.vue'
|
|
26
|
+
export { default as BrFormPassword } from './components/BrFormPassword.vue'
|
|
27
|
+
export { default as BrFormRadio } from './components/BrFormRadio.vue'
|
|
28
|
+
export { default as BrFormRadioGroup } from './components/BrFormRadioGroup.vue'
|
|
29
|
+
export { default as BrFormRow } from './components/BrFormRow.vue'
|
|
30
|
+
export { default as BrFormSelect } from './components/BrFormSelect.vue'
|
|
31
|
+
export { default as BrFormSelectItem } from './components/BrFormSelectItem.vue'
|
|
32
|
+
export { default as BrFormTel } from './components/BrFormTel.vue'
|
|
33
|
+
export { default as BrFormTextarea } from './components/BrFormTextarea.vue'
|
|
34
|
+
export { default as BrFormToggle } from './components/BrFormToggle.vue'
|
|
35
|
+
export { default as BrFormUpdate } from './components/BrFormUpdate.vue'
|
|
36
|
+
export { default as BrFormVisible } from './components/BrFormVisible.vue'
|
|
37
|
+
export { default as BrLink } from './components/BrLink.vue'
|
|
38
|
+
export { default as BrLoader } from './components/BrLoader.vue'
|
|
39
|
+
export { default as BrOverlay } from './components/BrOverlay.vue'
|
|
40
|
+
export { default as BrSkiplink } from './components/BrSkiplink.vue'
|
|
41
|
+
export { default as BrStatusBars } from './components/BrStatusBars.vue'
|
|
42
|
+
export { default as BrTableCell } from './components/BrTableCell.vue'
|
|
43
|
+
export { default as BrTableHeader } from './components/BrTableHeader.vue'
|
|
44
|
+
export { default as BrTableRow } from './components/BrTableRow.vue'
|
|
45
|
+
export { default as BrWrap } from './components/BrWrap.vue'
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "barbican-reset",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.45.0",
|
|
4
4
|
"description": "Shared design system for Barbican projects, providing SCSS utilities, animations, icons, Vue components, and JS helpers for consistent styling and behaviour.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"exports": {
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"./supreme": "./scss/supreme.scss",
|
|
11
11
|
"./typography": "./scss/typography.scss",
|
|
12
12
|
"./focus-visible": "./focus-visible.min.js",
|
|
13
|
-
"./icons": "./icons
|
|
13
|
+
"./icons": "./icons.js",
|
|
14
14
|
"./scss": "./scss/index.scss",
|
|
15
15
|
"./scss/functions": "./scss/functions/index.scss",
|
|
16
16
|
"./scss/mixins": "./scss/mixins/index.scss",
|
|
@@ -19,12 +19,7 @@
|
|
|
19
19
|
"./utils": "./utils.js"
|
|
20
20
|
},
|
|
21
21
|
"imports": {
|
|
22
|
-
"#
|
|
23
|
-
"#components/*": "./components/*",
|
|
24
|
-
"#icons/*": "./icons/*",
|
|
25
|
-
"#mixins/*": "./mixins/*.js",
|
|
26
|
-
"#styles/*": "./scss/*.scss",
|
|
27
|
-
"#utils/*": "./utils/*.js"
|
|
22
|
+
"#styles/*": "./scss/*.scss"
|
|
28
23
|
},
|
|
29
24
|
"scripts": {
|
|
30
25
|
"build:css": "gulp build:css",
|
|
@@ -57,6 +52,7 @@
|
|
|
57
52
|
"utils/**/*",
|
|
58
53
|
"scss/**/*",
|
|
59
54
|
"focus-visible.min.js",
|
|
55
|
+
"icons.js",
|
|
60
56
|
"index.js",
|
|
61
57
|
"utils.js"
|
|
62
58
|
],
|
|
@@ -27,12 +27,13 @@
|
|
|
27
27
|
background-color: var(--color-black-5-lighten);
|
|
28
28
|
border-color: var(--color-black-25-lighten);
|
|
29
29
|
border-radius: var(--border-radius-md);
|
|
30
|
+
border-width: var(--border-width-sm);
|
|
30
31
|
color: var(--color-black-60-lighten);
|
|
31
32
|
padding: var(--padding-lg);
|
|
32
|
-
border-width: var(--border-width-sm);
|
|
33
33
|
font-family: inherit;
|
|
34
34
|
border-style: solid;
|
|
35
35
|
font-size: inherit;
|
|
36
|
+
min-width: 0;
|
|
36
37
|
|
|
37
38
|
&:not(:disabled) {
|
|
38
39
|
@include input-focus {
|
package/utils/datetimes.js
CHANGED
|
@@ -4,6 +4,7 @@ let stringFormats = {
|
|
|
4
4
|
date: {
|
|
5
5
|
sm: 'yyyy-LL-dd',
|
|
6
6
|
md: 'ccc d LLL',
|
|
7
|
+
md_inc_year: 'ccc d LLL yyyy',
|
|
7
8
|
},
|
|
8
9
|
time: {
|
|
9
10
|
sm: 'ha',
|
|
@@ -58,6 +59,12 @@ let formatSmReverseDate = (value, separator) => DateTime.fromISO(value).toFormat
|
|
|
58
59
|
*/
|
|
59
60
|
let formatMdDate = (value) => DateTime.fromISO(value).toFormat(stringFormats.date.md)
|
|
60
61
|
|
|
62
|
+
/**
|
|
63
|
+
* @param {string} value - ISO date string
|
|
64
|
+
* @returns {string} e.g. "Tue 24 Mar 2026"
|
|
65
|
+
*/
|
|
66
|
+
let formatMdIncYearDate = (value) => DateTime.fromISO(value).toFormat(stringFormats.date.md_inc_year)
|
|
67
|
+
|
|
61
68
|
/**
|
|
62
69
|
* @param {any} n - Day of month
|
|
63
70
|
* @returns {string} e.g. "1st", "2nd", "3rd", "4th"
|
|
@@ -138,6 +145,7 @@ let formatDate = {
|
|
|
138
145
|
}
|
|
139
146
|
},
|
|
140
147
|
md: (value) => formatMdDate(value),
|
|
148
|
+
md_inc_year: (value) => formatMdIncYearDate(value),
|
|
141
149
|
lg: (value) => formatLgDate(value),
|
|
142
150
|
}
|
|
143
151
|
|
package/utils.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export * from '
|
|
2
|
-
export * from '
|
|
3
|
-
export { default as compareArrays } from '
|
|
4
|
-
export { default as constrainTabbing } from '
|
|
5
|
-
export { default as formatKebabCase } from '
|
|
6
|
-
export { default as logObject } from '
|
|
1
|
+
export * from './utils/datetimes'
|
|
2
|
+
export * from './utils/numbers'
|
|
3
|
+
export { default as compareArrays } from './utils/compareArrays'
|
|
4
|
+
export { default as constrainTabbing } from './utils/constrainTabbing'
|
|
5
|
+
export { default as formatKebabCase } from './utils/formatKebabCase'
|
|
6
|
+
export { default as logObject } from './utils/logObject'
|
package/icons/index.js
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import BrBackArrow from './BackArrow.vue'
|
|
2
|
-
import BrBarbicanLogo from './Barbican.vue'
|
|
3
|
-
import BrCartIcon from './Cart.vue'
|
|
4
|
-
import BrCityOfLondonLockup from './CityOfLondonLockup.vue'
|
|
5
|
-
import BrCloseIcon from './Close.vue'
|
|
6
|
-
import BrInfoIcon from './Info.vue'
|
|
7
|
-
import BrRenewIcon from './Renew.vue'
|
|
8
|
-
import BrDropdownIcon from './Dropdown.vue'
|
|
9
|
-
|
|
10
|
-
import BrAccountContactIcon from './AccountContact.vue'
|
|
11
|
-
import BrAccountDetailsIcon from './AccountPerson.vue'
|
|
12
|
-
import BrAccountEditIcon from './AccountEdit.vue'
|
|
13
|
-
import BrAccountMembershipIcon from './AccountMembership.vue'
|
|
14
|
-
import BrAccountOrdersIcon from './AccountOrders.vue'
|
|
15
|
-
import BrAccountPaymentIcon from './AccountPayment.vue'
|
|
16
|
-
import BrAccountTicketIcon from './AccountTicket.vue'
|
|
17
|
-
import BrAccountPersonalIcon from './AccountPersonal.vue'
|
|
18
|
-
|
|
19
|
-
export { BrAccountContactIcon, BrAccountDetailsIcon, BrAccountEditIcon, BrAccountMembershipIcon, BrAccountOrdersIcon, BrAccountPaymentIcon, BrAccountTicketIcon, BrAccountPersonalIcon, BrBackArrow, BrBarbicanLogo, BrCartIcon, BrCityOfLondonLockup, BrCloseIcon, BrDropdownIcon, BrInfoIcon, BrRenewIcon }
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
@use "../mixins/breakpoints" as *;
|
|
2
|
-
|
|
3
|
-
$colors: (
|
|
4
|
-
"member": var(--color-brand-membership),
|
|
5
|
-
"member-plus": var(--color-donor-member-plus),
|
|
6
|
-
"patron": var(--color-donor-patron),
|
|
7
|
-
"premier-patron": var(--color-donor-patron),
|
|
8
|
-
"principal-patron": var(--color-donor-principal-patron),
|
|
9
|
-
"directors-circle": var(--color-donor-principal-patron),
|
|
10
|
-
"young-barbican": var(--color-brand-young-barbican),
|
|
11
|
-
);
|
|
12
|
-
|
|
13
|
-
$gradients: (
|
|
14
|
-
"member-plus": linear-gradient(var(--gradient-angle-membership), var(--gradient-member-plus)),
|
|
15
|
-
"patron": linear-gradient(var(--gradient-angle-membership), var(--gradient-patron)),
|
|
16
|
-
"premier-patron": linear-gradient(var(--gradient-angle-membership), var(--gradient-premier-patron)),
|
|
17
|
-
"principal-patron": linear-gradient(var(--gradient-angle-membership), var(--gradient-principal-patron)),
|
|
18
|
-
"directors-circle": linear-gradient(var(--gradient-angle-membership), var(--gradient-directors-circle)),
|
|
19
|
-
"young-barbican": linear-gradient(var(--gradient-angle-membership), var(--gradient-young-barbican)),
|
|
20
|
-
);
|
|
21
|
-
|
|
22
|
-
@each $name, $value in $colors {
|
|
23
|
-
.br-card.membership-new.#{$name} {
|
|
24
|
-
background-color: #{$value};
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
@each $name, $value in $gradients {
|
|
29
|
-
.br-card.membership-new.#{$name} {
|
|
30
|
-
background-image: #{$value};
|
|
31
|
-
}
|
|
32
|
-
}
|