Chriztian Steinmeier greystate
greystate
/ lk-content-name.js
Created
May 10, 2026 06:44
Umbraco UFM Component for items picked by a Contentment DataList property
This file contains hidden or 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
| import { UmbId } from '@umbraco-cms/backoffice/id' | |
| import { html } from '@umbraco-cms/backoffice/external/lit' | |
| import { getGuidFromUdi } from '@umbraco-cms/backoffice/utils' | |
| import { UmbDocumentItemRepository } from '@umbraco-cms/backoffice/document' | |
| import { UmbUfmElementBase, UmbUfmComponentBase, UMB_UFM_RENDER_CONTEXT } from '@umbraco-cms/backoffice/ufm' | |
| class LkContentNameUfmComponentApi extends UmbUfmComponentBase { | |
| render(token) { | |
| // Element MUST have the `ufm-` prefix | |
| return `<ufm-lk-content-name alias="${token.text}"></ufm-lk-content-name>` |
greystate
/ repeated-integers.js
Created
November 17, 2025 21:24
Solution for 'Interview question of the week' (week 47)
This file contains hidden or 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 repeatedIntegers(i) { | |
| let repeats = [] | |
| while (i > 0) { | |
| repeats.push(Array.from({ length: i }, (v, n) => i)) | |
| i -= 1 | |
| } | |
| return repeats.flat() | |
| } |
greystate
/ dabblet.css
Created
September 9, 2024 08:16
Testing @Property for animating an angle value
This file contains hidden or 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
| /** | |
| * Testing @property for animating an angle value | |
| */ | |
| @property --angle { | |
| syntax: "<angle>"; | |
| inherits: false; | |
| initial-value: 45deg; | |
| } | |
| :root { |
This file contains hidden or 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
| /** | |
| * Image with blurred background | |
| */ | |
| :root { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100dvh; | |
| } | |
| figure { |
This file contains hidden or 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
| /** | |
| * Image with blurred background | |
| */ | |
| :root { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100dvh; | |
| } | |
| figure { |
This file contains hidden or 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
| /** | |
| * Sections and modules test | |
| */ | |
| html { | |
| background: #e9e9e9; | |
| min-height: 100%; | |
| } | |
| body { margin:0; } |
This file contains hidden or 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
| /** | |
| * Pure CSS Reveal? | |
| */ | |
| html { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100%; |
This file contains hidden or 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
| /** | |
| * Overriding defaults with a layer | |
| */ | |
| html { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100%; | |
| } | |
| /* These are "Unlayered Styles" */ |
This file contains hidden or 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
| /** | |
| * Image Cloud | |
| */ | |
| html { | |
| background: #f06; | |
| background: linear-gradient(45deg, #f06, yellow); | |
| min-height: 100%; | |
| --pos-x: 48; | |
| --pos-y: 320; |
This file contains hidden or 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
| /** | |
| * CSS hyphenation test (none, manual & auto) | |
| */ | |
| .cards { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); border: 2px solid; padding: 1em; } | |
| .card { padding: 10px; border: 3px outset orange; hyphens: auto; } | |
| .no-hyphens { hyphens: none; background: rgba(200, 0, 0, 0.5); } | |
| .manual-hyphens { hyphens: manual; background: rgba(240, 120, 0, 0.5); } |
NewerOlder