@nationalarchives/frontend 0.1.6-prerelease → 0.1.7-prerelease
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/govuk-prototype-kit.config.json +12 -5
- package/nationalarchives/all.css +1 -1
- package/nationalarchives/all.css.map +1 -1
- package/nationalarchives/all.js +1 -1
- package/nationalarchives/all.js.map +1 -1
- package/nationalarchives/components/_all.scss +1 -0
- package/nationalarchives/components/breadcrumbs/_index.scss +68 -0
- package/nationalarchives/components/breadcrumbs/breadcrumbs.stories.js +57 -0
- package/nationalarchives/components/breadcrumbs/fixtures.json +26 -0
- package/nationalarchives/components/breadcrumbs/macro-options.json +40 -0
- package/nationalarchives/components/breadcrumbs/macro.njk +3 -0
- package/nationalarchives/components/breadcrumbs/template.njk +13 -0
- package/nationalarchives/components/button/_index.scss +6 -6
- package/nationalarchives/components/button/button.stories.js +1 -1
- package/nationalarchives/components/card/_index.scss +52 -61
- package/nationalarchives/components/card/card.stories.js +3 -3
- package/nationalarchives/components/card/template.njk +1 -1
- package/nationalarchives/components/footer/_index.scss +54 -54
- package/nationalarchives/components/footer/footer.stories.js +1 -1
- package/nationalarchives/components/grid/_index.scss +79 -82
- package/nationalarchives/components/grid/grid.stories.js +4 -1
- package/nationalarchives/components/grid/macro-options.json +7 -1
- package/nationalarchives/components/grid/template.njk +3 -0
- package/nationalarchives/components/hero/_index.scss +132 -0
- package/nationalarchives/components/hero/fixtures.json +4 -0
- package/nationalarchives/components/hero/hero.stories.js +74 -0
- package/nationalarchives/components/hero/macro-options.json +58 -0
- package/nationalarchives/components/hero/macro.njk +3 -0
- package/nationalarchives/components/hero/template.njk +30 -0
- package/nationalarchives/components/sensitive-image/_index.scss +49 -53
- package/nationalarchives/components/sensitive-image/sensitive-image.js +1 -1
- package/nationalarchives/components/sensitive-image/sensitive-image.js.map +1 -1
- package/nationalarchives/components/sensitive-image/sensitive-image.mjs +1 -1
- package/nationalarchives/components/sensitive-image/sensitive-image.stories.js +37 -1
- package/nationalarchives/stories/development/about.mdx +1 -1
- package/nationalarchives/stories/development/publishing.mdx +1 -0
- package/nationalarchives/templates/homepage.njk +2 -2
- package/nationalarchives/templates/search-results.njk +38 -0
- package/nationalarchives/templates/topics.njk +42 -0
- package/nationalarchives/tools/_all.scss +1 -0
- package/nationalarchives/tools/_grid.scss +4 -4
- package/nationalarchives/tools/_media.scss +62 -0
- package/nationalarchives/tools/_typography.scss +2 -2
- package/nationalarchives/utilities/_global.scss +1 -1
- package/nationalarchives/utilities/_typography.scss +104 -141
- package/nationalarchives/variables/_all.scss +1 -0
- package/nationalarchives/variables/_colour.scss +1 -0
- package/nationalarchives/variables/_typography.scss +7 -7
- package/package.json +13 -5
@@ -14,9 +14,16 @@
|
|
14
14
|
"stylesheets": [
|
15
15
|
"/nationalarchives/all.css"
|
16
16
|
],
|
17
|
-
"templates":
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
17
|
+
"templates": [
|
18
|
+
{
|
19
|
+
"name": "Homepage",
|
20
|
+
"path": "/nationalarchives/templates/homepage.njk",
|
21
|
+
"type": "nunjucks"
|
22
|
+
},
|
23
|
+
{
|
24
|
+
"name": "Search results",
|
25
|
+
"path": "/nationalarchives/templates/search-results.njk",
|
26
|
+
"type": "nunjucks"
|
27
|
+
}
|
28
|
+
]
|
22
29
|
}
|
package/nationalarchives/all.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Roboto+Mono:wght@500;700&display=swap";@import"https://use.typekit.net/hkj3kuz.css";.tna-template{min-width:320px;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;font-size:16}@media(prefers-reduced-motion){.tna-template *{animation:none !important;transition:none !important}}.tna-template__body{margin:0;padding:0;background-color:#fff;overflow:auto}img,svg,video,canvas{max-width:100%;display:block}video,canvas{width:100%}*:focus{outline:3px #f0a solid}.tna-template{font-family:"Open Sans",sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:none;direction:ltr}.tna-template
|
1
|
+
@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Roboto+Mono:wght@500;700&display=swap";@import"https://use.typekit.net/hkj3kuz.css";.tna-template{min-width:320px;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;font-size:16}@media(prefers-reduced-motion){.tna-template *{animation:none !important;transition:none !important}}.tna-template__body{margin:0;padding:0;background-color:#fff;overflow:auto}img,svg,video,canvas{max-width:100%;display:block}video,canvas{width:100%}*:focus{outline:3px #f0a solid}.tna-template{font-family:"Open Sans",sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:none;direction:ltr}.tna-template p{margin:0 0 2rem}.tna-template p:last-child{margin-bottom:0}.tna-template a:active{text-decoration-thickness:4px}.tna-template a:hover{text-decoration-thickness:3px}.tna-template .tna-template__body{font-size:1rem;line-height:1.6}.tna-template .tna-ul,.tna-template .tna-ol{padding-left:2rem}.tna-template .tna-ul li::marker,.tna-template .tna-ol li::marker{color:#f0a;font-weight:700}.tna-template .tna-ul--plain,.tna-template .tna-ol--plain{padding-left:0;list-style:none}.tna-template .tna-heading{margin-top:0;margin-bottom:1.5rem;font-family:supria-sans-condensed,monospace;font-weight:600}.tna-template .tna-heading:last-child{margin-bottom:0}.tna-template .tna-heading--xl{font-size:4rem;line-height:1}.tna-template .tna-heading--l{font-size:2rem;line-height:1.2}.tna-template .tna-heading--m{font-size:1.25rem;line-height:1.4}.tna-template .tna-heading--s{font-size:1.125rem;line-height:1.6}.tna-template .tna-hgroup{margin-bottom:2rem}.tna-template .tna-hgroup:last-child{margin-bottom:0}.tna-template .tna-hgroup__supertitle{margin:0;font-size:0.875rem;font-family:"Roboto Mono",monospace;font-weight:500;text-transform:uppercase}.tna-template .tna-hgroup__title{margin:0}.tna-template .tna-hgroup__title .tna-hgroup__supertitle{display:block}.tna-template .tna-hgroup--xl .tna-hgroup__title{font-size:4rem}.tna-template .tna-hgroup--l .tna-hgroup__title{font-size:2rem}.tna-template .tna-hgroup--m .tna-hgroup__title{font-size:1.25rem}.tna-template .tna-hgroup--s .tna-hgroup__title{font-size:1.125rem}.tna-button{padding:.25rem 1rem;display:inline-block;color:#fff;font-weight:700;text-decoration:none;background-color:#000}.tna-button:hover{background-color:#069}.tna-button--secondary{color:#000;background-color:#ff0}.tna-button--secondary:hover{color:#fff}.tna-card__inner{display:-ms-flexbox;display:flex;-ms-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.tna-card__heading{order:2}.tna-card__title{order:2}.tna-card__image-container{order:1}.tna-card__body{order:3}.tna-card__actions{margin-top:2rem;order:4}.tna-card--featured{position:relative;background-color:#ff0}.tna-card--featured .tna-card__inner{margin-left:50%;padding:2rem}.tna-card--featured .tna-card__heading{padding-bottom:2rem;border-bottom:2px #000 solid}.tna-card--featured .tna-card__image-container{position:absolute;inset:0 50% 0 0}.tna-card--featured .tna-card__image{width:100%;height:100%;object-fit:cover}.tna-footer{padding-top:3rem;padding-bottom:3rem;color:#fff;background-color:#26262a}.tna-footer__link{color:inherit}.tna-footer__link:hover{color:#f0a}.tna-footer__navigation{padding-bottom:3rem}.tna-footer__navigation-group-items{padding-left:0;list-style:none}.tna-footer__social{padding-bottom:4rem}.tna-footer__social.tna-container{align-items:flex-end}.tna-footer__social-item{text-align:center}.tna-footer__social-item-link{display:block}.tna-footer__social-item-link-image{display:block}.tna-footer__licence.tna-container{align-items:center}.tna-footer__licence-logo{display:block}.tna-footer__govuk-link{display:inline-block;color:inherit;fill:#fff}.tna-footer__govuk-link:hover{color:#f0a;fill:#f0a}.tna-footer__govuk-logotype-crown{margin:0 auto;display:block;fill:inherit}.tna-container{max-width:75.25rem;width:100%;margin-right:auto;margin-left:auto;padding-right:1rem;padding-left:1rem;box-sizing:border-box;display:-ms-flexbox;display:flex;flex-wrap:wrap;justify-content:stretch;align-items:stretch}.tna-container--no-padding,.tna-container--no-padding-all{max-width:71.25rem}.tna-container--max{max-width:none}.tna-column{padding-right:1rem;padding-left:1rem;box-sizing:border-box}.tna-column--full{width:100%}.tna-column--container{display:-ms-flexbox;display:flex;flex-wrap:wrap;justify-content:stretch;align-items:stretch}.tna-column--flex-1{flex:1 0}.tna-column--flex-2{flex:2 0}.tna-column--flex-3{flex:3 0}.tna-container--no-padding,.tna-container--no-padding-all,.tna-container--no-padding-all>.tna-column,.tna-column--no-padding,.tna-column--container--no-padding-all,.tna-column--container--no-padding-all>.tna-column{padding-right:0;padding-left:0}.tna-column--width-1-12{width:8.3333333333%;flex:none}.tna-column--width-1-6{width:16.6666666667%;flex:none}.tna-column--width-1-4{width:25%;flex:none}.tna-column--width-1-3{width:33.3333333333%;flex:none}.tna-column--width-5-12{width:41.6666666667%;flex:none}.tna-column--width-1-2{width:50%;flex:none}.tna-column--width-7-12{width:58.3333333333%;flex:none}.tna-column--width-2-3{width:66.6666666667%;flex:none}.tna-column--width-3-4{width:75%;flex:none}.tna-column--width-5-6{width:83.3333333333%;flex:none}.tna-column--width-11-12{width:91.6666666667%;flex:none}@media(min-width: 769px)and (max-width: 1024px){.tna-column--full-medium{width:100%;flex:none}.tna-column--flex-1-medium{flex:1 0}.tna-column--flex-2-medium{flex:2 0}.tna-column--flex-3-medium{flex:3 0}.tna-column--width-1-6-medium{width:16.6666666667%;flex:none}.tna-column--width-1-3-medium{width:33.3333333333%;flex:none}.tna-column--width-1-2-medium{width:50%;flex:none}.tna-column--width-2-3-medium{width:66.6666666667%;flex:none}.tna-column--width-5-6-medium{width:83.3333333333%;flex:none}}@media(max-width: 768px){.tna-container{padding-right:1.125rem;padding-left:1.125rem}.tna-column{padding-right:.375rem;padding-left:.375rem}}@media(min-width: 481px)and (max-width: 768px){.tna-column--full-small{width:100%;flex:none}.tna-column--flex-1-small{flex:1 0}.tna-column--flex-2-small{flex:2 0}.tna-column--flex-3-small{flex:3 0}.tna-column--width-1-4-small{width:25%;flex:none}.tna-column--width-1-2-small{width:50%;flex:none}.tna-column--width-3-4-small{width:75%;flex:none}}@media(max-width: 480px){.tna-column--full-tiny{width:100%;flex:none}.tna-column--flex-1-tiny{width:auto;flex:1 0}.tna-column--flex-2-tiny{width:auto;flex:2 0}.tna-column--flex-3-tiny{width:auto;flex:3 0}.tna-column--width-1-2-tiny{width:50%;flex:none}}.tna-hero{min-height:min(20vw,300px);padding-top:5.25rem;padding-bottom:3.25rem;display:-ms-flexbox;display:flex;align-items:end;position:relative;background-color:#000}.tna-hero__image{width:100%;height:100%;position:absolute;inset:0;z-index:1;object-fit:cover}.tna-hero__image-details{position:absolute;right:1.25rem;bottom:1.25rem;z-index:3}.tna-hero__image-details-summary{width:2rem;height:2rem;position:relative;z-index:2;font-size:0;text-align:center;line-height:2rem;list-style:none;background-color:#fc0;border-radius:1rem;cursor:pointer}.tna-hero__image-details-summary-icon{font-size:1.25rem;font-style:normal;font-weight:700;text-transform:lowercase}.tna-hero__image-information{width:20rem;max-width:45vw;padding:.5rem 1rem;position:absolute;right:0;bottom:2.5rem;z-index:1;background-color:#fc0}.tna-hero__inner{position:relative;z-index:2}.tna-hero__content{padding-top:1.5rem;padding-bottom:1.5rem;background-color:#fff}.tna-hero__heading{margin-bottom:0}@media(max-width: 768px){.tna-hero{padding:0;display:block}.tna-hero__image{position:static}.tna-hero__image-details{bottom:auto;top:1.25rem}.tna-hero__image-information{top:2.5rem;bottom:auto}.tna-hero__content{color:#fff;background-color:inherit}}.tna-sensitive-image__details{position:relative}.tna-sensitive-image__details::after{width:100%;padding-bottom:calc(100%*var(--sensitive-image-height)/var(--sensitive-image-width));display:block;position:relative;z-index:-1;background-image:var(--sensitive-image);background-clip:padding-box;background-size:contain;filter:blur(20px) saturate(0);content:""}.tna-sensitive-image__show{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1;font-size:0;cursor:pointer}.tna-sensitive-image__show::after{padding:.5rem 2rem;font-size:1rem;background-color:#ff0;content:attr(data-action)}.tna-sensitive-image__show:hover::after{color:#fff;background-color:#000}.tna-sensitive-image__image{width:100%}.tna-sensitive-image__details[open]::after,.tna-sensitive-image__details[open] .tna-sensitive-image__show{display:none}/*# sourceMappingURL=all.css.map */
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../src/nationalarchives/utilities/_typography.scss","../../src/nationalarchives/utilities/_global.scss","../../src/nationalarchives/variables/_typography.scss","../../src/nationalarchives/tools/_typography.scss","../../src/nationalarchives/components/button/_index.scss","../../src/nationalarchives/components/card/_index.scss","../../src/nationalarchives/components/footer/_index.scss","../../src/nationalarchives/components/grid/_index.scss","../../src/nationalarchives/variables/_grid.scss","../../src/nationalarchives/tools/_grid.scss","../../src/nationalarchives/components/sensitive-image/_index.scss"],"names":[],"mappings":"AAIQ,sHACA,6CCHR,cACE,gBACA,WACA,YAEA,kBACA,gBACA,iCAEA,
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../src/nationalarchives/utilities/_typography.scss","../../src/nationalarchives/utilities/_global.scss","../../src/nationalarchives/variables/_typography.scss","../../src/nationalarchives/tools/_typography.scss","../../src/nationalarchives/components/button/_index.scss","../../src/nationalarchives/components/card/_index.scss","../../src/nationalarchives/components/footer/_index.scss","../../src/nationalarchives/components/grid/_index.scss","../../src/nationalarchives/variables/_grid.scss","../../src/nationalarchives/tools/_grid.scss","../../src/nationalarchives/tools/_media.scss","../../src/nationalarchives/components/hero/_index.scss","../../src/nationalarchives/components/sensitive-image/_index.scss"],"names":[],"mappings":"AAIQ,sHACA,6CCHR,cACE,gBACA,WACA,YAEA,kBACA,gBACA,iCAEA,UCXkB,GDalB,+BACE,gBACE,0BACA,4BAKN,oBACE,SACA,UAEA,sBAEA,cAGF,qBAIE,eAEA,cAGF,aAEE,WAGF,QACE,uBDtCF,cACE,YENiB,uBFOjB,YENiB,IFOjB,kCACA,mCACA,kCACA,8BACA,cAEA,gBACE,gBAEA,2BACE,gBAKF,uBACE,8BAGF,sBACE,8BAIJ,kCG9BA,eHgCE,gBAGF,4CAEE,kBAEA,kEACE,WACA,gBAIJ,0DAEE,eAEA,gBAGF,2BACE,aACA,qBAEA,YEvDkB,gCFwDlB,YEvDkB,IFyDlB,sCACE,gBAGF,+BG/DF,eHiEI,cAGF,8BGpEF,eHsEI,gBAGF,8BGzEF,kBH2EI,gBAGF,8BG9EF,mBHgFI,gBAIJ,0BACE,mBAEA,qCACE,gBAGF,sCACE,SG5FJ,mBH+FI,YE3Fe,wBF4Ff,YE3Fe,IF4Ff,yBAOF,iCACE,SAEA,yDACE,cAQF,iDGpHJ,eH6HI,gDG7HJ,eHsII,gDGtIJ,kBH+II,gDG/IJ,mBCJF,YACE,oBAEA,qBAEA,WACA,gBACA,qBAEA,sBAEA,kBACE,sBAGF,uBACE,WAEA,sBAEA,6BACE,WClBJ,iBACE,oBACA,aACA,wBACA,0BACA,sBAGF,mBACE,QAMF,iBACE,QAMF,2BACE,QAMF,gBAGE,QAGF,mBACE,gBAEA,QAMF,oBACE,kBAEA,sBAEA,qCACE,gBACA,aAGF,uCACE,oBAEA,6BAGF,+CACE,kBACA,gBAGF,qCACE,WACA,YACA,iBCvEN,YACE,iBACA,oBAEA,WAEA,yBAEA,kBACE,cAEA,wBACE,WAIJ,wBACE,oBASF,oCACE,eAEA,gBASF,oBACE,oBAEA,kCACE,qBAIJ,yBACE,kBAGF,8BACE,cAGF,oCACE,cAIA,mCACE,mBAIJ,0BACE,cAGF,wBACE,qBAEA,cACA,UAEA,8BACE,WACA,UAIJ,kCACE,cACA,cAEA,aC/EJ,eACE,UCNwB,SDOxB,WACA,kBACA,iBACA,mBACA,kBAEA,sBAEA,oBACA,aACA,eACA,wBACA,oBAEA,0DAEE,mBAGF,oBACE,eAIJ,YACE,mBACA,kBAEA,sBAEA,kBACE,WAGF,uBACE,oBACA,aACA,eACA,wBACA,oBAIA,oBACE,SADF,oBACE,SADF,oBACE,SAKN,uNAME,gBACA,eEpDM,wBACE,oBACA,UAFF,uBACE,qBACA,UAFF,uBACE,UACA,UAFF,uBACE,qBACA,UAFF,wBACE,qBACA,UAFF,uBACE,UACA,UAFF,wBACE,qBACA,UAFF,uBACE,qBACA,UAFF,uBACE,UACA,UAFF,uBACE,qBACA,UAFF,yBACE,qBACA,UCSR,gDHsDE,yBACE,WACA,UAIA,2BACE,SADF,2BACE,SADF,2BACE,SExEA,8BACE,qBACA,UAFF,8BACE,qBACA,UAFF,8BACE,UACA,UAFF,8BACE,qBACA,UAFF,8BACE,qBACA,WC6CR,yBHwCA,eACE,uBACA,sBAGF,YACE,sBACA,sBG7EF,+CHmFE,wBACE,WACA,UAIA,0BACE,SADF,0BACE,SADF,0BACE,SE3GA,6BACE,UACA,UAFF,6BACE,UACA,UAFF,6BACE,UACA,WCqBR,yBHoGE,uBACE,WACA,UAIA,yBACE,WAEA,SAHF,yBACE,WAEA,SAHF,yBACE,WAEA,SEpIA,4BACE,UACA,WEXV,UACE,2BACA,oBACA,uBAEA,oBACA,aACA,gBAEA,kBAEA,sBAEA,iBACE,WACA,YAEA,kBACA,QACA,UAEA,iBAGF,yBACE,kBACA,cACA,eACA,UAGF,iCACE,WACA,YAEA,kBACA,UAEA,YACA,kBACA,iBACA,gBAEA,sBAEA,mBAEA,eAGF,sCACE,kBACA,kBACA,gBACA,yBAGF,6BACE,YACA,eACA,mBAEA,kBACA,QACA,cACA,UAEA,sBAGF,iBACE,kBACA,UAGF,mBACE,mBACA,sBAEA,sBAGF,mBACE,gBD3BF,yBCxDF,UA0FI,UAEA,cAEA,iBACE,gBAGF,yBACE,YACA,YASF,6BACE,WACA,YAMF,mBACE,WAEA,0BCpHJ,8BACE,kBAIA,qCACE,WACA,qFAIA,cAEA,kBACA,WAEA,wCACA,4BACA,wBAEA,8BAEA,WAIJ,2BACE,aACA,mBACA,uBAEA,kBACA,QACA,UAEA,YAEA,eAEA,kCACE,mBT1CJ,eS6CI,sBAEA,0BAIA,wCACE,WAEA,sBAQN,4BACE,WAIA,0GAEE","file":"all.css"}
|
package/nationalarchives/all.js
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.TNAFrontend=t():e.TNAFrontend=t()}(self,(()=>(()=>{"use strict";var e={554:(e,t,i)=>{function o(e){this.$module=e,this.$imageDetails=e&&e.querySelector(".tna-sensitive-image__details"),this.$image=e&&e.querySelector(".tna-sensitive-image__image"),this.imageIsVisible=!1}i.d(t,{default:()=>n}),o.prototype.init=function(){console.log(this),this.$module&&this.$imageDetails&&this.$image&&this.$imageDetails.addEventListener("toggle",this.handleImageDetailsToggle.bind(this))},o.prototype.handleImageDetailsToggle=function(
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.TNAFrontend=t():e.TNAFrontend=t()}(self,(()=>(()=>{"use strict";var e={554:(e,t,i)=>{function o(e){this.$module=e,this.$imageDetails=e&&e.querySelector(".tna-sensitive-image__details"),this.$image=e&&e.querySelector(".tna-sensitive-image__image"),this.imageIsVisible=!1}i.d(t,{default:()=>n}),o.prototype.init=function(){console.log(this),this.$module&&this.$imageDetails&&this.$image&&this.$imageDetails.addEventListener("toggle",this.handleImageDetailsToggle.bind(this))},o.prototype.handleImageDetailsToggle=function(){this.$imageDetails.hasAttribute("open")&&this.$image.focus({preventScroll:!0,focusVisible:!0})};const n=o}},t={};function i(o){var n=t[o];if(void 0!==n)return n.exports;var r=t[o]={exports:{}};return e[o](r,r.exports,i),r.exports}i.d=(e,t)=>{for(var o in t)i.o(t,o)&&!i.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{i.r(o),i.d(o,{SensitiveImage:()=>e.default,initAll:()=>t});var e=i(554),t=function(t){var i=(void 0!==(t=void 0!==t?t:{}).scope?t.scope:document).querySelector('[data-module="tna-sensitive-image"]');new e.default(i).init()}})(),o})()));
|
2
2
|
//# sourceMappingURL=all.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"all.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,IACQ,mBAAXG,QAAyBA,OAAOC,IAC9CD,OAAO,GAAIH,GACe,iBAAZC,QACdA,QAAqB,YAAID,IAEzBD,EAAkB,YAAIC,GACvB,CATD,CASGK,MAAM,I,wCCTT,SAASC,EAAeC,GACtBC,KAAKD,QAAUA,EACfC,KAAKC,cACHF,GAAWA,EAAQG,cAAc,iCACnCF,KAAKG,OAASJ,GAAWA,EAAQG,cAAc,+BAC/CF,KAAKI,gBAAiB,CACxB,C,uBAEAN,EAAeO,UAAUC,KAAO,WAC9BC,QAAQC,IAAIR,MACPA,KAAKD,SAAYC,KAAKC,eAAkBD,KAAKG,QAGlDH,KAAKC,cAAcQ,iBACjB,SACAT,KAAKU,yBAAyBC,KAAKX,MAEvC,EAEAF,EAAeO,UAAUK,yBAA2B,
|
1
|
+
{"version":3,"file":"all.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,IACQ,mBAAXG,QAAyBA,OAAOC,IAC9CD,OAAO,GAAIH,GACe,iBAAZC,QACdA,QAAqB,YAAID,IAEzBD,EAAkB,YAAIC,GACvB,CATD,CASGK,MAAM,I,wCCTT,SAASC,EAAeC,GACtBC,KAAKD,QAAUA,EACfC,KAAKC,cACHF,GAAWA,EAAQG,cAAc,iCACnCF,KAAKG,OAASJ,GAAWA,EAAQG,cAAc,+BAC/CF,KAAKI,gBAAiB,CACxB,C,uBAEAN,EAAeO,UAAUC,KAAO,WAC9BC,QAAQC,IAAIR,MACPA,KAAKD,SAAYC,KAAKC,eAAkBD,KAAKG,QAGlDH,KAAKC,cAAcQ,iBACjB,SACAT,KAAKU,yBAAyBC,KAAKX,MAEvC,EAEAF,EAAeO,UAAUK,yBAA2B,WAC9CV,KAAKC,cAAcW,aAAa,SAClCZ,KAAKG,OAAOU,MAAM,CAAEC,eAAe,EAAMC,cAAc,GAE3D,EAEA,S,GCxBIC,EAA2B,CAAC,EAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBE,IAAjBD,EACH,OAAOA,EAAa1B,QAGrB,IAAIC,EAASsB,EAAyBE,GAAY,CAGjDzB,QAAS,CAAC,GAOX,OAHA4B,EAAoBH,GAAUxB,EAAQA,EAAOD,QAASwB,GAG/CvB,EAAOD,OACf,CCrBAwB,EAAoBK,EAAI,CAAC7B,EAAS8B,KACjC,IAAI,IAAIC,KAAOD,EACXN,EAAoBQ,EAAEF,EAAYC,KAASP,EAAoBQ,EAAEhC,EAAS+B,IAC5EE,OAAOC,eAAelC,EAAS+B,EAAK,CAAEI,YAAY,EAAMC,IAAKN,EAAWC,IAE1E,ECNDP,EAAoBQ,EAAI,CAACK,EAAKC,IAAUL,OAAOrB,UAAU2B,eAAeC,KAAKH,EAAKC,GCClFd,EAAoBiB,EAAKzC,IACH,oBAAX0C,QAA0BA,OAAOC,aAC1CV,OAAOC,eAAelC,EAAS0C,OAAOC,YAAa,CAAEC,MAAO,WAE7DX,OAAOC,eAAelC,EAAS,aAAc,CAAE4C,OAAO,GAAO,E,6FCHxDC,EAAU,SAACC,GAEf,IAEMC,QAFiC,KADvCD,OAA6B,IAAZA,EAA0BA,EAAU,CAAC,GACzBE,MAAwBF,EAAQE,MAAQC,UAEzCxC,cAC1B,uCAEF,IAAIJ,EAAAA,QAAe0C,GAAelC,MACpC,C","sources":["webpack://TNAFrontend/webpack/universalModuleDefinition","webpack://TNAFrontend/./src/nationalarchives/components/sensitive-image/sensitive-image.mjs","webpack://TNAFrontend/webpack/bootstrap","webpack://TNAFrontend/webpack/runtime/define property getters","webpack://TNAFrontend/webpack/runtime/hasOwnProperty shorthand","webpack://TNAFrontend/webpack/runtime/make namespace object","webpack://TNAFrontend/./src/nationalarchives/all.mjs"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"TNAFrontend\"] = factory();\n\telse\n\t\troot[\"TNAFrontend\"] = factory();\n})(self, () => {\nreturn ","function SensitiveImage($module) {\n this.$module = $module;\n this.$imageDetails =\n $module && $module.querySelector(\".tna-sensitive-image__details\");\n this.$image = $module && $module.querySelector(\".tna-sensitive-image__image\");\n this.imageIsVisible = false;\n}\n\nSensitiveImage.prototype.init = function () {\n console.log(this);\n if (!this.$module || !this.$imageDetails || !this.$image) {\n return;\n }\n this.$imageDetails.addEventListener(\n \"toggle\",\n this.handleImageDetailsToggle.bind(this)\n );\n};\n\nSensitiveImage.prototype.handleImageDetailsToggle = function () {\n if (this.$imageDetails.hasAttribute(\"open\")) {\n this.$image.focus({ preventScroll: true, focusVisible: true });\n }\n};\n\nexport default SensitiveImage;\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import SensitiveImage from \"./components/sensitive-image/sensitive-image.mjs\";\n\nconst initAll = (options) => {\n options = typeof options !== \"undefined\" ? options : {};\n const scope = typeof options.scope !== \"undefined\" ? options.scope : document;\n\n const $toggleButton = scope.querySelector(\n '[data-module=\"tna-sensitive-image\"]'\n );\n new SensitiveImage($toggleButton).init();\n};\n\nexport { initAll, SensitiveImage };\n"],"names":["root","factory","exports","module","define","amd","self","SensitiveImage","$module","this","$imageDetails","querySelector","$image","imageIsVisible","prototype","init","console","log","addEventListener","handleImageDetailsToggle","bind","hasAttribute","focus","preventScroll","focusVisible","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","hasOwnProperty","call","r","Symbol","toStringTag","value","initAll","options","$toggleButton","scope","document"],"sourceRoot":""}
|
@@ -0,0 +1,68 @@
|
|
1
|
+
@use "../../variables/colour";
|
2
|
+
@use "../../tools/media";
|
3
|
+
|
4
|
+
.tna-breadcrumbs {
|
5
|
+
&__list {
|
6
|
+
padding: 0;
|
7
|
+
|
8
|
+
list-style: none;
|
9
|
+
|
10
|
+
display: -ms-flexbox;
|
11
|
+
display: flex;
|
12
|
+
flex-wrap: wrap;
|
13
|
+
}
|
14
|
+
|
15
|
+
&__item {
|
16
|
+
display: -ms-flexbox;
|
17
|
+
display: flex;
|
18
|
+
|
19
|
+
+ .tna-breadcrumbs__item {
|
20
|
+
&::before {
|
21
|
+
margin: 0 0.5rem;
|
22
|
+
|
23
|
+
display: inline-block;
|
24
|
+
|
25
|
+
content: "\203A";
|
26
|
+
}
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
&__link {
|
31
|
+
display: inline-block;
|
32
|
+
|
33
|
+
color: colour.$base-font-colour;
|
34
|
+
|
35
|
+
&:hover {
|
36
|
+
color: #f0a;
|
37
|
+
}
|
38
|
+
}
|
39
|
+
|
40
|
+
@include media.on-mobile {
|
41
|
+
&__item {
|
42
|
+
&,
|
43
|
+
+ .tna-breadcrumbs__item {
|
44
|
+
&::before {
|
45
|
+
margin-left: 0;
|
46
|
+
|
47
|
+
display: none;
|
48
|
+
}
|
49
|
+
}
|
50
|
+
|
51
|
+
&:not(:nth-last-child(2)) {
|
52
|
+
display: none;
|
53
|
+
}
|
54
|
+
|
55
|
+
&:nth-last-child(2) {
|
56
|
+
.tna-breadcrumbs__link {
|
57
|
+
&::before {
|
58
|
+
// content: "\2190";
|
59
|
+
// content: "\21E6";
|
60
|
+
// content: "\21FD";
|
61
|
+
// content: "\2794";
|
62
|
+
content: "\2190\00a0"attr(data-prefix);
|
63
|
+
}
|
64
|
+
}
|
65
|
+
}
|
66
|
+
}
|
67
|
+
}
|
68
|
+
}
|
@@ -0,0 +1,57 @@
|
|
1
|
+
import Breadcrumbs from "./template.njk";
|
2
|
+
import "./_index.scss";
|
3
|
+
import macroOptions from "./macro-options.json";
|
4
|
+
|
5
|
+
const argTypes = {
|
6
|
+
items: { control: "object" },
|
7
|
+
classes: { control: "text" },
|
8
|
+
attributes: { control: "object" },
|
9
|
+
};
|
10
|
+
|
11
|
+
Object.keys(argTypes).forEach((argType) => {
|
12
|
+
argTypes[argType].description = macroOptions.find(
|
13
|
+
(option) => option.name === argType
|
14
|
+
)?.description;
|
15
|
+
});
|
16
|
+
|
17
|
+
export default {
|
18
|
+
title: "Components/Breadcrumbs",
|
19
|
+
argTypes,
|
20
|
+
};
|
21
|
+
|
22
|
+
const Template = ({ items, classes, attributes }) => {
|
23
|
+
return Breadcrumbs({
|
24
|
+
params: {
|
25
|
+
items,
|
26
|
+
classes,
|
27
|
+
attributes,
|
28
|
+
},
|
29
|
+
});
|
30
|
+
};
|
31
|
+
|
32
|
+
export const Standard = Template.bind({});
|
33
|
+
Standard.args = {
|
34
|
+
items: [
|
35
|
+
{
|
36
|
+
text: "Alpha",
|
37
|
+
href: "#/alpha",
|
38
|
+
},
|
39
|
+
{
|
40
|
+
text: "Beta",
|
41
|
+
href: "#/beta",
|
42
|
+
},
|
43
|
+
{
|
44
|
+
text: "Gamma",
|
45
|
+
href: "#/gamma",
|
46
|
+
},
|
47
|
+
{
|
48
|
+
text: "Delta",
|
49
|
+
href: "#/delta",
|
50
|
+
},
|
51
|
+
{
|
52
|
+
text: "Epsilon",
|
53
|
+
href: "#/epsilon",
|
54
|
+
},
|
55
|
+
],
|
56
|
+
classes: "tna-breadcrumbs--demo",
|
57
|
+
};
|
@@ -0,0 +1,26 @@
|
|
1
|
+
{
|
2
|
+
"component": "breadcrumbs",
|
3
|
+
"fixtures": [
|
4
|
+
{
|
5
|
+
"name": "plain breadcrumbs",
|
6
|
+
"options": {
|
7
|
+
"items": [
|
8
|
+
{
|
9
|
+
"text": "Alpha",
|
10
|
+
"href": "#/alpha"
|
11
|
+
},
|
12
|
+
{
|
13
|
+
"text": "Beta",
|
14
|
+
"href": "#/beta"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"text": "Gamma",
|
18
|
+
"href": "#/gamma"
|
19
|
+
}
|
20
|
+
]
|
21
|
+
},
|
22
|
+
"html": "<nav class=\"tna-breadcrumbs \">\n <ol class=\"tna-breadcrumbs__list\"><li class=\"tna-breadcrumbs__item\">\n <a href=\"#/alpha\" class=\"tna-breadcrumbs__link\" data-prefix=\"Back to\">\n Alpha\n </a>\n </li><li class=\"tna-breadcrumbs__item\">\n <a href=\"#/beta\" class=\"tna-breadcrumbs__link\" data-prefix=\"Back to\">\n Beta\n </a>\n </li><li class=\"tna-breadcrumbs__item\">\n <a href=\"#/gamma\" class=\"tna-breadcrumbs__link\" data-prefix=\"Back to\">\n Gamma\n </a>\n </li></ol>\n</nav>",
|
23
|
+
"hidden": false
|
24
|
+
}
|
25
|
+
]
|
26
|
+
}
|
@@ -0,0 +1,40 @@
|
|
1
|
+
[
|
2
|
+
{
|
3
|
+
"name": "items",
|
4
|
+
"type": "array",
|
5
|
+
"required": true,
|
6
|
+
"description": "",
|
7
|
+
"params": [
|
8
|
+
{
|
9
|
+
"name": "text",
|
10
|
+
"type": "string",
|
11
|
+
"required": true,
|
12
|
+
"description": ""
|
13
|
+
},
|
14
|
+
{
|
15
|
+
"name": "href",
|
16
|
+
"type": "string",
|
17
|
+
"required": true,
|
18
|
+
"description": ""
|
19
|
+
},
|
20
|
+
{
|
21
|
+
"name": "title",
|
22
|
+
"type": "string",
|
23
|
+
"required": false,
|
24
|
+
"description": ""
|
25
|
+
}
|
26
|
+
]
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"name": "classes",
|
30
|
+
"type": "string",
|
31
|
+
"required": false,
|
32
|
+
"description": "Classes to add to the button."
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"name": "attributes",
|
36
|
+
"type": "object",
|
37
|
+
"required": false,
|
38
|
+
"description": "HTML attributes (for example data attributes) to add to the button."
|
39
|
+
}
|
40
|
+
]
|
@@ -0,0 +1,13 @@
|
|
1
|
+
{%- set breadcrumbClasses = [params.classes] if params.classes else [] -%}
|
2
|
+
|
3
|
+
<nav class="tna-breadcrumbs {{ breadcrumbClasses | join(' ') }}" {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
|
4
|
+
<ol class="tna-breadcrumbs__list">
|
5
|
+
{%- for item in params.items -%}
|
6
|
+
<li class="tna-breadcrumbs__item">
|
7
|
+
<a href="{{ item.href }}" class="tna-breadcrumbs__link" data-prefix="{{ params.prefix if params.prefix else 'Back to' }}" {%- if item.title %} title="{{ item.title }}"{% endif %}>
|
8
|
+
{{ item.text }}
|
9
|
+
</a>
|
10
|
+
</li>
|
11
|
+
{%- endfor -%}
|
12
|
+
</ol>
|
13
|
+
</nav>
|
@@ -12,14 +12,14 @@
|
|
12
12
|
&:hover {
|
13
13
|
background-color: #069;
|
14
14
|
}
|
15
|
-
}
|
16
15
|
|
17
|
-
|
18
|
-
|
16
|
+
&--secondary {
|
17
|
+
color: #000;
|
19
18
|
|
20
|
-
|
19
|
+
background-color: #ff0;
|
21
20
|
|
22
|
-
|
23
|
-
|
21
|
+
&:hover {
|
22
|
+
color: #fff;
|
23
|
+
}
|
24
24
|
}
|
25
25
|
}
|
@@ -1,84 +1,75 @@
|
|
1
1
|
@use "../../tools/typography" as typographyTools;
|
2
2
|
|
3
3
|
.tna-card {
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
flex-direction: column;
|
12
|
-
}
|
13
|
-
|
14
|
-
.tna-card__heading {
|
15
|
-
order: 2;
|
16
|
-
}
|
4
|
+
&__inner {
|
5
|
+
display: -ms-flexbox;
|
6
|
+
display: flex;
|
7
|
+
-ms-box-orient: vertical;
|
8
|
+
-ms-flex-direction: column;
|
9
|
+
flex-direction: column;
|
10
|
+
}
|
17
11
|
|
18
|
-
|
19
|
-
|
12
|
+
&__heading {
|
13
|
+
order: 2;
|
14
|
+
}
|
20
15
|
|
21
|
-
|
22
|
-
|
23
|
-
}
|
16
|
+
&__supertitle {
|
17
|
+
}
|
24
18
|
|
25
|
-
|
26
|
-
|
19
|
+
&__title {
|
20
|
+
order: 2;
|
21
|
+
}
|
27
22
|
|
28
|
-
|
29
|
-
|
30
|
-
}
|
23
|
+
&__title-link {
|
24
|
+
}
|
31
25
|
|
32
|
-
|
33
|
-
|
26
|
+
&__image-container {
|
27
|
+
order: 1;
|
28
|
+
}
|
34
29
|
|
35
|
-
|
36
|
-
|
30
|
+
&__image {
|
31
|
+
}
|
37
32
|
|
38
|
-
|
39
|
-
|
33
|
+
&__body {
|
34
|
+
// margin-top: 2rem;
|
40
35
|
|
41
|
-
|
42
|
-
|
36
|
+
order: 3;
|
37
|
+
}
|
43
38
|
|
44
|
-
|
45
|
-
|
39
|
+
&__actions {
|
40
|
+
margin-top: 2rem;
|
46
41
|
|
47
|
-
|
48
|
-
}
|
42
|
+
order: 4;
|
43
|
+
}
|
49
44
|
|
50
|
-
|
51
|
-
|
45
|
+
&__action {
|
46
|
+
}
|
52
47
|
|
53
|
-
|
48
|
+
&--featured {
|
49
|
+
position: relative;
|
54
50
|
|
55
|
-
|
51
|
+
background-color: #ff0;
|
56
52
|
|
57
|
-
|
58
|
-
|
59
|
-
|
53
|
+
.tna-card__inner {
|
54
|
+
margin-left: 50%;
|
55
|
+
padding: 2rem;
|
56
|
+
}
|
60
57
|
|
61
|
-
|
62
|
-
|
58
|
+
.tna-card__heading {
|
59
|
+
padding-bottom: 2rem;
|
63
60
|
|
64
|
-
|
65
|
-
|
61
|
+
border-bottom: 2px #000 solid;
|
62
|
+
}
|
66
63
|
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
position: absolute;
|
73
|
-
top: 0;
|
74
|
-
right: 50%;
|
75
|
-
bottom: 0;
|
76
|
-
left: 0;
|
77
|
-
}
|
64
|
+
.tna-card__image-container {
|
65
|
+
position: absolute;
|
66
|
+
inset: 0 50% 0 0;
|
67
|
+
}
|
78
68
|
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
69
|
+
.tna-card__image {
|
70
|
+
width: 100%;
|
71
|
+
height: 100%;
|
72
|
+
object-fit: cover;
|
73
|
+
}
|
83
74
|
}
|
84
75
|
}
|
@@ -12,7 +12,7 @@ const argTypes = {
|
|
12
12
|
featured: { control: "boolean" },
|
13
13
|
htmlElement: { control: "text" },
|
14
14
|
classes: { control: "text" },
|
15
|
-
attributes: { control: "
|
15
|
+
attributes: { control: "object" },
|
16
16
|
};
|
17
17
|
|
18
18
|
Object.keys(argTypes).forEach((argType) => {
|
@@ -65,7 +65,7 @@ Standard.args = {
|
|
65
65
|
},
|
66
66
|
href: "#",
|
67
67
|
image: {
|
68
|
-
src: "https://
|
68
|
+
src: "https://picsum.photos/id/29/640/360",
|
69
69
|
alt: "A placeholder image",
|
70
70
|
},
|
71
71
|
body: "<p>Card body</p>",
|
@@ -91,7 +91,7 @@ Featured.args = {
|
|
91
91
|
},
|
92
92
|
href: "#",
|
93
93
|
image: {
|
94
|
-
src: "https://
|
94
|
+
src: "https://picsum.photos/id/24/640/360",
|
95
95
|
alt: "A placeholder image",
|
96
96
|
},
|
97
97
|
body: "<p>Card body</p>",
|