mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-02 18:18:35 +09:00
Oleg Isonen
5ed7588877
Closes https://github.com/webstudio-is/webstudio/issues/5336 Adds a tooltip to the Transforms section `+` button when transforms are unavailable for the selected element. The Transforms section now stays visible but inactive for unsupported elements, and the tooltip explains that transforms do not work with `display: inline` and suggests changing display to `inline-block` or `block`. Also adds shared CSS data helpers for HTML replaced elements so the transform availability check can distinguish regular inline elements from replaced inline elements like `img`.
30 lines
660 B
TypeScript
30 lines
660 B
TypeScript
/**
|
|
* HTML elements whose rendering is replaced by external content or a
|
|
* browser-provided widget.
|
|
*
|
|
* This is useful for CSS rules that distinguish regular inline boxes from
|
|
* replaced inline boxes.
|
|
*/
|
|
export const htmlReplacedElementTags = [
|
|
"audio",
|
|
"canvas",
|
|
"embed",
|
|
"iframe",
|
|
"img",
|
|
"input",
|
|
"object",
|
|
"select",
|
|
"textarea",
|
|
"video",
|
|
] as const;
|
|
|
|
const htmlReplacedElementTagSet = new Set(htmlReplacedElementTags);
|
|
|
|
export const isHtmlReplacedElementTag = (
|
|
tag: string
|
|
): tag is (typeof htmlReplacedElementTags)[number] => {
|
|
return htmlReplacedElementTagSet.has(
|
|
tag as (typeof htmlReplacedElementTags)[number]
|
|
);
|
|
};
|