Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Re: Preview dialog - Dompurify parsing error with image shortcode
phiw13 wrote #338151:
Oooh… That is great. I’ll try testing today if the old body allows it (asthma is a tough lover).
Maybe I am holding it wrong. Safari 18.1 completely ignores all of the :host(#pane-preview) {}
style rules. In preview.css, in my theme stylesheet or with theme Hive. Firefox and Brave do what is expected.
At the moment I have no clue what is going wrong (and there are no errors in the console). It does not help that Safari’s inspector show next to nothing of the rules inside the shadowdom.
PS – The documentation page at MDN (developer.mozilla.org/en-US/docs/Web/CSS/:host_function) works perfectly fine
Last edited by phiw13 (2024-11-07 04:51:59)
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
phiw13 wrote #338153:
Maybe I am holding it wrong. Safari 18.1 completely ignores all of the
:host(#pane-preview) {}
style rules. In preview.css, in my theme stylesheet or with theme Hive. Firefox and Brave do what is expected.
progress… I have it working with Safari Technology Preview. There is hope that maybe maybe Safari 18.2 will cary those fixes. Need to check the pre-release release notes.
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
Meanwhile, here are some preliminary notes for some core custom-properties:
primary & secondary color (--txp-primary-color
)
primary & secondary background (--txp-primary-back
)
form controls input + select / button
color, background, border (input + button)
borders: light normal dark: --txp-border
, --txp-border-light
, --txp-border-dark
success / warning / error/ info: --txp-success-text
, --txp-success-back
, --txp-success-border
eventually: “selected” and “active” background color
--txp-spacing
(space between blocks, as margin or padding, gap, -> 1em, use calc() to adjust depending on need, eg @calc(var(—margin) * 0.5)“ for smaller or larger spacing
The idea is to use, for each, the same value as Hive currently uses. Names can be discussed.
jakob wrote #338145:
Philippe is right. […]
Thanks for testing and checking what Hive actually does! Anyway, Hive will need some updating, at least teach it to use core custom-properties (aliasing them as a minimum).
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
phiw13 wrote #338155:
progress… I have it working with Safari Technology Preview. There is hope that maybe maybe Safari 18.2 will cary those fixes. Need to check the pre-release release notes.
That might be JS as well, will check. Annoying, anyway.
Meanwhile, here are some preliminary notes for some core custom-properties:
Nice, thanks. But you UX gurus would code it much better and faster than me ;-)
Thanks for testing and checking what Hive actually does! Anyway, Hive will need some updating, at least teach it to use core custom-properties (aliasing them as a minimum).
+1. And it looks rather easy to combine user/system colour preferences.
Offline
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
phiw13 wrote #338153:
Safari 18.1 completely ignores all of the
:host(#pane-preview) {}
style rules. In preview.css, in my theme stylesheet or with theme Hive. Firefox and Brave do what is expected.
Does some of this work without including in :host(#pane-preview)
block? It is not necessary in preview.css
, and in external stylesheets it just prevents polluting the light dom, but can be removed too.
Nothing on caniuse.com/ seems to stop Safari 18.1 from working properly, though.
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
etc wrote #338161:
Nice, thanks. But you UX gurus would code it much better and faster than me ;-)
It is intended as note for discussion – e.g. naming, but also things that could be nice to include…
Anyway, I think for 4.9 we can start with a minimal set of building blocks and then improve or broaden the options later on.
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
etc wrote #338164:
Does some of this work without including in
:host(#pane-preview)
block? It is not necessary inpreview.css
, and in external stylesheets it just prevents polluting the light dom, but can be removed too.Nothing on caniuse.com/ seems to stop Safari 18.1 from working properly, though.
Yes what you select in the :host(#pane-preview)
block in preview.css would work (from within preview.css) without the :host()
part. Or from the them stylesheet, but then it leaks everywhere With :host()
is very nice to be able to style something in the preview dialog only.
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
Two building blocks for textpattern.css:
- I have extracted the whole block of ui-icons out the Hive stylesheet, you can find it here: dev.l-c-n.com/txp-css/txp-ui-icons.css
- A set of basic custom properties: colors, background-colors, border-colors, notification colors, which is available here: dev.l-c-n.com/txp-css/txp-css%20custom%20prop.css. Values are those used by theme Hive.
Todo: a basic set for handling form controls: inputs fields, buttons, etc.
Please incorporate in textpattern.css
, thank you.
(I will be traveling for a couple days, further will have to wait )
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
phiw13 wrote #338204:
I have extracted the whole block of ui-icons out the Hive stylesheet, you can find it here: dev.l-c-n.com/txp-css/txp-ui-icons.css
Oh, that’s great, thank you! We should then remove these rules from all admin themes. I’m not really concerned with themes development, so I’d leave it with Phil. I can submit an issue in the repo.
A set of basic custom properties: colors, background-colors, border-colors, notification colors, which is available here: dev.l-c-n.com/txp-css/txp-css%20custom%20prop.css. Values are those used by theme Hive.
That’s great too, but should be discussed among theme authors before further development. What are the elements that can be styled in textpattern.css
and shared by all themes (up to css variables redefinition)?
Have a nice journey!
Offline
Re: Preview dialog - Dompurify parsing error with image shortcode
I have updated the set of core custom properties to include some basic colouring for form controls.
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline