Stipple.jl icon indicating copy to clipboard operation
Stipple.jl copied to clipboard

css class 'st-col' breaks q-gutter when applied at first level

Open hhaensel opened this issue 1 year ago • 0 comments
trafficstars

using cell() in a row with 'q-gutter' class at first level leads to unexpected results.

MWE:

using Stipple, Stipple.ReactiveTools
using StippleUI

@app begin
    @in c = false
    @in d::Any = Dict(:myclass => "c")
end

const UI = Ref(ParsedHTMLString[])

UI[] = [
    heading("htmldiv (without 'st-col')")
    row(class = "q-col-gutter-md",
        htmldiv(col = 2, btn(class = "full-width",  color = "primary", R"`${n}`"), @for(n in 1:25))
    )

    heading("cell (with 'st-col')")
    row(class = "q-col-gutter-md",
        cell(col = 2, btn(class = "full-width",  color = "primary", R"`${n}`"), @for(n in 1:25))
    )

    row(cell(class = "st-module", [
        heading("cell inside st-module (with 'st-col')")
        row(class = "q-col-gutter-md",
            cell(col = 2, btn(class = "full-width",  color = "primary", R"`${n}`"), @for(n in 1:25))
        )
    ]))
]

ui() = UI[]

@page("/", ui)

up(open_browser = true)

image

hhaensel avatar Dec 22 '23 13:12 hhaensel