@ministryofjustice/frontend 0.2.3 → 1.0.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 CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
  MOJ Frontend contains the code you need to start building user interfaces for UK Ministry of Justice government services.
8
8
 
9
- See live examples of MOJ Frontend components, and guidance on when to use them in your service, in the [MOJ Design System](https://moj-design-system.herokuapp.com/).
9
+ See live examples of MOJ Frontend components, and guidance on when to use them in your service, in the [MOJ Pattern Library documentation](https://design-patterns.service.justice.gov.uk/).
10
10
 
11
11
  ## Contribution Guidelines
12
12
 
@@ -14,13 +14,15 @@ If you want to help us build MOJ Frontend, view our [contribution guidelines](CO
14
14
 
15
15
  ## Contact the team
16
16
 
17
- MOJ Frontend is maintained by the MOJ Design System team. If you need support [contact the Design System team](https://moj-design-system.herokuapp.com/get-in-touch).
17
+ MOJ Frontend is maintained by staff in the Ministry of Justice. If you need support, you can use [GitHub discussions](https://github.com/ministryofjustice/moj-frontend/discussions) or one of our Slack channels:
18
+ - [#moj-pattern-library-support](https://mojdt.slack.com/archives/CH5RUSB27) on MOJ Digital & Technology
19
+ - [#moj-design-system channel](https://ukgovernmentdigital.slack.com/archives/CJ6QDRDGC) on UK Government Digital
18
20
 
19
21
  ## Quick start
20
22
 
21
- We recommend [installing MOJ Frontend using node package manager (npm)](docs/installation/installing-with-npm.md).
23
+ We recommend [installing MOJ Frontend using node package manager (npm)](https://design-patterns.service.justice.gov.uk/get-started/installing-with-npm/).
22
24
 
23
- Once installed, you will be able to use the code from the examples in the [MOJ Design System](https://moj-design-system.herokuapp.com/) in your service.
25
+ Once installed, you will be able to use the code from the examples in the [MOJ Pattern Library](https://design-patterns.service.justice.gov.uk/) in your service.
24
26
 
25
27
  ## Browser support
26
28
 
package/moj/all.js CHANGED
@@ -174,9 +174,13 @@ MOJFrontend.AddAnother.prototype.getNewItem = function() {
174
174
 
175
175
  MOJFrontend.AddAnother.prototype.updateAttributes = function(index, item) {
176
176
  item.find('[data-name]').each(function(i, el) {
177
+ var originalId = el.id
178
+
177
179
  el.name = $(el).attr('data-name').replace(/%index%/, index);
178
180
  el.id = $(el).attr('data-id').replace(/%index%/, index);
179
- ($(el).siblings('label')[0] || $(el).parents('label')[0]).htmlFor = el.id;
181
+
182
+ var label = $(el).siblings('label')[0] || $(el).parents('label')[0] || item.find('[for="' + originalId + '"]')[0];
183
+ label.htmlFor = el.id;
180
184
  });
181
185
  };
182
186
 
@@ -16,7 +16,7 @@
16
16
 
17
17
  &__title {
18
18
  float: left;
19
- padding: 4px 0;
19
+ padding: 4px 100px 4px 0;
20
20
  width: 100%;
21
21
 
22
22
  & + .govuk-form-group {
@@ -28,6 +28,7 @@
28
28
  position: absolute;
29
29
  right: 0;
30
30
  top: 0;
31
+ width: auto;
31
32
  }
32
33
 
33
34
  &__add-button {
@@ -40,4 +41,4 @@
40
41
  color: $govuk-focus-text-colour;
41
42
  box-shadow: 0 -2px $govuk-focus-colour, 0 4px $govuk-focus-text-colour;
42
43
  outline: none;
43
- }
44
+ }
@@ -42,9 +42,13 @@ MOJFrontend.AddAnother.prototype.getNewItem = function() {
42
42
 
43
43
  MOJFrontend.AddAnother.prototype.updateAttributes = function(index, item) {
44
44
  item.find('[data-name]').each(function(i, el) {
45
+ var originalId = el.id
46
+
45
47
  el.name = $(el).attr('data-name').replace(/%index%/, index);
46
48
  el.id = $(el).attr('data-id').replace(/%index%/, index);
47
- ($(el).siblings('label')[0] || $(el).parents('label')[0]).htmlFor = el.id;
49
+
50
+ var label = $(el).siblings('label')[0] || $(el).parents('label')[0] || item.find('[for="' + originalId + '"]')[0];
51
+ label.htmlFor = el.id;
48
52
  });
49
53
  };
50
54
 
@@ -7,9 +7,9 @@
7
7
 
8
8
  The currency input component is dependent on the following components from the [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend/):
9
9
 
10
- - [GOV.UK Label component](https://github.com/alphagov/govuk-frontend/tree/master/src/components/label)
11
- - [GOV.UK Hint component](https://github.com/alphagov/govuk-frontend/tree/master/src/components/hint)
12
- - [GOV.UK Error message component](https://github.com/alphagov/govuk-frontend/tree/master/src/components/error-message)
10
+ - [GOV.UK Label component](https://github.com/alphagov/govuk-frontend/tree/main/src/govuk/components/label)
11
+ - [GOV.UK Hint component](https://github.com/alphagov/govuk-frontend/tree/main/src/govuk/components/hint)
12
+ - [GOV.UK Error message component](https://github.com/alphagov/govuk-frontend/tree/main/src/govuk/components/error-message)
13
13
 
14
14
  ## Examples
15
15
 
@@ -163,6 +163,7 @@
163
163
 
164
164
  .moj-filter__heading-title,
165
165
  .moj-filter__heading-action {
166
+ @include govuk-font(16);
166
167
  display: inline-block;
167
168
  text-align: left;
168
169
  vertical-align: middle;
@@ -29,8 +29,7 @@
29
29
  padding: govuk-spacing(4);
30
30
  margin-bottom: govuk-spacing(3);
31
31
  flex-grow: 1;
32
- border-left-width: 4px;
33
- border-left-style: solid;
32
+ border-left: 4px solid transparent;
34
33
 
35
34
  &--grey {
36
35
  border-left-color: $govuk-border-colour;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ministryofjustice/frontend",
3
3
  "description": "The MOJ Frontend contains the code you need to start building user interfaces for UK Ministry of Justice government services.",
4
- "version": "0.2.3",
4
+ "version": "1.0.0",
5
5
  "main": "moj/all.js",
6
6
  "sass": "moj/all.scss",
7
7
  "engines": {