barbican-reset 2.35.0 → 2.36.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/README.md +3 -7
- package/package.json +1 -1
- package/scss/_br-button.scss +45 -26
package/README.md
CHANGED
|
@@ -37,11 +37,9 @@ Vue.js: `@import "~barbican-reset/scss/helpers";`
|
|
|
37
37
|
|
|
38
38
|
Drupal: `@import "../node_modules/barbican-reset/scss/helpers/index";`
|
|
39
39
|
|
|
40
|
-
... fonts
|
|
41
|
-
|
|
42
40
|
## 2. Component library
|
|
43
41
|
|
|
44
|
-
The component library is **only available to Vue.js** apps.
|
|
42
|
+
The component library is currently **only available to Vue.js** apps.
|
|
45
43
|
|
|
46
44
|
> Many components are available globally within the Barbican ticketing app. Check the main.js file to see which components are currently available. These won't need an additional import statement.
|
|
47
45
|
|
|
@@ -152,8 +150,6 @@ The pattern library was created as a single source of truth for Barbican styles
|
|
|
152
150
|
|
|
153
151
|
## 6. Font library
|
|
154
152
|
|
|
155
|
-
The Barbican Reset includes a SCSS mixin called `font-face` which
|
|
156
|
-
|
|
157
|
-
#### Future intent
|
|
153
|
+
The Barbican Reset includes a SCSS mixin called `font-face` which defaults font-face urls to `https://www.barbican.org.uk/themes/barb22/fonts/`. This means none of digital projects need to host additional font files.
|
|
158
154
|
|
|
159
|
-
|
|
155
|
+
> If you do need to host fonts locally, you can overwrite the path parameter in the `font-face` mixin to point to a local asset.
|
package/package.json
CHANGED
package/scss/_br-button.scss
CHANGED
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
@include setup-button;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
|
|
10
9
|
/// Primary button.
|
|
11
10
|
/// Defaults to solid orange. Borders orange on focus.
|
|
12
11
|
/// @group Buttons
|
|
@@ -14,7 +13,6 @@
|
|
|
14
13
|
@include btn-primary;
|
|
15
14
|
}
|
|
16
15
|
|
|
17
|
-
|
|
18
16
|
/// Primary outline button.
|
|
19
17
|
/// Defaults to orange outline. Fills orange on focus
|
|
20
18
|
/// @group Buttons
|
|
@@ -22,7 +20,6 @@
|
|
|
22
20
|
@include btn-outline-primary;
|
|
23
21
|
}
|
|
24
22
|
|
|
25
|
-
|
|
26
23
|
/// Primary outline header button.
|
|
27
24
|
/// Defaults to white outline. Fills white on focus
|
|
28
25
|
/// @group Buttons
|
|
@@ -66,36 +63,58 @@
|
|
|
66
63
|
@include btn-input-edit;
|
|
67
64
|
}
|
|
68
65
|
|
|
69
|
-
.
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
66
|
+
/// Remove button.
|
|
67
|
+
/// Used only by StreamDonation.vue component. Could be deprecated.
|
|
68
|
+
/// Defaults to slim solid grey. Borders grey on focus.
|
|
69
|
+
/// @group Buttons
|
|
70
|
+
.btn.btn-remove {
|
|
71
|
+
@include btn-remove;
|
|
72
|
+
}
|
|
74
73
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
74
|
+
/// Link button.
|
|
75
|
+
/// Imitates the appearance of an anchor link.
|
|
76
|
+
/// Defaults to transparent fill. Fills grey on focus.
|
|
77
|
+
/// @group Buttons
|
|
78
|
+
.btn.btn-link {
|
|
79
|
+
@include btn-link;
|
|
80
|
+
}
|
|
78
81
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
+
/// Video help button.
|
|
83
|
+
/// Apparently no longer used. Could be deprecated.
|
|
84
|
+
/// @group Buttons
|
|
85
|
+
.btn.btn-video-help {
|
|
86
|
+
@include btn-video-help;
|
|
87
|
+
}
|
|
82
88
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
89
|
+
/// Exit button.
|
|
90
|
+
/// Circular close button. Used in the BrAlert component.
|
|
91
|
+
/// @group Buttons
|
|
92
|
+
.btn.btn-exit {
|
|
93
|
+
@include btn-exit;
|
|
94
|
+
}
|
|
86
95
|
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
96
|
+
/// Remove ticket button.
|
|
97
|
+
/// Used in the basket to remove items or donations.
|
|
98
|
+
/// @group Buttons
|
|
99
|
+
.btn.btn-remove-ticket {
|
|
100
|
+
@include btn-remove-ticket;
|
|
101
|
+
}
|
|
90
102
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
103
|
+
/// Remove gift button.
|
|
104
|
+
/// Used in the basket to remove items or donations.
|
|
105
|
+
/// @group Buttons
|
|
106
|
+
.btn.btn-remove-gift {
|
|
107
|
+
@include btn-remove-gift;
|
|
108
|
+
}
|
|
94
109
|
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
110
|
+
/// Membership card button.
|
|
111
|
+
/// Used for membership renewals.
|
|
112
|
+
/// @group Buttons
|
|
113
|
+
.btn.btn-membership-card {
|
|
114
|
+
@include btn-membership-card;
|
|
115
|
+
}
|
|
98
116
|
|
|
117
|
+
.btn {
|
|
99
118
|
&.btn-video-login {
|
|
100
119
|
@include btn-video-login;
|
|
101
120
|
}
|