RubyGems - govuk_publishing_components - Versions diffs - 62.0.0 → 62.1.0 - Mend

govuk_publishing_components 62.0.0 → 62.1.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.

Files changed (190) hide show

data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs CHANGED Viewed

@@ -117,7 +117,7 @@ class FileUpload extends ConfigurableComponent {
     if (this.$button.disabled) return;
     if (event.target instanceof Node) {
       if (this.$root.contains(event.target)) {
-        if (event.dataTransfer && isContainingFiles(event.dataTransfer)) {
+        if (event.dataTransfer && this.canDrop(event.dataTransfer)) {
           if (!this.$button.classList.contains('govuk-file-upload-button--dragging')) {
             this.showDraggingState();
             this.$announcements.innerText = this.i18n.t('enteredDropZone');
@@ -139,12 +139,30 @@ class FileUpload extends ConfigurableComponent {
   }
   onDrop(event) {
     event.preventDefault();
-    if (event.dataTransfer && isContainingFiles(event.dataTransfer)) {
+    if (event.dataTransfer && this.canFillInput(event.dataTransfer)) {
       this.$input.files = event.dataTransfer.files;
       this.$input.dispatchEvent(new CustomEvent('change'));
       this.hideDraggingState();
     }
   }
+  canFillInput(dataTransfer) {
+    return this.matchesInputCapacity(dataTransfer.files.length);
+  }
+  canDrop(dataTransfer) {
+    if (dataTransfer.items.length) {
+      return this.matchesInputCapacity(countFileItems(dataTransfer.items));
+    }
+    if (dataTransfer.types.length) {
+      return dataTransfer.types.includes('Files');
+    }
+    return true;
+  }
+  matchesInputCapacity(numberOfFiles) {
+    if (this.$input.multiple) {
+      return numberOfFiles > 0;
+    }
+    return numberOfFiles === 1;
+  }
   onChange() {
     const fileCount = this.$input.files.length;
     if (fileCount === 0) {
@@ -191,6 +209,13 @@ class FileUpload extends ConfigurableComponent {
     this.$root.classList.toggle('govuk-drop-zone--disabled', this.$button.disabled);
   }
 }
+/**
+ * Counts the number of `DataTransferItem` whose kind is `file`
+ *
+ * @param {DataTransferItemList} list - The list
+ * @returns {number} - The number of items whose kind is `file` in the list
+ */
 FileUpload.moduleName = 'govuk-file-upload';
 FileUpload.defaults = Object.freeze({
   i18n: {
@@ -212,10 +237,14 @@ FileUpload.schema = Object.freeze({
     }
   }
 });
-function isContainingFiles(dataTransfer) {
-  const hasNoTypesInfo = dataTransfer.types.length === 0;
-  const isDraggingFiles = dataTransfer.types.some(type => type === 'Files');
-  return hasNoTypesInfo || isDraggingFiles;
+function countFileItems(list) {
+  let result = 0;
+  for (let i = 0; i < list.length; i++) {
+    if (list[i].kind === 'file') {
+      result++;
+    }
+  }
+  return result;
 }
 /**

data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"file-upload.mjs","sources":["../../../../src/govuk/components/file-upload/file-upload.mjs"],"sourcesContent":["import { closestAttributeValue } from '../../common/closest-attribute-value.mjs'\nimport { ConfigurableComponent } from '../../common/configuration.mjs'\nimport { formatErrorMessage } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { I18n } from '../../i18n.mjs'\n\n/*\n File upload component\n \n @preserve\n * @augments ConfigurableComponent<FileUploadConfig>\n /\nexport class FileUpload extends ConfigurableComponent {\n /\n @private\n * @type {HTMLFileInputElement}\n /\n $input\n\n /\n @private\n /\n $button\n\n /\n @private\n /\n $status\n\n /* @private /\n i18n\n\n /* @private /\n id\n\n /* @private /\n $announcements\n\n /\n @private\n * @type {boolean \| undefined}\n /\n enteredAnotherElement\n\n /\n @param {Element \| null} $root - File input element\n * @param {FileUploadConfig} [config] - File Upload config\n /\n constructor($root, config = {}) {\n super($root, config)\n\n const $input = this.$root.querySelector('input')\n\n if ($input === null) {\n throw new ElementError({\n component: FileUpload,\n identifier: 'File inputs (`<input type=\"file\">`)'\n })\n }\n\n if ($input.type !== 'file') {\n throw new ElementError(\n formatErrorMessage(\n FileUpload,\n 'File input (`<input type=\"file\">`) attribute (`type`) is not `file`'\n )\n )\n }\n\n this.$input = /* @type {HTMLFileInputElement} / ($input)\n\n if (!this.$input.id) {\n throw new ElementError({\n component: FileUpload,\n identifier: 'File input (`<input type=\"file\">`) attribute (`id`)'\n })\n }\n\n this.id = this.$input.id\n\n this.i18n = new I18n(this.config.i18n, {\n // Read the fallback if necessary rather than have it set in the defaults\n locale: closestAttributeValue(this.$root, 'lang')\n })\n\n const $label = this.findLabel()\n // Add an ID to the label if it doesn't have one already\n // so it can be referenced by `aria-labelledby`\n if (!$label.id) {\n $label.id = `${this.id}-label`\n }\n\n // we need to copy the 'id' of the root element\n // to the new button replacement element\n // so that focus will work in the error summary\n this.$input.id = `${this.id}-input`\n\n // Hide the native input\n this.$input.setAttribute('hidden', 'true')\n\n // Create the file selection button\n const $button = document.createElement('button')\n $button.classList.add('govuk-file-upload-button')\n $button.type = 'button'\n $button.id = this.id\n $button.classList.add('govuk-file-upload-button--empty')\n\n // Copy `aria-describedby` if present so hints and errors\n // are associated to the `<button>`\n const ariaDescribedBy = this.$input.getAttribute('aria-describedby')\n if (ariaDescribedBy) {\n $button.setAttribute('aria-describedby', ariaDescribedBy)\n }\n\n // Create status element that shows what/how many files are selected\n const $status = document.createElement('span')\n $status.className = 'govuk-body govuk-file-upload-button__status'\n $status.setAttribute('aria-live', 'polite')\n $status.innerText = this.i18n.t('noFileChosen')\n\n $button.appendChild($status)\n\n const commaSpan = document.createElement('span')\n commaSpan.className = 'govuk-visually-hidden'\n commaSpan.innerText = ', '\n commaSpan.id = `${this.id}-comma`\n\n $button.appendChild(commaSpan)\n\n const containerSpan = document.createElement('span')\n containerSpan.className =\n 'govuk-file-upload-button__pseudo-button-container'\n\n const buttonSpan = document.createElement('span')\n buttonSpan.className =\n 'govuk-button govuk-button--secondary govuk-file-upload-button__pseudo-button'\n buttonSpan.innerText = this.i18n.t('chooseFilesButton')\n\n containerSpan.appendChild(buttonSpan)\n\n // Add a space so the button and instruction read correctly\n // when CSS is disabled\n containerSpan.insertAdjacentText('beforeend', ' ')\n\n const instructionSpan = document.createElement('span')\n instructionSpan.className =\n 'govuk-body govuk-file-upload-button__instruction'\n instructionSpan.innerText = this.i18n.t('dropInstruction')\n\n containerSpan.appendChild(instructionSpan)\n\n $button.appendChild(containerSpan)\n $button.setAttribute(\n 'aria-labelledby',\n `${$label.id} ${commaSpan.id} ${$button.id}`\n )\n $button.addEventListener('click', this.onClick.bind(this))\n $button.addEventListener('dragover', (event) => {\n // prevent default to allow drop\n event.preventDefault()\n })\n\n // Assemble these all together\n this.$root.insertAdjacentElement('afterbegin', $button)\n\n this.$input.setAttribute('tabindex', '-1')\n this.$input.setAttribute('aria-hidden', 'true')\n\n // Make all these new variables available to the module\n this.$button = $button\n this.$status = $status\n\n // Bind change event to the underlying input\n this.$input.addEventListener('change', this.onChange.bind(this))\n\n // Synchronise the `disabled` state between the button and underlying input\n this.updateDisabledState()\n this.observeDisabledState()\n\n // Handle drop zone visibility\n // A live region to announce when users enter or leave the drop zone\n this.$announcements = document.createElement('span')\n this.$announcements.classList.add('govuk-file-upload-announcements')\n this.$announcements.classList.add('govuk-visually-hidden')\n this.$announcements.setAttribute('aria-live', 'assertive')\n this.$root.insertAdjacentElement('afterend', this.$announcements)\n\n // if there is no CSS and input is hidden\n // button will need to handle drop event\n this.$button.addEventListener('drop', this.onDrop.bind(this))\n\n // While user is dragging, it gets a little more complex because of Safari.\n // Safari doesn't fill `relatedTarget` on `dragleave` (nor `dragenter`).\n // This means we can't use `relatedTarget` to:\n // - check if the user is still within the wrapper\n // (`relatedTarget` being a descendant of the wrapper)\n // - check if the user is still over the viewport\n // (`relatedTarget` being null if outside)\n\n // Thanks to `dragenter` bubbling, we can listen on the `document` with a\n // single function and update the visibility based on whether we entered a\n // node inside or outside the wrapper.\n document.addEventListener(\n 'dragenter',\n this.updateDropzoneVisibility.bind(this)\n )\n\n // To detect if we're outside the document, we can track if there was a\n // `dragenter` event preceding a `dragleave`. If there wasn't, this means\n // we're outside the document.\n //\n // The order of events is guaranteed by the HTML specs:\n // https://html.spec.whatwg.org/multipage/dnd.html#drag-and-drop-processing-model\n document.addEventListener('dragenter', () => {\n this.enteredAnotherElement = true\n })\n\n document.addEventListener('dragleave', () => {\n if (!this.enteredAnotherElement && !this.$button.disabled) {\n this.hideDraggingState()\n this.$announcements.innerText = this.i18n.t('leftDropZone')\n }\n\n this.enteredAnotherElement = false\n })\n }\n\n /\n Updates the visibility of the dropzone as users enters the various elements on the page\n \n @private\n * @param {DragEvent} event - The `dragenter` event\n /\n updateDropzoneVisibility(event) {\n if (this.$button.disabled) return\n\n // DOM interfaces only type `event.target` as `EventTarget`\n // so we first need to make sure it's a `Node`\n if (event.target instanceof Node) {\n if (this.$root.contains(event.target)) {\n if (event.dataTransfer && isContainingFiles(event.dataTransfer)) {\n // Only update the class and make the announcement if not already visible\n // to avoid repeated announcements on NVDA (2024.4) + Firefox (133)\n if (\n !this.$button.classList.contains(\n 'govuk-file-upload-button--dragging'\n )\n ) {\n this.showDraggingState()\n this.$announcements.innerText = this.i18n.t('enteredDropZone')\n }\n }\n } else {\n // Only hide the dropzone if it is visible to prevent announcing user\n // left the drop zone when they enter the page but haven't reached yet\n // the file upload component\n if (\n this.$button.classList.contains('govuk-file-upload-button--dragging')\n ) {\n this.hideDraggingState()\n this.$announcements.innerText = this.i18n.t('leftDropZone')\n }\n }\n }\n }\n\n /\n Show the drop zone visually\n \n @private\n /\n showDraggingState() {\n this.$button.classList.add('govuk-file-upload-button--dragging')\n }\n\n /\n Hides the drop zone visually\n \n @private\n /\n hideDraggingState() {\n this.$button.classList.remove('govuk-file-upload-button--dragging')\n }\n\n /\n Handles user dropping on the component\n \n @private\n * @param {DragEvent} event - The `dragenter` event\n /\n onDrop(event) {\n event.preventDefault()\n\n if (event.dataTransfer && isContainingFiles(event.dataTransfer)) {\n this.$input.files = event.dataTransfer.files\n\n // Dispatch a `change` event so external code that would rely on the `<input>`\n // dispatching an event when files are dropped still work.\n // Use a `CustomEvent` so our events are distinguishable from browser's native events\n this.$input.dispatchEvent(new CustomEvent('change'))\n\n this.hideDraggingState()\n }\n }\n\n /\n Check if the value of the underlying input has changed\n \n @private\n /\n onChange() {\n const fileCount = this.$input.files.length\n\n if (fileCount === 0) {\n // If there are no files, show the default selection text\n this.$status.innerText = this.i18n.t('noFileChosen')\n this.$button.classList.add('govuk-file-upload-button--empty')\n } else {\n if (\n // If there is 1 file, just show the file name\n fileCount === 1\n ) {\n this.$status.innerText = this.$input.files[0].name\n } else {\n // Otherwise, tell the user how many files are selected\n this.$status.innerText = this.i18n.t('multipleFilesChosen', {\n count: fileCount\n })\n }\n\n this.$button.classList.remove('govuk-file-upload-button--empty')\n }\n }\n\n /\n Looks up the `<label>` element associated to the field\n \n @private\n * @returns {HTMLElement} The `<label>` element associated to the field\n * @throws {ElementError} If the `<label>` cannot be found\n /\n findLabel() {\n // Use `label` in the selector so TypeScript knows the type fo `HTMLElement`\n const $label = document.querySelector(`label[for=\"${this.$input.id}\"]`)\n\n if (!$label) {\n throw new ElementError({\n component: FileUpload,\n identifier: `Field label (\\`<label for=${this.$input.id}>\\`)`\n })\n }\n\n return $label\n }\n\n /\n When the button is clicked, emulate clicking the actual, hidden file input\n \n @private\n /\n onClick() {\n this.$input.click()\n }\n\n /\n Create a mutation observer to check if the input's attributes altered.\n \n @private\n /\n observeDisabledState() {\n const observer = new MutationObserver((mutationList) => {\n for (const mutation of mutationList) {\n if (\n mutation.type === 'attributes' &&\n mutation.attributeName === 'disabled'\n ) {\n this.updateDisabledState()\n }\n }\n })\n\n observer.observe(this.$input, {\n attributes: true\n })\n }\n\n /\n Synchronise the `disabled` state between the input and replacement button.\n \n @private\n /\n updateDisabledState() {\n this.$button.disabled = this.$input.disabled\n\n this.$root.classList.toggle(\n 'govuk-drop-zone--disabled',\n this.$button.disabled\n )\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n /\n static moduleName = 'govuk-file-upload'\n\n /\n File upload default config\n \n @see {@link FileUploadConfig}\n * @constant\n * @type {FileUploadConfig}\n /\n static defaults = Object.freeze({\n i18n: {\n chooseFilesButton: 'Choose file',\n dropInstruction: 'or drop file',\n noFileChosen: 'No file chosen',\n multipleFilesChosen: {\n // the 'one' string isn't used as the component displays the filename\n // instead, however it's here for coverage's sake\n one: '%{count} file chosen',\n other: '%{count} files chosen'\n },\n enteredDropZone: 'Entered drop zone',\n leftDropZone: 'Left drop zone'\n }\n })\n\n /\n File upload config schema\n \n @constant\n * @satisfies {Schema<FileUploadConfig>}\n /\n static schema = Object.freeze({\n properties: {\n i18n: { type: 'object' }\n }\n })\n}\n\n/\n Checks if the given `DataTransfer` contains files\n \n @internal\n * @param {DataTransfer} dataTransfer - The `DataTransfer` to check\n * @returns {boolean} - `true` if it contains files or we can't infer it, `false` otherwise\n /\nfunction isContainingFiles(dataTransfer) {\n // Safari sometimes does not provide info about types :'(\n // In which case best not to assume anything and try to set the files\n const hasNoTypesInfo = dataTransfer.types.length === 0\n\n // When dragging images, there's a mix of mime types + Files\n // which we can't assign to the native input\n const isDraggingFiles = dataTransfer.types.some((type) => type === 'Files')\n\n return hasNoTypesInfo \|\| isDraggingFiles\n}\n\n/\n @typedef {HTMLInputElement & {files: FileList}} HTMLFileInputElement\n /\n\n/\n File upload config\n \n @see {@link FileUpload.defaults}\n * @typedef {object} FileUploadConfig\n * @property {FileUploadTranslations} [i18n=FileUpload.defaults.i18n] - File upload translations\n /\n\n/\n File upload translations\n \n @see {@link FileUpload.defaults.i18n}\n * @typedef {object} FileUploadTranslations\n \n Messages used by the component\n * @property {string} [chooseFile] - The text of the button that opens the file picker\n * @property {string} [dropInstruction] - The text informing users they can drop files\n * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files\n * have been chosen by the user\n * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user\n * @property {string} [enteredDropZone] - The text announced by assistive technology\n * when user drags files and enters the drop zone\n * @property {string} [leftDropZone] - The text announced by assistive technology\n * when user drags files and leaves the drop zone without dropping\n /\n\n/\n @import { Schema } from '../../common/configuration.mjs'\n * @import { TranslationPluralForms } from '../../i18n.mjs'\n */\n"],"names":["FileUpload","ConfigurableComponent","constructor","$root","config","$input","$button","$status","i18n","id","$announcements","enteredAnotherElement","querySelector","ElementError","component","identifier","type","formatErrorMessage","I18n","locale","closestAttributeValue","$label","findLabel","setAttribute","document","createElement","classList","add","ariaDescribedBy","getAttribute","className","innerText","t","appendChild","commaSpan","containerSpan","buttonSpan","insertAdjacentText","instructionSpan","addEventListener","onClick","bind","event","preventDefault","insertAdjacentElement","onChange","updateDisabledState","observeDisabledState","onDrop","updateDropzoneVisibility","disabled","hideDraggingState","target","Node","contains","dataTransfer","isContainingFiles","showDraggingState","remove","files","dispatchEvent","CustomEvent","fileCount","length","name","count","click","observer","MutationObserver","mutationList","mutation","attributeName","observe","attributes","toggle","moduleName","defaults","Object","freeze","chooseFilesButton","dropInstruction","noFileChosen","multipleFilesChosen","one","other","enteredDropZone","leftDropZone","schema","properties","hasNoTypesInfo","types","isDraggingFiles","some"],"mappings":"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"}
1	+ {"version":3,"file":"file-upload.mjs","sources":["../../../../src/govuk/components/file-upload/file-upload.mjs"],"sourcesContent":["import { closestAttributeValue } from '../../common/closest-attribute-value.mjs'\nimport { ConfigurableComponent } from '../../common/configuration.mjs'\nimport { formatErrorMessage } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { I18n } from '../../i18n.mjs'\n\n/*\n File upload component\n \n @preserve\n * @augments ConfigurableComponent<FileUploadConfig>\n /\nexport class FileUpload extends ConfigurableComponent {\n /\n @private\n * @type {HTMLFileInputElement}\n /\n $input\n\n /\n @private\n /\n $button\n\n /\n @private\n /\n $status\n\n /* @private /\n i18n\n\n /* @private /\n id\n\n /* @private /\n $announcements\n\n /\n @private\n * @type {boolean \| undefined}\n /\n enteredAnotherElement\n\n /\n @param {Element \| null} $root - File input element\n * @param {FileUploadConfig} [config] - File Upload config\n /\n constructor($root, config = {}) {\n super($root, config)\n\n const $input = this.$root.querySelector('input')\n\n if ($input === null) {\n throw new ElementError({\n component: FileUpload,\n identifier: 'File inputs (`<input type=\"file\">`)'\n })\n }\n\n if ($input.type !== 'file') {\n throw new ElementError(\n formatErrorMessage(\n FileUpload,\n 'File input (`<input type=\"file\">`) attribute (`type`) is not `file`'\n )\n )\n }\n\n this.$input = /* @type {HTMLFileInputElement} / ($input)\n\n if (!this.$input.id) {\n throw new ElementError({\n component: FileUpload,\n identifier: 'File input (`<input type=\"file\">`) attribute (`id`)'\n })\n }\n\n this.id = this.$input.id\n\n this.i18n = new I18n(this.config.i18n, {\n // Read the fallback if necessary rather than have it set in the defaults\n locale: closestAttributeValue(this.$root, 'lang')\n })\n\n const $label = this.findLabel()\n // Add an ID to the label if it doesn't have one already\n // so it can be referenced by `aria-labelledby`\n if (!$label.id) {\n $label.id = `${this.id}-label`\n }\n\n // we need to copy the 'id' of the root element\n // to the new button replacement element\n // so that focus will work in the error summary\n this.$input.id = `${this.id}-input`\n\n // Hide the native input\n this.$input.setAttribute('hidden', 'true')\n\n // Create the file selection button\n const $button = document.createElement('button')\n $button.classList.add('govuk-file-upload-button')\n $button.type = 'button'\n $button.id = this.id\n $button.classList.add('govuk-file-upload-button--empty')\n\n // Copy `aria-describedby` if present so hints and errors\n // are associated to the `<button>`\n const ariaDescribedBy = this.$input.getAttribute('aria-describedby')\n if (ariaDescribedBy) {\n $button.setAttribute('aria-describedby', ariaDescribedBy)\n }\n\n // Create status element that shows what/how many files are selected\n const $status = document.createElement('span')\n $status.className = 'govuk-body govuk-file-upload-button__status'\n $status.setAttribute('aria-live', 'polite')\n $status.innerText = this.i18n.t('noFileChosen')\n\n $button.appendChild($status)\n\n const commaSpan = document.createElement('span')\n commaSpan.className = 'govuk-visually-hidden'\n commaSpan.innerText = ', '\n commaSpan.id = `${this.id}-comma`\n\n $button.appendChild(commaSpan)\n\n const containerSpan = document.createElement('span')\n containerSpan.className =\n 'govuk-file-upload-button__pseudo-button-container'\n\n const buttonSpan = document.createElement('span')\n buttonSpan.className =\n 'govuk-button govuk-button--secondary govuk-file-upload-button__pseudo-button'\n buttonSpan.innerText = this.i18n.t('chooseFilesButton')\n\n containerSpan.appendChild(buttonSpan)\n\n // Add a space so the button and instruction read correctly\n // when CSS is disabled\n containerSpan.insertAdjacentText('beforeend', ' ')\n\n const instructionSpan = document.createElement('span')\n instructionSpan.className =\n 'govuk-body govuk-file-upload-button__instruction'\n instructionSpan.innerText = this.i18n.t('dropInstruction')\n\n containerSpan.appendChild(instructionSpan)\n\n $button.appendChild(containerSpan)\n $button.setAttribute(\n 'aria-labelledby',\n `${$label.id} ${commaSpan.id} ${$button.id}`\n )\n $button.addEventListener('click', this.onClick.bind(this))\n $button.addEventListener('dragover', (event) => {\n // prevent default to allow drop\n event.preventDefault()\n })\n\n // Assemble these all together\n this.$root.insertAdjacentElement('afterbegin', $button)\n\n this.$input.setAttribute('tabindex', '-1')\n this.$input.setAttribute('aria-hidden', 'true')\n\n // Make all these new variables available to the module\n this.$button = $button\n this.$status = $status\n\n // Bind change event to the underlying input\n this.$input.addEventListener('change', this.onChange.bind(this))\n\n // Synchronise the `disabled` state between the button and underlying input\n this.updateDisabledState()\n this.observeDisabledState()\n\n // Handle drop zone visibility\n // A live region to announce when users enter or leave the drop zone\n this.$announcements = document.createElement('span')\n this.$announcements.classList.add('govuk-file-upload-announcements')\n this.$announcements.classList.add('govuk-visually-hidden')\n this.$announcements.setAttribute('aria-live', 'assertive')\n this.$root.insertAdjacentElement('afterend', this.$announcements)\n\n // if there is no CSS and input is hidden\n // button will need to handle drop event\n this.$button.addEventListener('drop', this.onDrop.bind(this))\n\n // While user is dragging, it gets a little more complex because of Safari.\n // Safari doesn't fill `relatedTarget` on `dragleave` (nor `dragenter`).\n // This means we can't use `relatedTarget` to:\n // - check if the user is still within the wrapper\n // (`relatedTarget` being a descendant of the wrapper)\n // - check if the user is still over the viewport\n // (`relatedTarget` being null if outside)\n\n // Thanks to `dragenter` bubbling, we can listen on the `document` with a\n // single function and update the visibility based on whether we entered a\n // node inside or outside the wrapper.\n document.addEventListener(\n 'dragenter',\n this.updateDropzoneVisibility.bind(this)\n )\n\n // To detect if we're outside the document, we can track if there was a\n // `dragenter` event preceding a `dragleave`. If there wasn't, this means\n // we're outside the document.\n //\n // The order of events is guaranteed by the HTML specs:\n // https://html.spec.whatwg.org/multipage/dnd.html#drag-and-drop-processing-model\n document.addEventListener('dragenter', () => {\n this.enteredAnotherElement = true\n })\n\n document.addEventListener('dragleave', () => {\n if (!this.enteredAnotherElement && !this.$button.disabled) {\n this.hideDraggingState()\n this.$announcements.innerText = this.i18n.t('leftDropZone')\n }\n\n this.enteredAnotherElement = false\n })\n }\n\n /\n Updates the visibility of the dropzone as users enters the various elements on the page\n \n @private\n * @param {DragEvent} event - The `dragenter` event\n /\n updateDropzoneVisibility(event) {\n if (this.$button.disabled) return\n\n // DOM interfaces only type `event.target` as `EventTarget`\n // so we first need to make sure it's a `Node`\n if (event.target instanceof Node) {\n if (this.$root.contains(event.target)) {\n if (event.dataTransfer && this.canDrop(event.dataTransfer)) {\n // Only update the class and make the announcement if not already visible\n // to avoid repeated announcements on NVDA (2024.4) + Firefox (133)\n if (\n !this.$button.classList.contains(\n 'govuk-file-upload-button--dragging'\n )\n ) {\n this.showDraggingState()\n this.$announcements.innerText = this.i18n.t('enteredDropZone')\n }\n }\n } else {\n // Only hide the dropzone if it is visible to prevent announcing user\n // left the drop zone when they enter the page but haven't reached yet\n // the file upload component\n if (\n this.$button.classList.contains('govuk-file-upload-button--dragging')\n ) {\n this.hideDraggingState()\n this.$announcements.innerText = this.i18n.t('leftDropZone')\n }\n }\n }\n }\n\n /\n Show the drop zone visually\n \n @private\n /\n showDraggingState() {\n this.$button.classList.add('govuk-file-upload-button--dragging')\n }\n\n /\n Hides the drop zone visually\n \n @private\n /\n hideDraggingState() {\n this.$button.classList.remove('govuk-file-upload-button--dragging')\n }\n\n /\n Handles user dropping on the component\n \n @private\n * @param {DragEvent} event - The `dragenter` event\n /\n onDrop(event) {\n event.preventDefault()\n\n if (event.dataTransfer && this.canFillInput(event.dataTransfer)) {\n this.$input.files = event.dataTransfer.files\n\n // Dispatch a `change` event so external code that would rely on the `<input>`\n // dispatching an event when files are dropped still work.\n // Use a `CustomEvent` so our events are distinguishable from browser's native events\n this.$input.dispatchEvent(new CustomEvent('change'))\n\n this.hideDraggingState()\n }\n }\n\n /\n Confirms if enhanced `<input>` can be filled with files from the given `DataTransfer`\n \n @param {DataTransfer} dataTransfer - The `DataTransfer` being dropped\n * @returns {boolean} - true if the `DataTransfer` contains files, in number matching the `multiple` attribute of the original `<input>`\n * @private\n /\n canFillInput(dataTransfer) {\n return this.matchesInputCapacity(dataTransfer.files.length)\n }\n\n /\n Confirms if the content of a `DataTransfer` dragged over component can be dropped\n \n Unfortunately, there's a certain level of uncertainty in Safari which does not\n * even provide a list of `items` while dragging (and seems to even miss the `types` sometimes)\n \n @param {DataTransfer} dataTransfer - The `DataTransfer` being dragged\n * @returns {boolean} - true if the `DataTransfer` looks OK for filling the input, false otherwise\n * @private\n /\n canDrop(dataTransfer) {\n // If the browser is kind enough to give a list of items, we'll use that as source of truth\n if (dataTransfer.items.length) {\n return this.matchesInputCapacity(countFileItems(dataTransfer.items))\n }\n\n // If we have some type information, we'll use that\n if (dataTransfer.types.length) {\n return dataTransfer.types.includes('Files')\n }\n\n // If we have nothing to go by, we'll assume things are OK\n // until we have a more accurate picture inside the `drop` event\n return true\n }\n\n /\n Confirms the given number of files matches that allowed by the enhanced `<input>`\n \n @param {number} numberOfFiles - The number of files\n * @returns {boolean} - `true` if the enhanced `<input>` can accept that number of files\n * @private\n /\n matchesInputCapacity(numberOfFiles) {\n if (this.$input.multiple) {\n return numberOfFiles > 0\n }\n\n return numberOfFiles === 1\n }\n\n /\n Check if the value of the underlying input has changed\n \n @private\n /\n onChange() {\n const fileCount = this.$input.files.length\n\n if (fileCount === 0) {\n // If there are no files, show the default selection text\n this.$status.innerText = this.i18n.t('noFileChosen')\n this.$button.classList.add('govuk-file-upload-button--empty')\n } else {\n if (\n // If there is 1 file, just show the file name\n fileCount === 1\n ) {\n this.$status.innerText = this.$input.files[0].name\n } else {\n // Otherwise, tell the user how many files are selected\n this.$status.innerText = this.i18n.t('multipleFilesChosen', {\n count: fileCount\n })\n }\n\n this.$button.classList.remove('govuk-file-upload-button--empty')\n }\n }\n\n /\n Looks up the `<label>` element associated to the field\n \n @private\n * @returns {HTMLElement} The `<label>` element associated to the field\n * @throws {ElementError} If the `<label>` cannot be found\n /\n findLabel() {\n // Use `label` in the selector so TypeScript knows the type fo `HTMLElement`\n const $label = document.querySelector(`label[for=\"${this.$input.id}\"]`)\n\n if (!$label) {\n throw new ElementError({\n component: FileUpload,\n identifier: `Field label (\\`<label for=${this.$input.id}>\\`)`\n })\n }\n\n return $label\n }\n\n /\n When the button is clicked, emulate clicking the actual, hidden file input\n \n @private\n /\n onClick() {\n this.$input.click()\n }\n\n /\n Create a mutation observer to check if the input's attributes altered.\n \n @private\n /\n observeDisabledState() {\n const observer = new MutationObserver((mutationList) => {\n for (const mutation of mutationList) {\n if (\n mutation.type === 'attributes' &&\n mutation.attributeName === 'disabled'\n ) {\n this.updateDisabledState()\n }\n }\n })\n\n observer.observe(this.$input, {\n attributes: true\n })\n }\n\n /\n Synchronise the `disabled` state between the input and replacement button.\n \n @private\n /\n updateDisabledState() {\n this.$button.disabled = this.$input.disabled\n\n this.$root.classList.toggle(\n 'govuk-drop-zone--disabled',\n this.$button.disabled\n )\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n /\n static moduleName = 'govuk-file-upload'\n\n /\n File upload default config\n \n @see {@link FileUploadConfig}\n * @constant\n * @type {FileUploadConfig}\n /\n static defaults = Object.freeze({\n i18n: {\n chooseFilesButton: 'Choose file',\n dropInstruction: 'or drop file',\n noFileChosen: 'No file chosen',\n multipleFilesChosen: {\n // the 'one' string isn't used as the component displays the filename\n // instead, however it's here for coverage's sake\n one: '%{count} file chosen',\n other: '%{count} files chosen'\n },\n enteredDropZone: 'Entered drop zone',\n leftDropZone: 'Left drop zone'\n }\n })\n\n /\n File upload config schema\n \n @constant\n * @satisfies {Schema<FileUploadConfig>}\n /\n static schema = Object.freeze({\n properties: {\n i18n: { type: 'object' }\n }\n })\n}\n\n/\n Counts the number of `DataTransferItem` whose kind is `file`\n \n @param {DataTransferItemList} list - The list\n * @returns {number} - The number of items whose kind is `file` in the list\n /\nfunction countFileItems(list) {\n let result = 0\n\n // `DataTransferItemList` is not iterable\n // eslint-disable-next-line @typescript-eslint/prefer-for-of\n for (let i = 0; i < list.length; i++) {\n if (list[i].kind === 'file') {\n result++\n }\n }\n return result\n}\n\n/\n @typedef {HTMLInputElement & {files: FileList}} HTMLFileInputElement\n /\n\n/\n File upload config\n \n @see {@link FileUpload.defaults}\n * @typedef {object} FileUploadConfig\n * @property {FileUploadTranslations} [i18n=FileUpload.defaults.i18n] - File upload translations\n /\n\n/\n File upload translations\n \n @see {@link FileUpload.defaults.i18n}\n * @typedef {object} FileUploadTranslations\n \n Messages used by the component\n * @property {string} [chooseFile] - The text of the button that opens the file picker\n * @property {string} [dropInstruction] - The text informing users they can drop files\n * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files\n * have been chosen by the user\n * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user\n * @property {string} [enteredDropZone] - The text announced by assistive technology\n * when user drags files and enters the drop zone\n * @property {string} [leftDropZone] - The text announced by assistive technology\n * when user drags files and leaves the drop zone without dropping\n /\n\n/\n @import { Schema } from '../../common/configuration.mjs'\n * @import { TranslationPluralForms } from '../../i18n.mjs'\n */\n"],"names":["FileUpload","ConfigurableComponent","constructor","$root","config","$input","$button","$status","i18n","id","$announcements","enteredAnotherElement","querySelector","ElementError","component","identifier","type","formatErrorMessage","I18n","locale","closestAttributeValue","$label","findLabel","setAttribute","document","createElement","classList","add","ariaDescribedBy","getAttribute","className","innerText","t","appendChild","commaSpan","containerSpan","buttonSpan","insertAdjacentText","instructionSpan","addEventListener","onClick","bind","event","preventDefault","insertAdjacentElement","onChange","updateDisabledState","observeDisabledState","onDrop","updateDropzoneVisibility","disabled","hideDraggingState","target","Node","contains","dataTransfer","canDrop","showDraggingState","remove","canFillInput","files","dispatchEvent","CustomEvent","matchesInputCapacity","length","items","countFileItems","types","includes","numberOfFiles","multiple","fileCount","name","count","click","observer","MutationObserver","mutationList","mutation","attributeName","observe","attributes","toggle","moduleName","defaults","Object","freeze","chooseFilesButton","dropInstruction","noFileChosen","multipleFilesChosen","one","other","enteredDropZone","leftDropZone","schema","properties","list","result","i","kind"],"mappings":"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"}

data/node_modules/govuk-frontend/dist/govuk/components/file-upload/fixtures.json CHANGED Viewed

@@ -114,6 +114,23 @@
             "screenshot": false,
             "html": "<div class=\"govuk-form-group govuk-form-group--error\">\n  <label class=\"govuk-label\" for=\"file-upload-3\">\n    Upload a file\n  </label>\n  <div id=\"file-upload-3-hint\" class=\"govuk-hint\">\n    Your photo may be in your Pictures, Photos, Downloads or Desktop folder. Or in an app like iPhoto.\n  </div>\n  <p id=\"file-upload-3-error\" class=\"govuk-error-message\">\n    <span class=\"govuk-visually-hidden\">Error:</span> Error message goes here\n  </p>\n  <div\n    class=\"govuk-drop-zone\"\n    data-module=\"govuk-file-upload\">\n  <input class=\"govuk-file-upload govuk-file-upload--error\" id=\"file-upload-3\" name=\"file-upload-3\" type=\"file\" aria-describedby=\"file-upload-3-hint file-upload-3-error\">\n  </div>\n</div>"
         },
+        {
+            "name": "enhanced, multiple files",
+            "options": {
+                "javascript": true,
+                "id": "file-upload-3",
+                "name": "file-upload-3",
+                "label": {
+                    "text": "Upload files"
+                },
+                "multiple": true
+            },
+            "hidden": false,
+            "description": "",
+            "pageTemplateOptions": {},
+            "screenshot": false,
+            "html": "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label\" for=\"file-upload-3\">\n    Upload files\n  </label>\n  <div\n    class=\"govuk-drop-zone\"\n    data-module=\"govuk-file-upload\">\n  <input class=\"govuk-file-upload\" id=\"file-upload-3\" name=\"file-upload-3\" type=\"file\" multiple>\n  </div>\n</div>"
+        },
         {
             "name": "with value",
             "options": {

data/node_modules/govuk-frontend/dist/govuk/components/file-upload/template-enhanced-multiple-files.html ADDED Viewed

@@ -0,0 +1,10 @@
+<div class="govuk-form-group">
+  <label class="govuk-label" for="file-upload-3">
+    Upload files
+  </label>
+  <div
+    class="govuk-drop-zone"
+    data-module="govuk-file-upload">
+  <input class="govuk-file-upload" id="file-upload-3" name="file-upload-3" type="file" multiple>
+  </div>
+</div>

data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss CHANGED Viewed

@@ -59,7 +59,7 @@
   .govuk-footer__meta-item--grow {
     flex: 1; // Support: Flexbox
-    @include govuk-media-query($until: tablet) {
+    @media #{govuk-until-breakpoint(tablet)} {
       flex-basis: 320px; // Support: Flexbox
     }
   }
@@ -67,7 +67,7 @@
   .govuk-footer__licence-logo {
     display: inline-block;
     margin-right: govuk-spacing(2);
-    @include govuk-media-query($until: desktop) {
+    @media #{govuk-until-breakpoint(desktop)} {
       margin-bottom: govuk-spacing(3);
     }
     vertical-align: top;
@@ -141,7 +141,7 @@
     margin-bottom: govuk-spacing(6);
     padding-bottom: govuk-spacing(4);
-    @include govuk-media-query($until: tablet) {
+    @media #{govuk-until-breakpoint(tablet)} {
       padding-bottom: govuk-spacing(2);
     }
@@ -172,7 +172,7 @@
     column-gap: $govuk-gutter; // Support: Columns
   }
-  @include govuk-media-query($from: desktop) {
+  @media #{govuk-from-breakpoint(desktop)} {
     .govuk-footer__list--columns-2 {
       column-count: 2; // Support: Columns
     }

data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/govuk/components/footer/_index.scss"],"names":[],"mappings":"AAAA;EACE,2DAA2D;EAC3D,sCAAsC;EACtC,kDAAkD;;EAElD,6BAA6B;EAC7B,sCAAsC;EACtC,uCAAuC;;EAEvC;IACE,mEAAmE;IACnE,2CAA2C;IAC3C,8CAA8C;;IAE9C,0CAA0C;IAC1C,yBAAyB;IACzB;;;;KAIC;EACH;;EAEA;IACE,+BAA+B;EACjC;;EAEA;IACE,0BAA0B;IAC1B,8BAA8B;EAChC;;EAEA;IACE,SAAS,EAAE,8BAA8B;IACzC,6CAA6C;IAC7C,SAAS,EAAE,8BAA8B;IACzC,wBAAwB;IACxB;;;;KAIC;EACH;;EAEA;IACE,aAAa,EAAE,kBAAkB;IACjC,iCAAiC;IACjC,gCAAgC;IAChC,eAAe,EAAE,kBAAkB;IACnC,qBAAqB,EAAE,kBAAkB;IACzC,uBAAuB,EAAE,kBAAkB;EAC7C;;EAEA;IACE,gCAAgC;IAChC,+BAA+B;IAC/B,+BAA+B;EACjC;;EAEA;IACE,OAAO,EAAE,kBAAkB;IAC3B;MACE,iBAAiB,EAAE,kBAAkB;IACvC;EACF;;EAEA;IACE,qBAAqB;IACrB,8BAA8B;IAC9B;MACE,+BAA+B;IACjC;IACA,mBAAmB;IACnB,wEAAwE;IACxE,mDAAmD;IACnD,yBAAyB;EAC3B;;EAEA;IACE,qFAAqF;IACrF,qBAAqB;IACrB,+EAA+E;IAC/E,uCAAuC;IACvC,kBAAkB;EACpB;;EAEA;IACE,WAAW;IACX,cAAc;IACd,WAAW;IACX,kEAAkE;IAClE,oDAAoD;IACpD,4BAA4B;IAC5B,2BAA2B;IAC3B,iFAAiF;IACjF,kBAAkB;IAClB,mBAAmB;;IAEnB,kEAAkE;IAClE,qEAAqE;IACrE,+DAA+D;IAC/D,yEAAyE;IACzE,sBAAsB;IACtB;MACE,wBAAwB;MACxB,sDAA8C;cAA9C,8CAA8C;MAC9C,8BAAsB;cAAtB,sBAAsB;MACtB,6BAAqB;cAArB,qBAAqB;MACrB,mFAA2E;cAA3E,2EAA2E;;MAE3E,qEAAqE;MACrE,mEAAmE;MACnE,iCAAiC;MACjC;QACE,oBAAoB;MACtB;IACF;EACF;;EAEA;IACE,aAAa;IACb,+BAA+B;IAC/B,UAAU;EACZ;;EAEA;IACE,+BAA+B;EACjC;;EAEA;IACE,qBAAqB;IACrB,8BAA8B;IAC9B,+BAA+B;EACjC;;EAEA;IACE,+BAA+B;IAC/B,gCAAgC;;IAEhC;MACE,gCAAgC;IAClC;;IAEA,wBAAwB;IACxB;;;;KAIC;EACH;;EAEA;IACE,uBAAuB;IACvB,iCAAiC;IACjC,gCAAgC;EAClC;;EAEA;IACE,qBAAqB;IACrB,4BAA4B;IAC5B,mBAAmB;EACrB;;EAEA;IACE,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,yBAAyB,EAAE,kBAAkB;EAC/C;;EAEA;IACE;MACE,eAAe,EAAE,kBAAkB;IACrC;;IAEA;MACE,eAAe,EAAE,kBAAkB;IACrC;EACF;;EAEA;IACE,6CAA6C;EAC/C;;EAEA;IACE,gBAAgB;EAClB;AACF","file":"_index.scss","sourcesContent":["@include govuk-exports(\"govuk/component/footer\") {\n $govuk-footer-background: $govuk-template-background-colour;\n $govuk-footer-text: $govuk-text-colour;\n $govuk-footer-content-border: $govuk-border-colour;\n\n // Royal Arms image dimensions\n $govuk-footer-crest-image-width: 125px;\n $govuk-footer-crest-image-height: 102px;\n\n .govuk-footer {\n @include govuk-font($size: if($govuk-new-typography-scale, 19, 16));\n @include govuk-responsive-padding(7, \"top\");\n @include govuk-responsive-padding(5, \"bottom\");\n\n border-top: 10px solid $govuk-brand-colour;\n color: $govuk-footer-text;\n @include _govuk-rebrand(\n \"background\",\n $from: $govuk-footer-background,\n $to: $_govuk-rebrand-template-background-colour\n );\n }\n\n .govuk-footer__crown {\n margin-bottom: govuk-spacing(5);\n }\n\n .govuk-footer__link {\n @include govuk-link-common;\n @include govuk-link-style-text;\n }\n\n .govuk-footer__section-break {\n margin: 0; // Reset `<hr>` default margins\n @include govuk-responsive-margin(8, \"bottom\");\n border: 0; // Reset `<hr>` default borders\n border-bottom: 1px solid;\n @include _govuk-rebrand(\n \"border-bottom-color\",\n $from: $govuk-footer-content-border,\n $to: $_govuk-rebrand-border-colour-on-blue-tint-95\n );\n }\n\n .govuk-footer__meta {\n display: flex; // Support: Flexbox\n margin-right: -$govuk-gutter-half;\n margin-left: -$govuk-gutter-half;\n flex-wrap: wrap; // Support: Flexbox\n align-items: flex-end; // Support: Flexbox\n justify-content: center; // Support: Flexbox\n }\n\n .govuk-footer__meta-item {\n margin-right: $govuk-gutter-half;\n margin-bottom: govuk-spacing(5);\n margin-left: $govuk-gutter-half;\n }\n\n .govuk-footer__meta-item--grow {\n flex: 1; // Support: Flexbox\n @~~include~~ govuk-~~media~~-~~query~~(~~$until:~~ tablet) {\n flex-basis: 320px; // Support: Flexbox\n }\n }\n\n .govuk-footer__licence-logo {\n display: inline-block;\n margin-right: govuk-spacing(2);\n @~~include~~ govuk-~~media~~-~~query~~(~~$until:~~ desktop) {\n margin-bottom: govuk-spacing(3);\n }\n vertical-align: top;\n // Work around SVGs not inheriting color from parent in forced color mode\n // (https://github.com/w3c/csswg-drafts/issues/6310)\n forced-color-adjust: auto;\n }\n\n .govuk-footer__licence-description {\n // This makes the license description reflow under the logo when space gets too narrow\n display: inline-block;\n // This prevents the description from having orphans when space is narrow enough\n // and makes the text reflow more nicely\n text-wrap: balance;\n }\n\n .govuk-footer__copyright-logo::before {\n content: \"\";\n display: block;\n width: 100%;\n padding-top: ($govuk-footer-crest-image-height + govuk-spacing(2));\n background-image: govuk-image-url(\"govuk-crest.svg\");\n background-repeat: no-repeat;\n background-position: 50% 0%;\n background-size: $govuk-footer-crest-image-width $govuk-footer-crest-image-height;\n text-align: center;\n white-space: nowrap;\n\n // Where possible use the crest as a mask instead. This lets us use\n // currentColor, increasing the contrast of the image and matching the\n // user's prefered foreground colour in e.g. forced colors mode.\n // We test for `mask-position` rather than `mask-image` because of a false\n // positive in Edge 17.\n @supports (mask-position: initial) {\n background: currentcolor;\n mask-image: govuk-image-url(\"govuk-crest.svg\");\n mask-repeat: no-repeat;\n mask-position: 50% 0%;\n mask-size: $govuk-footer-crest-image-width $govuk-footer-crest-image-height;\n\n // currentcolor doesn't seem to be computed correctly in forced colors\n // mode so force the background color to match the system link color\n // (matching the text in the link)\n @media screen and (forced-colors: active) {\n background: linktext;\n }\n }\n }\n\n .govuk-footer__inline-list {\n margin-top: 0;\n margin-bottom: govuk-spacing(3);\n padding: 0;\n }\n\n .govuk-footer__meta-custom {\n margin-bottom: govuk-spacing(4);\n }\n\n .govuk-footer__inline-list-item {\n display: inline-block;\n margin-right: govuk-spacing(3);\n margin-bottom: govuk-spacing(1);\n }\n\n .govuk-footer__heading {\n margin-bottom: govuk-spacing(6);\n padding-bottom: govuk-spacing(4);\n\n @~~include~~ govuk-~~media~~-~~query~~(~~$until:~~ tablet) {\n padding-bottom: govuk-spacing(2);\n }\n\n border-bottom: 1px solid;\n @include _govuk-rebrand(\n \"border-bottom-color\",\n $from: $govuk-footer-content-border,\n $to: $_govuk-rebrand-border-colour-on-blue-tint-95\n );\n }\n\n .govuk-footer__navigation {\n @include govuk-clearfix;\n margin-right: -$govuk-gutter-half;\n margin-left: -$govuk-gutter-half;\n }\n\n .govuk-footer__section {\n display: inline-block;\n margin-bottom: $govuk-gutter;\n vertical-align: top;\n }\n\n .govuk-footer__list {\n margin: 0;\n padding: 0;\n list-style: none;\n column-gap: $govuk-gutter; // Support: Columns\n }\n\n @~~include~~ govuk-~~media~~-~~query~~(~~$from:~~ desktop) {\n .govuk-footer__list--columns-2 {\n column-count: 2; // Support: Columns\n }\n\n .govuk-footer__list--columns-3 {\n column-count: 3; // Support: Columns\n }\n }\n\n .govuk-footer__list-item {\n @include govuk-responsive-margin(4, \"bottom\");\n }\n\n .govuk-footer__list-item:last-child {\n margin-bottom: 0;\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../../src/govuk/components/footer/_index.scss"],"names":[],"mappings":"AAAA;EACE,2DAA2D;EAC3D,sCAAsC;EACtC,kDAAkD;;EAElD,6BAA6B;EAC7B,sCAAsC;EACtC,uCAAuC;;EAEvC;IACE,mEAAmE;IACnE,2CAA2C;IAC3C,8CAA8C;;IAE9C,0CAA0C;IAC1C,yBAAyB;IACzB;;;;KAIC;EACH;;EAEA;IACE,+BAA+B;EACjC;;EAEA;IACE,0BAA0B;IAC1B,8BAA8B;EAChC;;EAEA;IACE,SAAS,EAAE,8BAA8B;IACzC,6CAA6C;IAC7C,SAAS,EAAE,8BAA8B;IACzC,wBAAwB;IACxB;;;;KAIC;EACH;;EAEA;IACE,aAAa,EAAE,kBAAkB;IACjC,iCAAiC;IACjC,gCAAgC;IAChC,eAAe,EAAE,kBAAkB;IACnC,qBAAqB,EAAE,kBAAkB;IACzC,uBAAuB,EAAE,kBAAkB;EAC7C;;EAEA;IACE,gCAAgC;IAChC,+BAA+B;IAC/B,+BAA+B;EACjC;;EAEA;IACE,OAAO,EAAE,kBAAkB;IAC3B;MACE,iBAAiB,EAAE,kBAAkB;IACvC;EACF;;EAEA;IACE,qBAAqB;IACrB,8BAA8B;IAC9B;MACE,+BAA+B;IACjC;IACA,mBAAmB;IACnB,wEAAwE;IACxE,mDAAmD;IACnD,yBAAyB;EAC3B;;EAEA;IACE,qFAAqF;IACrF,qBAAqB;IACrB,+EAA+E;IAC/E,uCAAuC;IACvC,kBAAkB;EACpB;;EAEA;IACE,WAAW;IACX,cAAc;IACd,WAAW;IACX,kEAAkE;IAClE,oDAAoD;IACpD,4BAA4B;IAC5B,2BAA2B;IAC3B,iFAAiF;IACjF,kBAAkB;IAClB,mBAAmB;;IAEnB,kEAAkE;IAClE,qEAAqE;IACrE,+DAA+D;IAC/D,yEAAyE;IACzE,sBAAsB;IACtB;MACE,wBAAwB;MACxB,sDAA8C;cAA9C,8CAA8C;MAC9C,8BAAsB;cAAtB,sBAAsB;MACtB,6BAAqB;cAArB,qBAAqB;MACrB,mFAA2E;cAA3E,2EAA2E;;MAE3E,qEAAqE;MACrE,mEAAmE;MACnE,iCAAiC;MACjC;QACE,oBAAoB;MACtB;IACF;EACF;;EAEA;IACE,aAAa;IACb,+BAA+B;IAC/B,UAAU;EACZ;;EAEA;IACE,+BAA+B;EACjC;;EAEA;IACE,qBAAqB;IACrB,8BAA8B;IAC9B,+BAA+B;EACjC;;EAEA;IACE,+BAA+B;IAC/B,gCAAgC;;IAEhC;MACE,gCAAgC;IAClC;;IAEA,wBAAwB;IACxB;;;;KAIC;EACH;;EAEA;IACE,uBAAuB;IACvB,iCAAiC;IACjC,gCAAgC;EAClC;;EAEA;IACE,qBAAqB;IACrB,4BAA4B;IAC5B,mBAAmB;EACrB;;EAEA;IACE,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,yBAAyB,EAAE,kBAAkB;EAC/C;;EAEA;IACE;MACE,eAAe,EAAE,kBAAkB;IACrC;;IAEA;MACE,eAAe,EAAE,kBAAkB;IACrC;EACF;;EAEA;IACE,6CAA6C;EAC/C;;EAEA;IACE,gBAAgB;EAClB;AACF","file":"_index.scss","sourcesContent":["@include govuk-exports(\"govuk/component/footer\") {\n $govuk-footer-background: $govuk-template-background-colour;\n $govuk-footer-text: $govuk-text-colour;\n $govuk-footer-content-border: $govuk-border-colour;\n\n // Royal Arms image dimensions\n $govuk-footer-crest-image-width: 125px;\n $govuk-footer-crest-image-height: 102px;\n\n .govuk-footer {\n @include govuk-font($size: if($govuk-new-typography-scale, 19, 16));\n @include govuk-responsive-padding(7, \"top\");\n @include govuk-responsive-padding(5, \"bottom\");\n\n border-top: 10px solid $govuk-brand-colour;\n color: $govuk-footer-text;\n @include _govuk-rebrand(\n \"background\",\n $from: $govuk-footer-background,\n $to: $_govuk-rebrand-template-background-colour\n );\n }\n\n .govuk-footer__crown {\n margin-bottom: govuk-spacing(5);\n }\n\n .govuk-footer__link {\n @include govuk-link-common;\n @include govuk-link-style-text;\n }\n\n .govuk-footer__section-break {\n margin: 0; // Reset `<hr>` default margins\n @include govuk-responsive-margin(8, \"bottom\");\n border: 0; // Reset `<hr>` default borders\n border-bottom: 1px solid;\n @include _govuk-rebrand(\n \"border-bottom-color\",\n $from: $govuk-footer-content-border,\n $to: $_govuk-rebrand-border-colour-on-blue-tint-95\n );\n }\n\n .govuk-footer__meta {\n display: flex; // Support: Flexbox\n margin-right: -$govuk-gutter-half;\n margin-left: -$govuk-gutter-half;\n flex-wrap: wrap; // Support: Flexbox\n align-items: flex-end; // Support: Flexbox\n justify-content: center; // Support: Flexbox\n }\n\n .govuk-footer__meta-item {\n margin-right: $govuk-gutter-half;\n margin-bottom: govuk-spacing(5);\n margin-left: $govuk-gutter-half;\n }\n\n .govuk-footer__meta-item--grow {\n flex: 1; // Support: Flexbox\n @media #{govuk-until-breakpoint(tablet)} {\n flex-basis: 320px; // Support: Flexbox\n }\n }\n\n .govuk-footer__licence-logo {\n display: inline-block;\n margin-right: govuk-spacing(2);\n @media #{govuk-until-breakpoint(desktop)} {\n margin-bottom: govuk-spacing(3);\n }\n vertical-align: top;\n // Work around SVGs not inheriting color from parent in forced color mode\n // (https://github.com/w3c/csswg-drafts/issues/6310)\n forced-color-adjust: auto;\n }\n\n .govuk-footer__licence-description {\n // This makes the license description reflow under the logo when space gets too narrow\n display: inline-block;\n // This prevents the description from having orphans when space is narrow enough\n // and makes the text reflow more nicely\n text-wrap: balance;\n }\n\n .govuk-footer__copyright-logo::before {\n content: \"\";\n display: block;\n width: 100%;\n padding-top: ($govuk-footer-crest-image-height + govuk-spacing(2));\n background-image: govuk-image-url(\"govuk-crest.svg\");\n background-repeat: no-repeat;\n background-position: 50% 0%;\n background-size: $govuk-footer-crest-image-width $govuk-footer-crest-image-height;\n text-align: center;\n white-space: nowrap;\n\n // Where possible use the crest as a mask instead. This lets us use\n // currentColor, increasing the contrast of the image and matching the\n // user's prefered foreground colour in e.g. forced colors mode.\n // We test for `mask-position` rather than `mask-image` because of a false\n // positive in Edge 17.\n @supports (mask-position: initial) {\n background: currentcolor;\n mask-image: govuk-image-url(\"govuk-crest.svg\");\n mask-repeat: no-repeat;\n mask-position: 50% 0%;\n mask-size: $govuk-footer-crest-image-width $govuk-footer-crest-image-height;\n\n // currentcolor doesn't seem to be computed correctly in forced colors\n // mode so force the background color to match the system link color\n // (matching the text in the link)\n @media screen and (forced-colors: active) {\n background: linktext;\n }\n }\n }\n\n .govuk-footer__inline-list {\n margin-top: 0;\n margin-bottom: govuk-spacing(3);\n padding: 0;\n }\n\n .govuk-footer__meta-custom {\n margin-bottom: govuk-spacing(4);\n }\n\n .govuk-footer__inline-list-item {\n display: inline-block;\n margin-right: govuk-spacing(3);\n margin-bottom: govuk-spacing(1);\n }\n\n .govuk-footer__heading {\n margin-bottom: govuk-spacing(6);\n padding-bottom: govuk-spacing(4);\n\n @media #{govuk-until-breakpoint(tablet)} {\n padding-bottom: govuk-spacing(2);\n }\n\n border-bottom: 1px solid;\n @include _govuk-rebrand(\n \"border-bottom-color\",\n $from: $govuk-footer-content-border,\n $to: $_govuk-rebrand-border-colour-on-blue-tint-95\n );\n }\n\n .govuk-footer__navigation {\n @include govuk-clearfix;\n margin-right: -$govuk-gutter-half;\n margin-left: -$govuk-gutter-half;\n }\n\n .govuk-footer__section {\n display: inline-block;\n margin-bottom: $govuk-gutter;\n vertical-align: top;\n }\n\n .govuk-footer__list {\n margin: 0;\n padding: 0;\n list-style: none;\n column-gap: $govuk-gutter; // Support: Columns\n }\n\n @media #{govuk-from-breakpoint(desktop)} {\n .govuk-footer__list--columns-2 {\n column-count: 2; // Support: Columns\n }\n\n .govuk-footer__list--columns-3 {\n column-count: 3; // Support: Columns\n }\n }\n\n .govuk-footer__list-item {\n @include govuk-responsive-margin(4, \"bottom\");\n }\n\n .govuk-footer__list-item:last-child {\n margin-bottom: 0;\n }\n}\n"]}

data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss CHANGED Viewed

@@ -31,7 +31,7 @@
   }
   .govuk-header--with-js-navigation {
-    @include govuk-media-query($until: desktop) {
+    @media #{govuk-until-breakpoint(desktop)} {
       .govuk-header__logo {
         // Protect the absolute positioned menu button from overlapping with the
         // logo with right padding using the button's width
@@ -117,7 +117,7 @@
     fill: #00ffe0;
     // Override Dot colour when printing
-    @include govuk-media-query($media-type: print) {
+    @media print {
       fill: currentcolor;
     }
@@ -152,7 +152,7 @@
     // Align vertically with logo when not wrapped
     vertical-align: top;
-    @include govuk-media-query($from: tablet) {
+    @media #{govuk-from-breakpoint(tablet)} {
       margin-top: $product-name-offset-tablet;
       @-moz-document url-prefix() {
         margin-top: $product-name-offset-tablet - 0.5px;
@@ -184,11 +184,11 @@
       }
       // Remove top margin on the breakpoints too
-      @include govuk-media-query($from: tablet) {
+      @media #{govuk-from-breakpoint(tablet)} {
         margin-top: 0;
       }
-      @include govuk-media-query($from: desktop) {
+      @media #{govuk-from-breakpoint(desktop)} {
         margin-top: 0;
       }
     }
@@ -227,7 +227,7 @@
     margin-right: govuk-spacing(2);
     font-size: 30px; // We don't have a mixin that produces 30px font size
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       display: inline;
     }
@@ -277,7 +277,7 @@
       // Apply margins to internal elements to emulate padding
       margin-bottom: govuk-spacing(3);
-      @include govuk-media-query($from: desktop) {
+      @media #{govuk-from-breakpoint(desktop)} {
         // Magic number to align service name baseline with the GOV.UK logo
         $service-name-offset: 4px;
@@ -294,7 +294,7 @@
   .govuk-header__logo {
     @include govuk-responsive-margin($govuk-header-vertical-spacing-value, "bottom");
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       width: 33.33%;
       padding-right: $govuk-gutter-half;
       float: left;
@@ -319,7 +319,7 @@
   }
   .govuk-header__content {
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       width: 66.66%;
       padding-left: $govuk-gutter-half;
       float: left;
@@ -361,7 +361,7 @@
       @include govuk-shape-arrow($direction: up, $base: 10px, $display: inline-block);
     }
-    @include govuk-media-query($from: mobile) {
+    @media #{govuk-from-breakpoint(mobile)} {
       position: absolute;
       // calculate top offset by:
       // - getting the vertical spacing for the top and the bottom of the header
@@ -374,7 +374,7 @@
       margin: 0;
     }
-    @include govuk-media-query($from: tablet) {
+    @media #{govuk-from-breakpoint(tablet)} {
       top: govuk-spacing(3);
     }
@@ -389,13 +389,13 @@
   }
   .govuk-header__navigation {
-    @include govuk-media-query($until: mobile) {
+    @media #{govuk-until-breakpoint(mobile)} {
       @include _govuk-rebrand {
         padding-bottom: govuk-spacing(3);
       }
     }
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       margin-bottom: govuk-spacing(2);
       @include _govuk-rebrand {
@@ -412,7 +412,7 @@
   .govuk-header__service-name + .govuk-header__navigation {
     @include _govuk-rebrand {
-      @include govuk-media-query($from: desktop) {
+      @media #{govuk-from-breakpoint(desktop)} {
         // If there's both a service name and navigation,
         // remove the extra padding between them on desktop
         padding-top: 0;
@@ -434,14 +434,14 @@
     }
     @include _govuk-rebrand {
-      @include govuk-media-query($from: mobile, $until: desktop) {
+      @media #{govuk-from-breakpoint(mobile)} and #{govuk-until-breakpoint(desktop)} {
         padding-bottom: govuk-spacing(3);
       }
     }
   }
   .govuk-header__navigation--end {
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       margin: 0;
       padding: govuk-spacing(1) 0;
       text-align: right;
@@ -452,7 +452,7 @@
     padding: govuk-spacing(2) 0;
     border-bottom: 1px solid $govuk-header-nav-item-border-color;
-    @include govuk-media-query($from: desktop) {
+    @media #{govuk-from-breakpoint(desktop)} {
       display: inline-block;
       margin-right: govuk-spacing(3);
       padding: govuk-spacing(1) 0;
@@ -470,7 +470,7 @@
       padding-top: govuk-spacing(3);
       // ...except on desktop
-      @include govuk-media-query($from: desktop) {
+      @media #{govuk-from-breakpoint(desktop)} {
         padding-top: govuk-spacing(1);
       }
@@ -503,7 +503,7 @@
       // When printing, use the normal blue as this contrasts better with the
       // white printing header
-      @include govuk-media-query($media-type: print) {
+      @media print {
         color: $govuk-brand-colour;
       }
@@ -524,7 +524,7 @@
     border-bottom: 0;
   }
-  @include govuk-media-query($media-type: print) {
+  @media print {
     .govuk-header {
       border-bottom-width: 0;
       color: govuk-colour("black");

data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/govuk/components/header/_index.scss"],"names":[],"mappings":"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","file":"_index.scss","sourcesContent":["@include govuk-exports(\"govuk/component/header\") {\n $govuk-header-background: govuk-colour(\"black\");\n $govuk-header-border-color: $govuk-brand-colour;\n $govuk-header-border-width: govuk-spacing(2);\n $govuk-header-text: govuk-colour(\"white\");\n $govuk-header-link-active: #1d8feb;\n $govuk-header-nav-item-border-color: #2e3133;\n $govuk-header-link-underline-thickness: 3px;\n $govuk-header-vertical-spacing-value: 2;\n // This crown height is only used to calculate top offset of mobile menu button\n // as the crown svg height is the only thing that controls the height of the header\n $govuk-header-crown-height: 30px;\n $govuk-header-menu-button-height: 24px;\n $govuk-header-menu-button-width: 80px;\n\n $govuk-header-rebrand-background: $govuk-brand-colour;\n $govuk-header-rebrand-logo-bottom-margin: 2px;\n\n .govuk-header {\n @include govuk-font($size: 16, $line-height: 1);\n\n // Add a transparent bottom border for forced-colour modes\n @include _govuk-rebrand(\n \"border-bottom\",\n $from: govuk-spacing(2) solid govuk-colour(\"white\"),\n $to: 1px solid transparent\n );\n @include _govuk-rebrand(\"background\", $from: $govuk-header-background, $to: $govuk-header-rebrand-background);\n\n color: $govuk-header-text;\n }\n\n .govuk-header--with-js-navigation {\n @include govuk-media-query($until: desktop) {\n .govuk-header__logo {\n // Protect the absolute positioned menu button from overlapping with the\n // logo with right padding using the button's width\n padding-right: $govuk-header-menu-button-width;\n }\n }\n }\n\n .govuk-header__container--full-width {\n padding: 0 govuk-spacing(3);\n border-color: $govuk-header-border-color;\n\n .govuk-header__menu-button {\n right: govuk-spacing(3);\n }\n }\n\n .govuk-header__container {\n @include govuk-clearfix;\n position: relative;\n margin-bottom: -$govuk-header-border-width;\n padding-top: govuk-spacing($govuk-header-vertical-spacing-value);\n border-bottom: $govuk-header-border-width solid $govuk-header-border-color;\n\n @include _govuk-rebrand {\n // Remove the space allocated to the blue bar\n margin-bottom: 0;\n\n // Remove padding as the child elements are now responsible for spacing\n padding-top: 0;\n\n // Remove the blue bar\n border-bottom: none;\n }\n }\n\n // TODO: Remove this when _govuk-rebrand becomes the default\n .govuk-header--full-width-border {\n border-bottom-color: $govuk-header-border-color;\n\n .govuk-header__container {\n border-bottom-color: transparent;\n }\n }\n\n .govuk-header__logotype {\n display: inline-block;\n position: relative;\n top: -3px;\n\n // Add a gap after the logo in case it's followed by a product name. This\n // gets removed later if the logotype is a :last-child.\n margin-right: govuk-spacing(1);\n fill: currentcolor;\n vertical-align: top;\n\n // Prevent readability backplate from obscuring underline in Windows High\n // Contrast Mode\n @media (forced-colors: active) {\n forced-color-adjust: none;\n color: linktext;\n }\n\n // Remove the gap after the logo if there's no product name to keep hover\n // and focus states neat\n &:last-child {\n margin-right: 0;\n }\n\n @include _govuk-rebrand {\n margin-right: govuk-px-to-rem(7px); // 1 'dot'\n margin-bottom: $govuk-header-rebrand-logo-bottom-margin;\n\n // Remove right-margin if there's no product name\n &:last-child {\n margin-right: 0;\n }\n }\n }\n\n // Colour in the Dot\n .govuk-logo-dot {\n fill: #00ffe0;\n\n // Override Dot colour when printing\n @include govuk-media-query($media-type: print) {\n fill: currentcolor;\n }\n\n // Override Dot colour on forced colours mode\n @media (forced-colors: active) {\n fill: currentcolor;\n }\n\n // Override Dot colour on focus\n :focus & {\n fill: currentcolor;\n }\n }\n\n .govuk-header__product-name {\n $product-name-offset: if($govuk-new-typography-scale, 7px, 10px);\n $product-name-offset-tablet: 5px;\n\n @include govuk-font-size($size: 24, $line-height: 1);\n @include govuk-typography-weight-regular;\n display: inline-table;\n\n // Maintain space below logo when wrapped\n margin-top: $product-name-offset;\n\n // Firefox places the GOV.UK logo one pixel higher, due to how it rounds\n // subpixels, so nudge the product name in FF to still be aligned.\n @-moz-document url-prefix() {\n margin-top: $product-name-offset - 0.5px;\n }\n\n // Align vertically with logo when not wrapped\n vertical-align: top;\n\n @include govuk-media-query($from: tablet) {\n margin-top: $product-name-offset-tablet;\n @-moz-document url-prefix() {\n margin-top: $product-name-offset-tablet - 0.5px;\n }\n }\n\n @include _govuk-rebrand {\n // Remove top margin\n margin-top: 0;\n\n // Remove 1px from the bottom to account for the font-size being 1px\n // larger than the logo height.\n margin-bottom: govuk-px-to-rem(-1px);\n\n // Magic number font-size that visually aligns with GOV.UK logo.\n // Also stops reducing the product name size on narrow screens\n font-size: govuk-px-to-rem(31px);\n\n // Reduce letter spacing\n letter-spacing: -0.015em;\n\n // Prevent forced colour modes from applying a background colour behind\n // the product name, which cuts off the underline that appears on hover.\n forced-color-adjust: none;\n\n @media screen and (forced-colors: active) {\n color: LinkText;\n background: transparent;\n }\n\n // Remove top margin on the breakpoints too\n @include govuk-media-query($from: tablet) {\n margin-top: 0;\n }\n\n @include govuk-media-query($from: desktop) {\n margin-top: 0;\n }\n }\n }\n\n .govuk-header__link {\n // Avoid using the `govuk-link-common` mixin because the links in the header\n // get a special treatment, because:\n //\n // - underlines are only visible on hover\n // - all links get a 3px underline regardless of text size, as there are\n // multiple grouped elements close to one another and having slightly\n // different underline widths looks unbalanced\n @include govuk-link-style-inverse;\n\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n text-decoration-thickness: $govuk-header-link-underline-thickness;\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n }\n\n .govuk-header__link--homepage {\n // Font size needs to be set on the link so that the box sizing is correct\n // in Firefox\n display: inline-block;\n margin-right: govuk-spacing(2);\n font-size: 30px; // We don't have a mixin that produces 30px font size\n\n @include govuk-media-query($from: desktop) {\n display: inline;\n }\n\n &:link,\n &:visited {\n text-decoration: none;\n }\n\n &:hover,\n &:active {\n // Negate the added border\n margin-bottom: $govuk-header-link-underline-thickness * -1;\n border-bottom: $govuk-header-link-underline-thickness solid;\n }\n\n // Remove any borders that show when focused and hovered.\n &:focus {\n margin-bottom: 0;\n border-bottom: 0;\n }\n\n @include _govuk-rebrand {\n display: inline;\n\n // Remove word-spacing from within the logo so we can ignore\n // whitespace characters in the HTML\n word-spacing: govuk-px-to-rem(-6px);\n\n // Reset word-spacing for child elements\n > * {\n word-spacing: 0;\n }\n\n &:not(:focus) {\n background-color: $govuk-header-rebrand-background;\n }\n }\n }\n\n .govuk-header__service-name {\n display: inline-block;\n margin-bottom: govuk-spacing(2);\n @include govuk-font-size($size: 24);\n @include govuk-typography-weight-bold;\n\n @include _govuk-rebrand {\n // Apply margins to internal elements to emulate padding\n margin-bottom: govuk-spacing(3);\n\n @include govuk-media-query($from: desktop) {\n // Magic number to align service name baseline with the GOV.UK logo\n $service-name-offset: 4px;\n\n margin: (govuk-spacing(3) + $service-name-offset) 0 (govuk-spacing(3) - $service-name-offset);\n }\n }\n }\n\n .govuk-header__logo,\n .govuk-header__content {\n box-sizing: border-box;\n }\n\n .govuk-header__logo {\n @include govuk-responsive-margin($govuk-header-vertical-spacing-value, \"bottom\");\n\n @include govuk-media-query($from: desktop) {\n width: 33.33%;\n padding-right: $govuk-gutter-half;\n float: left;\n vertical-align: top;\n\n // Reset float when logo is the last child, without a navigation\n &:last-child {\n width: auto;\n padding-right: 0;\n float: none;\n }\n }\n\n @include _govuk-rebrand {\n // Apply margins to internal elements to emulate padding\n margin-bottom: 0;\n\n // Magic numbers, set padding to vertically centre align the logo\n padding-top: 16px;\n padding-bottom: 14px - $govuk-header-rebrand-logo-bottom-margin;\n }\n }\n\n .govuk-header__content {\n @include govuk-media-query($from: desktop) {\n width: 66.66%;\n padding-left: $govuk-gutter-half;\n float: left;\n }\n }\n\n .govuk-header__menu-button {\n @include govuk-font($size: 16);\n max-width: $govuk-header-menu-button-width;\n min-height: $govuk-header-menu-button-height;\n margin-bottom: govuk-spacing(1);\n padding: 0;\n border: 0;\n color: govuk-colour(\"white\");\n background: none;\n word-break: break-all;\n cursor: pointer;\n\n &:hover {\n text-decoration: solid underline $govuk-header-link-underline-thickness;\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n\n &::after {\n @include govuk-shape-arrow($direction: down, $base: 10px, $display: inline-block);\n content: \"\";\n margin-left: govuk-spacing(1);\n }\n\n &[aria-expanded=\"true\"]::after {\n @include govuk-shape-arrow($direction: up, $base: 10px, $display: inline-block);\n }\n\n @include govuk-media-query($from: mobile) {\n position: absolute;\n // calculate top offset by:\n // - getting the vertical spacing for the top and the bottom of the header\n // - adding that to the crown height\n // - dividing it by 2 so you have the vertical centre of the header\n // - subtracting half the height of the menu button\n top: (((govuk-spacing($govuk-header-vertical-spacing-value) * 2) + $govuk-header-crown-height) / 2) -\n ($govuk-header-menu-button-height / 2);\n right: 0;\n margin: 0;\n }\n\n @include govuk-media-query($from: tablet) {\n top: govuk-spacing(3);\n }\n\n .govuk-frontend-supported & {\n display: block;\n }\n\n &[hidden],\n .govuk-frontend-supported &[hidden] {\n display: none;\n }\n }\n\n .govuk-header__navigation {\n @include govuk-media-query($until: mobile) {\n @include _govuk-rebrand {\n padding-bottom: govuk-spacing(3);\n }\n }\n\n @include govuk-media-query($from: desktop) {\n margin-bottom: govuk-spacing(2);\n\n @include _govuk-rebrand {\n // Magic number so that the bottom of the nav links aligns with the\n // baseline of the GOV.UK logo\n $navigation-offset: 7px;\n\n // Apply margins to internal elements to emulate padding\n margin-bottom: 0;\n padding: (govuk-spacing(3) + $navigation-offset) 0 (govuk-spacing(3) - $navigation-offset);\n }\n }\n }\n\n .govuk-header__service-name + .govuk-header__navigation {\n @include _govuk-rebrand {\n @include govuk-media-query($from: desktop) {\n // If there's both a service name and navigation,\n // remove the extra padding between them on desktop\n padding-top: 0;\n\n // Restore the full bottom padding as the navigation isn't standalone\n padding-bottom: govuk-spacing(3);\n }\n }\n }\n\n .govuk-header__navigation-list {\n // Reset user-agent default list styles\n margin: 0;\n padding: 0;\n list-style: none;\n\n &[hidden] {\n display: none;\n }\n\n @include _govuk-rebrand {\n @include govuk-media-query($from: mobile, $until: desktop) {\n padding-bottom: govuk-spacing(3);\n }\n }\n }\n\n .govuk-header__navigation--end {\n @include govuk-media-query($from: desktop) {\n margin: 0;\n padding: govuk-spacing(1) 0;\n text-align: right;\n }\n }\n\n .govuk-header__navigation-item {\n padding: govuk-spacing(2) 0;\n border-bottom: 1px solid $govuk-header-nav-item-border-color;\n\n @include govuk-media-query($from: desktop) {\n display: inline-block;\n margin-right: govuk-spacing(3);\n padding: govuk-spacing(1) 0;\n border: 0;\n }\n\n a {\n @include govuk-font-size($size: 16);\n @include govuk-typography-weight-bold;\n white-space: nowrap;\n }\n\n @include _govuk-rebrand {\n // Increase top padding of nav items...\n padding-top: govuk-spacing(3);\n\n // ...except on desktop\n @include govuk-media-query($from: desktop) {\n padding-top: govuk-spacing(1);\n }\n\n // Change the dividing line colour between mobile nav items\n border-bottom-color: govuk-colour(\"white\");\n\n // Reduce default weight of links so that we can use bold for active ones\n a {\n @include govuk-typography-weight-regular;\n }\n }\n }\n\n .govuk-header__navigation-item--active {\n a {\n @include _govuk-rebrand {\n // Change active links to use bold text instead of changing colour\n @include govuk-typography-weight-bold;\n }\n\n &:link,\n &:hover,\n &:visited {\n color: $govuk-header-link-active;\n\n @include _govuk-rebrand {\n color: inherit;\n }\n }\n\n // When printing, use the normal blue as this contrasts better with the\n // white printing header\n @include govuk-media-query($media-type: print) {\n color: $govuk-brand-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n\n @include _govuk-rebrand {\n color: $govuk-focus-text-colour;\n }\n }\n }\n }\n\n .govuk-header__navigation-item:last-child {\n margin-right: 0;\n border-bottom: 0;\n }\n\n @include govuk-media-query($media-type: print) {\n .govuk-header {\n border-bottom-width: 0;\n color: govuk-colour(\"black\");\n background: transparent;\n }\n\n .govuk-header__link {\n &:link,\n &:visited {\n color: govuk-colour(\"black\");\n }\n\n // Do not append link href to GOV.UK link when printing (e.g. '(/)')\n &::after {\n display: none;\n }\n }\n }\n}\n"]}
1	+ {"version":3,"sources":["../../../../src/govuk/components/header/_index.scss"],"names":[],"mappings":"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","file":"_index.scss","sourcesContent":["@include govuk-exports(\"govuk/component/header\") {\n $govuk-header-background: govuk-colour(\"black\");\n $govuk-header-border-color: $govuk-brand-colour;\n $govuk-header-border-width: govuk-spacing(2);\n $govuk-header-text: govuk-colour(\"white\");\n $govuk-header-link-active: #1d8feb;\n $govuk-header-nav-item-border-color: #2e3133;\n $govuk-header-link-underline-thickness: 3px;\n $govuk-header-vertical-spacing-value: 2;\n // This crown height is only used to calculate top offset of mobile menu button\n // as the crown svg height is the only thing that controls the height of the header\n $govuk-header-crown-height: 30px;\n $govuk-header-menu-button-height: 24px;\n $govuk-header-menu-button-width: 80px;\n\n $govuk-header-rebrand-background: $govuk-brand-colour;\n $govuk-header-rebrand-logo-bottom-margin: 2px;\n\n .govuk-header {\n @include govuk-font($size: 16, $line-height: 1);\n\n // Add a transparent bottom border for forced-colour modes\n @include _govuk-rebrand(\n \"border-bottom\",\n $from: govuk-spacing(2) solid govuk-colour(\"white\"),\n $to: 1px solid transparent\n );\n @include _govuk-rebrand(\"background\", $from: $govuk-header-background, $to: $govuk-header-rebrand-background);\n\n color: $govuk-header-text;\n }\n\n .govuk-header--with-js-navigation {\n @media #{govuk-until-breakpoint(desktop)} {\n .govuk-header__logo {\n // Protect the absolute positioned menu button from overlapping with the\n // logo with right padding using the button's width\n padding-right: $govuk-header-menu-button-width;\n }\n }\n }\n\n .govuk-header__container--full-width {\n padding: 0 govuk-spacing(3);\n border-color: $govuk-header-border-color;\n\n .govuk-header__menu-button {\n right: govuk-spacing(3);\n }\n }\n\n .govuk-header__container {\n @include govuk-clearfix;\n position: relative;\n margin-bottom: -$govuk-header-border-width;\n padding-top: govuk-spacing($govuk-header-vertical-spacing-value);\n border-bottom: $govuk-header-border-width solid $govuk-header-border-color;\n\n @include _govuk-rebrand {\n // Remove the space allocated to the blue bar\n margin-bottom: 0;\n\n // Remove padding as the child elements are now responsible for spacing\n padding-top: 0;\n\n // Remove the blue bar\n border-bottom: none;\n }\n }\n\n // TODO: Remove this when _govuk-rebrand becomes the default\n .govuk-header--full-width-border {\n border-bottom-color: $govuk-header-border-color;\n\n .govuk-header__container {\n border-bottom-color: transparent;\n }\n }\n\n .govuk-header__logotype {\n display: inline-block;\n position: relative;\n top: -3px;\n\n // Add a gap after the logo in case it's followed by a product name. This\n // gets removed later if the logotype is a :last-child.\n margin-right: govuk-spacing(1);\n fill: currentcolor;\n vertical-align: top;\n\n // Prevent readability backplate from obscuring underline in Windows High\n // Contrast Mode\n @media (forced-colors: active) {\n forced-color-adjust: none;\n color: linktext;\n }\n\n // Remove the gap after the logo if there's no product name to keep hover\n // and focus states neat\n &:last-child {\n margin-right: 0;\n }\n\n @include _govuk-rebrand {\n margin-right: govuk-px-to-rem(7px); // 1 'dot'\n margin-bottom: $govuk-header-rebrand-logo-bottom-margin;\n\n // Remove right-margin if there's no product name\n &:last-child {\n margin-right: 0;\n }\n }\n }\n\n // Colour in the Dot\n .govuk-logo-dot {\n fill: #00ffe0;\n\n // Override Dot colour when printing\n @media print {\n fill: currentcolor;\n }\n\n // Override Dot colour on forced colours mode\n @media (forced-colors: active) {\n fill: currentcolor;\n }\n\n // Override Dot colour on focus\n :focus & {\n fill: currentcolor;\n }\n }\n\n .govuk-header__product-name {\n $product-name-offset: if($govuk-new-typography-scale, 7px, 10px);\n $product-name-offset-tablet: 5px;\n\n @include govuk-font-size($size: 24, $line-height: 1);\n @include govuk-typography-weight-regular;\n display: inline-table;\n\n // Maintain space below logo when wrapped\n margin-top: $product-name-offset;\n\n // Firefox places the GOV.UK logo one pixel higher, due to how it rounds\n // subpixels, so nudge the product name in FF to still be aligned.\n @-moz-document url-prefix() {\n margin-top: $product-name-offset - 0.5px;\n }\n\n // Align vertically with logo when not wrapped\n vertical-align: top;\n\n @media #{govuk-from-breakpoint(tablet)} {\n margin-top: $product-name-offset-tablet;\n @-moz-document url-prefix() {\n margin-top: $product-name-offset-tablet - 0.5px;\n }\n }\n\n @include _govuk-rebrand {\n // Remove top margin\n margin-top: 0;\n\n // Remove 1px from the bottom to account for the font-size being 1px\n // larger than the logo height.\n margin-bottom: govuk-px-to-rem(-1px);\n\n // Magic number font-size that visually aligns with GOV.UK logo.\n // Also stops reducing the product name size on narrow screens\n font-size: govuk-px-to-rem(31px);\n\n // Reduce letter spacing\n letter-spacing: -0.015em;\n\n // Prevent forced colour modes from applying a background colour behind\n // the product name, which cuts off the underline that appears on hover.\n forced-color-adjust: none;\n\n @media screen and (forced-colors: active) {\n color: LinkText;\n background: transparent;\n }\n\n // Remove top margin on the breakpoints too\n @media #{govuk-from-breakpoint(tablet)} {\n margin-top: 0;\n }\n\n @media #{govuk-from-breakpoint(desktop)} {\n margin-top: 0;\n }\n }\n }\n\n .govuk-header__link {\n // Avoid using the `govuk-link-common` mixin because the links in the header\n // get a special treatment, because:\n //\n // - underlines are only visible on hover\n // - all links get a 3px underline regardless of text size, as there are\n // multiple grouped elements close to one another and having slightly\n // different underline widths looks unbalanced\n @include govuk-link-style-inverse;\n\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n text-decoration-thickness: $govuk-header-link-underline-thickness;\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n }\n\n .govuk-header__link--homepage {\n // Font size needs to be set on the link so that the box sizing is correct\n // in Firefox\n display: inline-block;\n margin-right: govuk-spacing(2);\n font-size: 30px; // We don't have a mixin that produces 30px font size\n\n @media #{govuk-from-breakpoint(desktop)} {\n display: inline;\n }\n\n &:link,\n &:visited {\n text-decoration: none;\n }\n\n &:hover,\n &:active {\n // Negate the added border\n margin-bottom: $govuk-header-link-underline-thickness * -1;\n border-bottom: $govuk-header-link-underline-thickness solid;\n }\n\n // Remove any borders that show when focused and hovered.\n &:focus {\n margin-bottom: 0;\n border-bottom: 0;\n }\n\n @include _govuk-rebrand {\n display: inline;\n\n // Remove word-spacing from within the logo so we can ignore\n // whitespace characters in the HTML\n word-spacing: govuk-px-to-rem(-6px);\n\n // Reset word-spacing for child elements\n > * {\n word-spacing: 0;\n }\n\n &:not(:focus) {\n background-color: $govuk-header-rebrand-background;\n }\n }\n }\n\n .govuk-header__service-name {\n display: inline-block;\n margin-bottom: govuk-spacing(2);\n @include govuk-font-size($size: 24);\n @include govuk-typography-weight-bold;\n\n @include _govuk-rebrand {\n // Apply margins to internal elements to emulate padding\n margin-bottom: govuk-spacing(3);\n\n @media #{govuk-from-breakpoint(desktop)} {\n // Magic number to align service name baseline with the GOV.UK logo\n $service-name-offset: 4px;\n\n margin: (govuk-spacing(3) + $service-name-offset) 0 (govuk-spacing(3) - $service-name-offset);\n }\n }\n }\n\n .govuk-header__logo,\n .govuk-header__content {\n box-sizing: border-box;\n }\n\n .govuk-header__logo {\n @include govuk-responsive-margin($govuk-header-vertical-spacing-value, \"bottom\");\n\n @media #{govuk-from-breakpoint(desktop)} {\n width: 33.33%;\n padding-right: $govuk-gutter-half;\n float: left;\n vertical-align: top;\n\n // Reset float when logo is the last child, without a navigation\n &:last-child {\n width: auto;\n padding-right: 0;\n float: none;\n }\n }\n\n @include _govuk-rebrand {\n // Apply margins to internal elements to emulate padding\n margin-bottom: 0;\n\n // Magic numbers, set padding to vertically centre align the logo\n padding-top: 16px;\n padding-bottom: 14px - $govuk-header-rebrand-logo-bottom-margin;\n }\n }\n\n .govuk-header__content {\n @media #{govuk-from-breakpoint(desktop)} {\n width: 66.66%;\n padding-left: $govuk-gutter-half;\n float: left;\n }\n }\n\n .govuk-header__menu-button {\n @include govuk-font($size: 16);\n max-width: $govuk-header-menu-button-width;\n min-height: $govuk-header-menu-button-height;\n margin-bottom: govuk-spacing(1);\n padding: 0;\n border: 0;\n color: govuk-colour(\"white\");\n background: none;\n word-break: break-all;\n cursor: pointer;\n\n &:hover {\n text-decoration: solid underline $govuk-header-link-underline-thickness;\n\n @if $govuk-link-underline-offset {\n text-underline-offset: $govuk-link-underline-offset;\n }\n }\n\n &:focus {\n @include govuk-focused-text;\n }\n\n &::after {\n @include govuk-shape-arrow($direction: down, $base: 10px, $display: inline-block);\n content: \"\";\n margin-left: govuk-spacing(1);\n }\n\n &[aria-expanded=\"true\"]::after {\n @include govuk-shape-arrow($direction: up, $base: 10px, $display: inline-block);\n }\n\n @media #{govuk-from-breakpoint(mobile)} {\n position: absolute;\n // calculate top offset by:\n // - getting the vertical spacing for the top and the bottom of the header\n // - adding that to the crown height\n // - dividing it by 2 so you have the vertical centre of the header\n // - subtracting half the height of the menu button\n top: (((govuk-spacing($govuk-header-vertical-spacing-value) * 2) + $govuk-header-crown-height) / 2) -\n ($govuk-header-menu-button-height / 2);\n right: 0;\n margin: 0;\n }\n\n @media #{govuk-from-breakpoint(tablet)} {\n top: govuk-spacing(3);\n }\n\n .govuk-frontend-supported & {\n display: block;\n }\n\n &[hidden],\n .govuk-frontend-supported &[hidden] {\n display: none;\n }\n }\n\n .govuk-header__navigation {\n @media #{govuk-until-breakpoint(mobile)} {\n @include _govuk-rebrand {\n padding-bottom: govuk-spacing(3);\n }\n }\n\n @media #{govuk-from-breakpoint(desktop)} {\n margin-bottom: govuk-spacing(2);\n\n @include _govuk-rebrand {\n // Magic number so that the bottom of the nav links aligns with the\n // baseline of the GOV.UK logo\n $navigation-offset: 7px;\n\n // Apply margins to internal elements to emulate padding\n margin-bottom: 0;\n padding: (govuk-spacing(3) + $navigation-offset) 0 (govuk-spacing(3) - $navigation-offset);\n }\n }\n }\n\n .govuk-header__service-name + .govuk-header__navigation {\n @include _govuk-rebrand {\n @media #{govuk-from-breakpoint(desktop)} {\n // If there's both a service name and navigation,\n // remove the extra padding between them on desktop\n padding-top: 0;\n\n // Restore the full bottom padding as the navigation isn't standalone\n padding-bottom: govuk-spacing(3);\n }\n }\n }\n\n .govuk-header__navigation-list {\n // Reset user-agent default list styles\n margin: 0;\n padding: 0;\n list-style: none;\n\n &[hidden] {\n display: none;\n }\n\n @include _govuk-rebrand {\n @media #{govuk-from-breakpoint(mobile)} and #{govuk-until-breakpoint(desktop)} {\n padding-bottom: govuk-spacing(3);\n }\n }\n }\n\n .govuk-header__navigation--end {\n @media #{govuk-from-breakpoint(desktop)} {\n margin: 0;\n padding: govuk-spacing(1) 0;\n text-align: right;\n }\n }\n\n .govuk-header__navigation-item {\n padding: govuk-spacing(2) 0;\n border-bottom: 1px solid $govuk-header-nav-item-border-color;\n\n @media #{govuk-from-breakpoint(desktop)} {\n display: inline-block;\n margin-right: govuk-spacing(3);\n padding: govuk-spacing(1) 0;\n border: 0;\n }\n\n a {\n @include govuk-font-size($size: 16);\n @include govuk-typography-weight-bold;\n white-space: nowrap;\n }\n\n @include _govuk-rebrand {\n // Increase top padding of nav items...\n padding-top: govuk-spacing(3);\n\n // ...except on desktop\n @media #{govuk-from-breakpoint(desktop)} {\n padding-top: govuk-spacing(1);\n }\n\n // Change the dividing line colour between mobile nav items\n border-bottom-color: govuk-colour(\"white\");\n\n // Reduce default weight of links so that we can use bold for active ones\n a {\n @include govuk-typography-weight-regular;\n }\n }\n }\n\n .govuk-header__navigation-item--active {\n a {\n @include _govuk-rebrand {\n // Change active links to use bold text instead of changing colour\n @include govuk-typography-weight-bold;\n }\n\n &:link,\n &:hover,\n &:visited {\n color: $govuk-header-link-active;\n\n @include _govuk-rebrand {\n color: inherit;\n }\n }\n\n // When printing, use the normal blue as this contrasts better with the\n // white printing header\n @media print {\n color: $govuk-brand-colour;\n }\n\n // When focussed, the text colour needs to be darker to ensure that colour\n // contrast is still acceptable\n &:focus {\n color: $govuk-focus-text-colour;\n\n @include _govuk-rebrand {\n color: $govuk-focus-text-colour;\n }\n }\n }\n }\n\n .govuk-header__navigation-item:last-child {\n margin-right: 0;\n border-bottom: 0;\n }\n\n @media print {\n .govuk-header {\n border-bottom-width: 0;\n color: govuk-colour(\"black\");\n background: transparent;\n }\n\n .govuk-header__link {\n &:link,\n &:visited {\n color: govuk-colour(\"black\");\n }\n\n // Do not append link href to GOV.UK link when printing (e.g. '(/)')\n &::after {\n display: none;\n }\n }\n }\n}\n"]}