mirror of
https://github.com/GSA/notifications-admin.git
synced 2025-12-11 07:33:36 -05:00
c4544eb833
This commit adds a component for showing an API key. Usage:
```jinja
{{ from 'components/api-key.html' import api_key }}
{{ api_key('e1b0751388f3cd0fc9982c701acdb3c2') }}
```
Depending on the user’s browser, it works in three different ways.
No Javascript
---
The API key is shown on the page.
Older browsers with Javascript
---
The API key is hidden, and users can click a button to reveal it.
Newer browsers that support copying to clipboard without Flash
---
As above, but when the key is shown there is a button which copies it to the
clipboard. This is acheived by using
[this polyfill](https://www.npmjs.com/package/query-command-supported)
to reliably detect browser support for the ‘copy’ command.
The styling of the component is a bit different to the initial sketch. I think
a grey button works better than green. Green feels like it’s going to take you
somewhere else.
40 lines
1.1 KiB
JSON
40 lines
1.1 KiB
JSON
{
|
|
"name": "notifications-admin",
|
|
"version": "0.0.1",
|
|
"description": "Admin front end for GOV.UK Notify",
|
|
"engines": {
|
|
"node": "5.0.0"
|
|
},
|
|
"scripts": {
|
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
"postinstall": "./node_modules/bower/bin/bower install",
|
|
"build": "gulp",
|
|
"watch": "gulp watch"
|
|
},
|
|
"repository": {
|
|
"type": "git",
|
|
"url": "git+https://github.com/alphagov/notifications-admin.git"
|
|
},
|
|
"author": "Government Digital Service",
|
|
"license": "MIT",
|
|
"homepage": "https://github.com/alphagov/notifications-admin#readme",
|
|
"dependencies": {
|
|
"babel-core": "6.3.26",
|
|
"babel-preset-es2015": "6.3.13",
|
|
"bower": "1.7.1",
|
|
"govuk-elements-sass": "github:alphagov/govuk_elements#v1.1.1",
|
|
"govuk_frontend_toolkit": "4.6.0",
|
|
"gulp": "3.9.0",
|
|
"gulp-add-src": "0.2.0",
|
|
"gulp-babel": "6.1.1",
|
|
"gulp-concat": "2.6.0",
|
|
"gulp-include": "2.1.0",
|
|
"gulp-jquery": "1.1.1",
|
|
"gulp-load-plugins": "1.1.0",
|
|
"gulp-sass": "2.1.1",
|
|
"gulp-uglify": "1.5.1",
|
|
"jquery": "1.11.2",
|
|
"query-command-supported": "1.0.0"
|
|
}
|
|
}
|