lovasoa / SQLpage

SQL-only webapp builder, empowering data analysts to build websites and applications quickly
https://sql.ophir.dev
MIT License
882 stars 62 forks source link

passings style to embed in card component #354

Open amrutadotorg opened 1 month ago

amrutadotorg commented 1 month ago

Hi, is it possible to pass the style="background-color: #FFFFFF" to embed?

Example embed code would look like this:

<iframe src="https://player.vimeo.com/video/951425265" style="background-color: #FFFFFF" width="1000" height="400" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

it might look like this

SELECT 'card' AS component, 1 AS columns;
SELECT
    'https://player.vimeo.com/video/951425265?transparent=0' AS embed,
    'autoplay; fullscreen; picture-in-picture; clipboard-write;' AS allow,
    'iframe' AS embed_mode,
    'background-color: #FFF123"' as style,
    '700' AS height;
amrutadotorg commented 1 month ago

added PR #355. If it is ok I will add info to the documentation.

djyotta commented 1 month ago

@lovasoa would be good to have this as an attribute for all elements...

lovasoa commented 1 month ago

Shouldn't we encourage using stylesheets instead?

djyotta commented 1 month ago

Sure, I'm just thinking about cases where stylesheet could be tricky or overkill. CSS is also a whole other beast to learn and understand if users are wanting a low code solution.

Personally, I've been using CSS via adding <style> tags inline via the text component. It's an abomination, I know, but I'm too lazy to reference and serve a static CSS file via the shell component.

I feel a style parameter for each component would be more elegant than what I'm currently doing.

Then again, eventually I plan to do it properly by adding a CSS file to the shell component, so maybe you're right and we can promote good behaviour by not providing support for style attribute on all components...