phfroidmont/scalive
1
0
Fork 0
mirror of https://github.com/phfroidmont/scalive.git synced 2025-12-25 05:26:59 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Use daisyui

Browse source
This commit is contained in:
Paul-Henri Froidmont 2025-09-17 02:29:38 +02:00
parent 38655142b0
commit b0caefd0f4
Signed by: phfroidmont
GPG key ID: BE948AFD7E7873BE
6 changed files with 60 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

38
example/src/CounterLiveView.scala
View file

@ -24,37 +24,37 @@ class CounterLiveView() extends LiveView[Msg, Model]:
def view(model: Dyn[Model]) =
div(
cls := "max-w-2xl mx-auto bg-white shadow rounded-2xl p-6 space-y-6",
h1(
cls := "text-2xl font-semibold tracking-tight text-gray-900",
"Counter with auto increment every second"
),
cls := "mx-auto card bg-base-100 max-w-2xl shadow-xl space-y-6",
div(
cls := "flex flex-wrap items-center gap-3",
button(
cls := "inline-flex items-center rounded-lg px-3 py-2 text-sm font-medium ring-1 ring-inset ring-gray-300 text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-400/30",
phx.click := Msg.ToggleCounter,
model(_.isVisible match
case true => "Hide counter"
case false => "Show counter")
)
),
model.when(_.isVisible)(
cls := "card-body",
h1(
cls := "card-title",
"Counter with auto increment every second"
),
div(
cls := "rounded-xl border border-gray-200 p-4 bg-gray-50",
cls := "flex flex-wrap items-center gap-3",
button(
cls := "btn btn-default",
phx.click := Msg.ToggleCounter,
model(_.isVisible match
case true => "Hide counter"
case false => "Show counter")
)
),
model.when(_.isVisible)(
div(
cls := "flex items-center justify-center gap-4",
button(
cls := "inline-flex items-center justify-center h-9 w-9 rounded-lg ring-1 ring-inset ring-gray-300 text-gray-700 hover:bg-white focus:outline-none focus:ring-2 focus:ring-gray-400/30",
cls := "btn btn-neutral",
phx.click := Msg.DecCounter,
"-"
),
div(
cls := "min-w-[4rem] text-center text-lg font-semibold text-gray-900",
cls := "min-w-[4rem] text-center text-lg font-semibold",
model(_.counter.toString)
),
button(
cls := "inline-flex items-center justify-center h-9 w-9 rounded-lg bg-gray-900 text-white shadow hover:opacity-90 focus:outline-none focus:ring-2 focus:ring-gray-900/30",
cls := "btn btn-neutral",
phx.click := Msg.IncCounter,
"+"
)

8
example/src/HomeLiveView.scala
View file

@ -14,14 +14,10 @@ class HomeLiveView() extends LiveView[String, Unit]:
def view(model: Dyn[Unit]) =
ul(
cls := "space-y-2",
cls := "mx-auto menu bg-base-100 rounded-box shadow-xl w-56",
links.map((path, name) =>
li(
link.navigate(
path,
cls := "block px-4 py-2 rounded-lg text-gray-700 hover:bg-gray-100 hover:text-gray-900 font-medium transition",
name
)
link.navigate(path, name)
)
)
)

64
example/src/ListLiveView.scala
View file

@ -23,41 +23,41 @@ class ListLiveView(someParam: String) extends LiveView[Msg, Model]:
def view(model: Dyn[Model]) =
div(
h1(
cls := "text-2xl font-semibold tracking-tight text-gray-900",
someParam
),
cls := "max-w-2xl mx-auto bg-white shadow rounded-2xl p-6 space-y-6",
idAttr := "42",
ul(
cls := "divide-y divide-gray-200",
model(_.elems).splitByIndex((_, elem) =>
li(
cls := "py-3 flex flex-wrap items-center justify-between gap-2",
span(
cls := "text-gray-700",
"Nom: ",
span(cls := "font-medium", elem(_.name))
),
span(
cls := "text-sm text-gray-500",
"Age: ",
span(cls := "font-semibold text-gray-700", elem(_.age.toString))
cls := "mx-auto card bg-base-100 max-w-2xl shadow-xl space-y-6",
div(
cls := "card-body",
h1(cls := "card-title", someParam),
ul(
cls := "divide-y divide-base-200",
model(_.elems).splitByIndex((_, elem) =>
li(
cls := "py-3 flex flex-wrap items-center justify-between gap-2",
span(
cls := "text-base-content",
"Nom: ",
span(cls := "font-semibold", elem(_.name))
),
span(
cls := "text-sm opacity-70",
"Age: ",
span(cls := "font-bold", elem(_.age.toString))
)
)
)
)
),
div(
cls := "flex flex-wrap items-center gap-3",
button(
cls := "inline-flex items-center rounded-lg px-3 py-2 text-sm font-medium bg-gray-900 text-white shadow hover:opacity-90 focus:outline-none focus:ring-2 focus:ring-gray-900/30",
phx.click := Msg.IncAge(1),
"Inc age"
),
span(cls := "grow"),
button(
phx.click := JS.toggleClass("bg-red-500 border-5"),
"Toggle color"
div(
cls := "card-actions",
button(
cls := "btn btn-default",
phx.click := Msg.IncAge(1),
"Inc age"
),
span(cls := "grow"),
button(
cls := "btn btn-neutral",
phx.click := JS.toggleClass("btn-neutral btn-accent"),
"Toggle color"
)
)
)
)

3
example/src/RootLayout.scala
View file

@ -3,7 +3,8 @@ import scalive.*
object RootLayout:
def apply(content: HtmlElement): HtmlElement =
htmlRootTag(
lang := "en",
lang := "en",
dataAttr("theme") := "business",
headTag(
metaTag(charset := "utf-8"),
metaTag(nameAttr := "viewport", contentAttr := "width=device-width, initial-scale=1"),

3
example/tailwind.css
View file

@ -5,3 +5,6 @@
@plugin '@tailwindcss/aspect-ratio';
@source './src/**/*.scala';
@plugin "daisyui" {
themes: business;
}