GenieFramework / Stipple.jl

The reactive UI library for interactive data applications with pure Julia.
MIT License
321 stars 27 forks source link

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

Open hhaensel opened 9 months ago

hhaensel commented 9 months ago

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