Skip to content

Commit 027571f

Browse files
authored
Merge branch 'develop' into vector-map-source
2 parents bf47ff7 + 10d3148 commit 027571f

File tree

230 files changed

+239867
-70332
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

230 files changed

+239867
-70332
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ node_modules
66
/.svelte-kit
77
/build
88
/dist
9+
/docs
910

1011
# OS
1112
.DS_Store

.nvmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
20

README.md

Lines changed: 30 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,18 +34,42 @@ npm install @communitiesuk/svelte-component-library@latest
3434
To ensure GOV.UK styles are applied correctly, add this script tag to your `app.html` file in the body section:
3535

3636
```html
37-
3837
<script>
39-
document.body.className +=
40-
" js-enabled" +
41-
("noModule" in HTMLScriptElement.prototype
42-
? " govuk-frontend-supported"
43-
: "");
38+
document.body.className +=
39+
" js-enabled" +
40+
("noModule" in HTMLScriptElement.prototype
41+
? " govuk-frontend-supported"
42+
: "");
4443
</script>
4544
```
4645

4746
This is required because the GOV.UK Frontend CSS checks the document body for JavaScript availability to progressively enhance components.
4847

48+
### GOV.UK Rebranded Styles (Optional)
49+
50+
To use the refreshed GOV.UK brand (launched June 2025), add the `govuk-template--rebranded` class to your `app.html` body element:
51+
52+
```html
53+
<body class="govuk-template--rebranded">
54+
<!-- Your app content -->
55+
</body>
56+
```
57+
58+
**When to use rebrand:**
59+
60+
- **Global CSS styles**: The `govuk-template--rebranded` class on `<body>` automatically applies rebranded styles to all components
61+
- **Component markup**: Some components (like Footer and Header) have a `rebrand` prop that controls whether they show additional rebranded markup elements (like the crown logo). The rebrand prop is set to true by default on all relavent componets - you can specify false should you want to keep the old markup and assets.
62+
- **Assets**: Rebranded components will use updated assets (logos, icons) from the `/assets/rebrand/` folder
63+
64+
**Example with rebranded Footer:**
65+
66+
```javascript
67+
import { Footer } from "@communitiesuk/svelte-component-library";
68+
69+
// Use rebrand=true to show the crown logo at top of footer
70+
<Footer rebrand={true} />;
71+
```
72+
4973
### Importing Components
5074

5175
Import components directly from the package:

0 commit comments

Comments
 (0)