croxton
/ craft-5-control-panel.css
Last active
April 11, 2024 07:54
Faux nested matrix blocks (Craft 5 version)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .matrixblock[data-type="sectionBlock"] > .titlebar > .blocktype { | |
| color: var(--text-color); | |
| font-weight: 600; | |
| } | |
| .matrixblock[data-type="sectionBlock"] ~ .matrixblock:not([data-type="sectionBlock"]) { | |
| margin-left: 15px; | |
| } | |
| .matrixblock + .matrixblock[data-type="sectionBlock"] { | |
| margin-top: 30px; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .matrixblock[data-type="sectionBlock"] ~ .matrixblock:not([data-type="sectionBlock"]) { | |
| margin-left: 14px; | |
| } | |
| .matrixblock + .matrixblock[data-type="sectionBlock"] { | |
| margin-top: 30px; | |
| } | |
| .matrixblock[data-type="sectionBlock"] ~ .matrixblock:not([data-type="sectionBlock"])::before { | |
| background: #DFE5EA; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * htmx components extension | |
| * | |
| * @author Mark Croxton, Hallmark Design | |
| * | |
| * How to use: | |
| * | |
| * 1. Include this script in your page, after htmx.js | |
| * <script src="/path/to/ext/components.js" defer></script> | |
| * |
croxton
/ uk-mainland-postcodes-regex.txt
Last active
November 13, 2023 11:44
Regex to match UK mainland postcodes (i.e. excluding UK Highlands and Islands postcodes)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Exclude UK Highland and Islands Regex: | |
| ^ # Start of line | |
| (?! # Exclude the following | |
| IV([1-9]|[1-4][0-9]|5[0-6])[\s]*([\d][A-Za-z]{2}) # Inverness IV1 - IV56 | |
| | # or | |
| BT[0-9]{1,2}[\s]*([\d][A-Za-z]{2}) # Belfast BT | |
| | | |
| GY[0-9]{1,2}[\s]*([\d][A-Za-z]{2}) # Guernsey GY | |
| | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Settings | |
| */ | |
| $sal-animation-duration: 0.5s !default; | |
| $sal-animation-delay: 0s !default; | |
| $sal-animation-easing: ease !default; | |
| $sal-slide-offset: 20% !default; | |
| $sal-zoom-in-scale: 0.9 !default; | |
| $sal-zoom-out-scale: 1.1 !default; |
croxton
/ cp-custom.js
Last active
January 4, 2023 17:28
Craft CMS - Sidebar Entry Types plugin: change the 'New entry' button to create an entry in the selected section and entry type.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (function() { | |
| // on click of sidebar entry type | |
| document.addEventListener('click', function (event) { | |
| if (event.target.parentNode && event.target.parentNode.matches('a[data-entry-type].sel')) { | |
| setTimeout(function () { | |
| manageNewEntryButton(event.target.parentNode); | |
| }, 10); | |
| } | |
| }, false); |
croxton
/ example.html
Last active
January 7, 2024 19:10
Adds a `hx-history-preserve` attribute to preserve the initial dom state of an element's children for history (before it has been manipulated by JS).
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="my-unique-id" hx-history-preserve> | |
| <p>Markup here wil be returned to it's original state on history restore.</p> | |
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //=========================================== | |
| // Create a new history entry for the request | |
| //=========================================== | |
| var pushUrl = getClosestAttributeValue(elt, "hx-push-url"); | |
| var elementIsBoosted = getInternalData(elt).boosted; | |
| if (pushUrl || elementIsBoosted) { | |
| // If hx-push-url is explicitly defined (and not "true" or "false"), | |
| // we already know what the final URL should be. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| htmx.on('htmx:beforeSwap', (htmxEvent) => { | |
| let incomingDOM = new DOMParser().parseFromString(htmxEvent.detail.xhr.response, "text/html"); | |
| // Transpose <meta> data, page-specific <link> tags and JSON-LD structured data | |
| // Note that hx-boost automatically swaps the <title> tag | |
| let selector = "head > meta:not([data-revision]), head *[rel=\"canonical\"], head *[rel=\"alternate\"], body script[type=\"application/ld+json\"]"; | |
| document.querySelectorAll(selector).forEach((e) => { | |
| e.parentNode.removeChild(e); | |
| }); | |
| incomingDOM.querySelectorAll(selector).forEach((e) => { | |
| if (e.tagName === 'SCRIPT') { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {# _layouts/base.twig #} | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>{{ entry.title }}</title> | |
| <link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet"> | |
| </head> | |
| <body> |
NewerOlder