Skip to content
This repository was archived by the owner on Mar 7, 2025. It is now read-only.

Commit 62cee01

Browse files
authored
docs: refactor govie ds naming to govie frontend (#220)
1 parent b3d243d commit 62cee01

File tree

13 files changed

+52
-52
lines changed

13 files changed

+52
-52
lines changed

.storybook/preview.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,7 @@ export const parameters = {
134134
'Install using precompiled files',
135135
'Import CSS, assets and JavaScript',
136136
'Configure components with JavaScript',
137-
'Localise Gov IE DS',
137+
'Localise Gov IE Frontend',
138138
'JavaScript API Reference',
139139
'Sass API Reference',
140140
'Colours',

README.md

+13-13
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,43 @@
1-
# Gov IE Design System
1+
# Gov IE Frontend
22

3-
Gov IE DS contains the code you need to start building a user interface for government platforms and services.
3+
Gov IE Frontend contains the code you need to start building a user interface for government platforms and services.
44

5-
See live examples of Gov IE components, and guidance on when to use them in your service, in the [Gov IE Design System](https://ogcio.github.io/ogcio-ds/).
5+
See live examples of Gov IE components, and guidance on when to use them in your service, in the [Gov IE Frontend](https://ogcio.github.io/ogcio-ds/).
66

77
## Contact the team
88

9-
If you want to know more about Gov IE Design System, you can go to the [Contact us](https://www.design-system.ogcio.gov.ie/contact/) page.
9+
If you want to know more about Gov IE Frontend, you can go to the [Contact us](https://www.design-system.ogcio.gov.ie/contact/) page.
1010

1111
## Quick start
1212

13-
There are 2 ways to start using Gov IE Design System components in your app.
13+
There are 2 ways to start using Gov IE Frontend components in your app.
1414

15-
Once installed, you will be able to use the code from the examples in the Gov IE Design System in your service.
15+
Once installed, you will be able to use the code from the examples in the Gov IE Frontend in your service.
1616

1717
### 1. Install with npm (recommended)
1818

19-
We recommend [installing Gov IE Design System using node package manager
19+
We recommend [installing Gov IE Frontend using node package manager
2020
(npm)](https://ogcio.github.io/ogcio-ds/?path=/docs/docs-install-with-npm--docs).
2121

2222
### 2. Install using compiled files
2323

24-
You can also install Gov IE Design System by [copying our CSS, JavaScript and asset files into your project](https://ogcio.github.io/ogcio-ds/?path=/docs/docs-install-using-precompiled-files--docs).
24+
You can also install Gov IE Frontend by [copying our CSS, JavaScript and asset files into your project](https://ogcio.github.io/ogcio-ds/?path=/docs/docs-install-using-precompiled-files--docs).
2525

2626
## Accessibility
2727

28-
The Gov IE DS team works hard to ensure that Gov IE DS is accessible.
28+
The Gov IE Frontend team works hard to ensure that Gov IE Frontend is accessible.
2929

3030
Using Frontend will help your service meet [level AA of WCAG 2.1](https://www.w3.org/TR/WCAG21/). But you must still check that your service meets accessibility requirements, especially if you extend or modify components.
3131

3232
You should also use:
3333

34-
- [the JavaScript from Gov IE DS](https://ogcio.github.io/ogcio-ds/?path=/docs/docs-import-css-assets-and-javascript--docs)
34+
- [the JavaScript from Gov IE Frontend](https://ogcio.github.io/ogcio-ds/?path=/docs/docs-import-css-assets-and-javascript--docs)
3535

36-
You can also read the [accessibility statement for Gov IE DS](https://www.design-system.ogcio.gov.ie/accessibility/)
36+
You can also read the [accessibility statement for Gov IE Frontend](https://www.design-system.ogcio.gov.ie/accessibility/)
3737

3838
## Getting updates
3939

40-
To be notified when there’s a new release, you can [watch the Gov IE DS Github repository](https://docs.github.com/en/github/managing-subscriptions-and-notifications-on-github/setting-up-notifications/configuring-notifications#configuring-your-watch-settings-for-an-individual-repository)
40+
To be notified when there’s a new release, you can [watch the Gov IE Frontend Github repository](https://docs.github.com/en/github/managing-subscriptions-and-notifications-on-github/setting-up-notifications/configuring-notifications#configuring-your-watch-settings-for-an-individual-repository)
4141

4242
Find out how to [update with npm](https://ogcio.github.io/ogcio-ds/?path=/story/docs-update-with-npm--docs/).
4343

@@ -127,7 +127,7 @@ To uninstall Husky hooks, run the following command:
127127
npm run husky:uninstall
128128
```
129129

130-
## Gov IE DS package publishing
130+
## Gov IE Frontend package publishing
131131

132132
- Use [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/) and [squash commits](https://github.com/googleapis/release-please?tab=readme-ov-file#linear-git-commit-history-use-squash-merge) to `main`
133133
- Versioning and npm package publishing is handled by the [Release Please GitHub action](https://github.com/google-github-actions/release-please-action)

src/govie/README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
## Structure
44

5-
Gov IE DS is broken into a number of layers in order to help provide a
5+
Gov IE Frontend is broken into a number of layers in order to help provide a
66
logical structure, loosely following the conventions of [ITCSS].
77

88
1. [Settings](#settings)

src/govie/all.mjs

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import Tooltip from './components/tooltip/tooltip.mjs';
2121
* Initialise all components
2222
*
2323
* Use the `data-module` attributes to find, instantiate and init all of the
24-
* components provided as part of Gov IE DS.
24+
* components provided as part of Gov IE Frontend.
2525
*
2626
* @param {object} [config] - Config
2727
* @param {HTMLElement} [config.scope=document] - Scope to query for components
@@ -34,7 +34,7 @@ import Tooltip from './components/tooltip/tooltip.mjs';
3434
function initAll(config) {
3535
config = typeof config !== 'undefined' ? config : {};
3636

37-
// Allow the user to initialise Gov IE DS in only certain sections of the page
37+
// Allow the user to initialise Gov IE Frontend in only certain sections of the page
3838
// Defaults to the entire document if nothing is set.
3939
var $scope = typeof config.scope !== 'undefined' ? config.scope : document;
4040

src/govie/components/header/Header.stories.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export default {
77
docs: {
88
description: {
99
component:
10-
'The Gov IE DS header shows users that they are on gov.ie and which service they are using.',
10+
'The Gov IE Frontend header shows users that they are on gov.ie and which service they are using.',
1111
},
1212
},
1313
},

src/govie/templates/basic-page/BasicPage.stories.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const Template = () => {
1919
2020
<head>
2121
<meta charset="utf-8">
22-
<title>Gov IE DS</title>
22+
<title>Gov IE Frontend</title>
2323
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
2424
<meta name="theme-color" content="#0b0c0c">
2525
<meta http-equiv="X-UA-Compatible" content="IE=edge">

storybook/stories/api-reference/sass-api-reference.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -408,7 +408,7 @@ $govie-show-breakpoints: false;
408408
#### $govie-font-family-lato
409409

410410
List of font families to use if using Lato (the default font 'stack for
411-
Gov IE DS)
411+
Gov IE Frontend)
412412

413413
#### Default value
414414

storybook/stories/get-started/configure-components-javascript.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Link } from '../components/Link.jsx';
55

66
# Configure components with JavaScript
77

8-
You can configure some of the components in Gov IE DS to customise their behaviour.
8+
You can configure some of the components in Gov IE Frontend to customise their behaviour.
99

1010
You can configure a component by:
1111

storybook/stories/get-started/get-started.mdx

+8-8
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,19 @@ import { Link } from '../components/Link.jsx';
55

66
# Get started
77

8-
Get one Gov IE DS component working in your application, so you can test everything works before you add more components or styles.
8+
Get one Gov IE Frontend component working in your application, so you can test everything works before you add more components or styles.
99

1010
You will need to do all the following steps to get your component working.
1111

12-
1. Install Gov IE DS package.
12+
1. Install Gov IE Frontend package.
1313
2. Add the HTML for a component to your application.
1414
3. Get the CSS working.
1515
4. Get the font and images working.
1616
5. Get the JavaScript working.
1717

18-
## 1. Install Gov IE DS package
18+
## 1. Install Gov IE Frontend package
1919

20-
- You can <Link href="?path=/docs/docs-install-with-npm--docs">install Gov IE DS using npm</Link>.
20+
- You can <Link href="?path=/docs/docs-install-with-npm--docs">install Gov IE Frontend using npm</Link>.
2121

2222
- If you've <Link href='?path=/story/docs-install-using-precompiled-files--docs'>installed using precompiled files</Link>, get started with a <Link href='?path=/story/docs-install-using-precompiled-files--docs#basic-example-page'>a basic page instead</Link>.
2323

@@ -29,7 +29,7 @@ You will need to do all the following steps to get your component working.
2929

3030
## 3. Get the CSS working
3131

32-
1. Add the following to the main Sass file in your project, so your Sass compiler adds all of Gov IE DS styles to your CSS file.
32+
1. Add the following to the main Sass file in your project, so your Sass compiler adds all of Gov IE Frontend styles to your CSS file.
3333

3434
```sass
3535
@import '@ogcio/ogcio-ds/govie/all';
@@ -48,11 +48,11 @@ Run your application and check that the accordion displays correctly.
4848

4949
The accordion will use a generic font until you get the font and images working, and will not be interactive until you get the JavaScript working.
5050

51-
There are also different ways you can <Link href='?path=/docs/docs-import-css-assets-and-javascript--docs'>import Gov IE DS CSS</Link>.
51+
There are also different ways you can <Link href='?path=/docs/docs-import-css-assets-and-javascript--docs'>import Gov IE Frontend CSS</Link>.
5252

5353
## 4. Get the font and images working
5454

55-
Your component will not use the right font or images until you've added Gov IE DS assets to your application.
55+
Your component will not use the right font or images until you've added Gov IE Frontend assets to your application.
5656

5757
1. Copy the following 2 folders:
5858

@@ -92,7 +92,7 @@ Run your application and check it works the same way as the Design System accord
9292

9393
In your live application:
9494

95-
- You must use `initAll` to initialise all components that use Gov IE DS JavaScript, or some components will not work correctly for disabled users who use assistive technologies
95+
- You must use `initAll` to initialise all components that use Gov IE Frontend JavaScript, or some components will not work correctly for disabled users who use assistive technologies
9696

9797
We recommend <Link href='?path=/docs/docs-import-css-assets-and-javascript--docs#import-javascript'>using an automated task or your build pipeline</Link> instead of copying the files manually
9898

storybook/stories/get-started/import-assets.mdx

+10-10
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { Canvas, Meta } from '@storybook/blocks';
88

99
### Import all the CSS
1010

11-
To import all the Sass rules from Gov IE DS, add the following to your Sass file:
11+
To import all the Sass rules from Gov IE Frontend, add the following to your Sass file:
1212

1313
```sass
1414
@import "@ogcio/ogcio-ds/govie/all";
@@ -21,7 +21,7 @@ If you want to improve how quickly your service's pages load in browsers, you ca
2121
- Import `@ogcio/ogcio-ds/govie/base` in your Sass file.
2222
- Import the parts of the CSS you need.
2323

24-
For example, add the following to your Sass file to import the CSS you need for a basic Gov IE DS page.
24+
For example, add the following to your Sass file to import the CSS you need for a basic Gov IE Frontend page.
2525

2626
```sass
2727
@import "@ogcio/ogcio-ds/govie/base";\n
@@ -48,16 +48,16 @@ To import the button component for example, add the following to your Sass file:
4848

4949
### Override with your own CSS
5050

51-
If you want to override Gov IE DS styles with your own styles, `@import` Gov IE DS styles before your own Sass rules.
51+
If you want to override Gov IE Frontend styles with your own styles, `@import` Gov IE Frontend styles before your own Sass rules.
5252

5353
<h2 id="fonts-and-images-assets">Font and image assets</h2>
5454

55-
To use the font and image assets from Gov IE DS, you can either:
55+
To use the font and image assets from Gov IE Frontend, you can either:
5656

57-
- serve the assets from the Gov IE DS assets folder - recommended
57+
- serve the assets from the Gov IE Frontend assets folder - recommended
5858
- copy the font and image files into your application
5959

60-
### Serve the assets from the Gov IE DS assets folder - recommended
60+
### Serve the assets from the Gov IE Frontend assets folder - recommended
6161

6262
Set up your routing so that requests for files in `<YOUR-SITE-URL>/assets` are served from `/node_modules/@ogcio/ogcio-ds/govie/assets`.
6363

@@ -78,7 +78,7 @@ If you decide to copy the assets instead, copy the:
7878
- `/node_modules/@ogcio/ogcio-ds/govie/assets/images` folder to `<YOUR-APP>/assets/images`
7979
- `/node_modules/@ogcio/ogcio-ds/govie/assets/fonts` folder to `<YOUR-APP>/assets/fonts`
8080

81-
You should use an automated task or your build pipeline to copy the files, so your project folder stays up to date when we update Gov IE DS.
81+
You should use an automated task or your build pipeline to copy the files, so your project folder stays up to date when we update Gov IE Frontend.
8282

8383
#### If you have your own folder structure
8484

@@ -106,9 +106,9 @@ You can also use your own function to generate paths, for example if you're usin
106106

107107
<h2 id="import-javascript">JavaScript</h2>
108108

109-
To import the JavaScript from Gov IE DS, you can either:
109+
To import the JavaScript from Gov IE Frontend, you can either:
110110

111-
- add Gov IE DS's JavaScript file to your HTML
111+
- add Gov IE Frontend's JavaScript file to your HTML
112112
- import JavaScript using a bundle
113113

114114
r
@@ -164,7 +164,7 @@ if ($radios) {
164164
}
165165
```
166166

167-
If you need to import all of Gov IE DS components, then run the `initAll` function to initialise them:
167+
If you need to import all of Gov IE Frontend components, then run the `initAll` function to initialise them:
168168

169169
```javascript
170170
import { initAll } from '@ogcio/ogcio-ds';

storybook/stories/get-started/install-with-files.mdx

+4-4
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Link, ReleaseLink } from '../components/Link.jsx';
55

66
# Install using precompiled files
77

8-
You can install Gov IE DS by copying our CSS, JavaScript and asset files into your project. If you install this way, you can try Gov IE DS in your application without having to make many changes.
8+
You can install Gov IE Frontend by copying our CSS, JavaScript and asset files into your project. If you install this way, you can try Gov IE Frontend in your application without having to make many changes.
99

1010
> ! In your live application, you should install with Node.js package manager (npm) instead.
1111
@@ -15,7 +15,7 @@ You'll not be able to:
1515

1616
- Change <Link href='?path=/story/docs-sass-api-reference--docs'>Sass settings</Link>, for example override colours or set your own font
1717
- Import an individual component's CSS or JavaScript
18-
- Use Gov IE DS colours or mixins in your custom code
18+
- Use Gov IE Frontend colours or mixins in your custom code
1919

2020
## Copy the files
2121

@@ -32,7 +32,7 @@ You'll not be able to:
3232
<!doctype html>
3333
<html lang="en" className="govie-template ">
3434
<head>
35-
<title>Example - Gov IE Design System</title>
35+
<title>Example - Gov IE Frontend</title>
3636
<meta
3737
name="viewport"
3838
content="width=device-width, initial-scale=1, viewport-fit=cover"
@@ -57,7 +57,7 @@ You'll not be able to:
5757
</html>
5858
```
5959

60-
2. Replace `<VERSION-NUMBER>` so the 3 filenames match the files you copied from Gov IE DS GitHub repo.
60+
2. Replace `<VERSION-NUMBER>` so the 3 filenames match the files you copied from Gov IE Frontend GitHub repo.
6161
3. Go to the <Link href='?path=/docs/typography-accordion--default'>example accordion component</Link> on the Design System website and copy the HTML from the first example.
6262
4. Replace `<!-- component HTML -->` with the accordion HTML you copied.
6363
5. Run your application - you can check it works the same way as the <Link href="iframe.html?id=typography-accordion--default&viewMode=story">Design System accordion example</Link> by selecting the buttons and checking the accordion 'shows' and 'hides' sections.

storybook/stories/get-started/install-with-npm.mdx

+6-6
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { Link } from '../components/Link.jsx';
1414
npm init
1515
```
1616

17-
3. Install the Gov IE DS package
17+
3. Install the Gov IE Frontend package
1818

1919
```
2020
npm install @ogcio/ogcio-ds --save
@@ -26,11 +26,11 @@ You should now get started by <Link href='?path=/docs/docs-get-started--docs'>ge
2626

2727
## Update using Node.js package manager (npm)
2828

29-
You can update with Node.js package manager (npm) if you originally installed Gov IE DS with npm (mentioned above).
29+
You can update with Node.js package manager (npm) if you originally installed Gov IE Frontend with npm (mentioned above).
3030

3131
### Find out which version you're using
3232

33-
To find out which version of Gov IE DS your project is using, you can run:
33+
To find out which version of Gov IE Frontend your project is using, you can run:
3434

3535
```
3636
npm list @ogcio/ogcio-ds
@@ -42,11 +42,11 @@ If you do not have command line access, you can see the version number in the `p
4242
"@ogcio/ogcio-ds": "0.0.8"
4343
```
4444

45-
## Update Gov IE DS using npm
45+
## Update Gov IE Frontend using npm
4646

47-
To find out the latest version of Gov IE DS, check the [release notes](https://github.com/ogcio/ogcio-ds/releases) in the Gov IE DS GitHub repository.
47+
To find out the latest version of Gov IE Frontend, check the [release notes](https://github.com/ogcio/ogcio-ds/releases) in the Gov IE Frontend GitHub repository.
4848

49-
You may need to make code changes to keep Gov IE DS working in your project, if the major version number changes when you update. The major version number is the first digit in the version number.
49+
You may need to make code changes to keep Gov IE Frontend working in your project, if the major version number changes when you update. The major version number is the first digit in the version number.
5050

5151
To update to the most recent version, run:
5252

storybook/stories/get-started/localisation.mdx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import { Canvas, Meta } from '@storybook/blocks';
22
import { Link } from '../components/Link.jsx';
33

4-
<Meta title="Docs/Localise Gov IE DS" />
4+
<Meta title="Docs/Localise Gov IE Frontend" />
55

6-
# Localise Gov IE DS
6+
# Localise Gov IE Frontend
77

8-
Gov IE DS uses English by default. You're responsible for providing any translations for any other language you need for your service.
8+
Gov IE Frontend uses English by default. You're responsible for providing any translations for any other language you need for your service.
99

1010
There are three types of text you might want to translate into another language.
1111

0 commit comments

Comments
 (0)