mirror of https://github.com/voidlizard/hbs2
wip
This commit is contained in:
Dmitry Zuikov
parent
260eb3194d
commit
a1017800bf
|
|
@ -107,6 +107,19 @@ wrapped f = do
|
|||
body_ mempty f
|
||||
|
||||
|
||||
{- HLINT ignore "Eta reduce" -}
|
||||
|
||||
-- repoMenu :: Monad m => HtmlT m () -> HtmlT m ()
|
||||
repoMenu :: Term [Attribute] (t1 -> t2) => t1 -> t2
|
||||
repoMenu = ul_ []
|
||||
|
||||
|
||||
repoMenuItem0 :: Term [Attribute] (t1 -> t2) => [Attribute] -> t1 -> t2
|
||||
repoMenuItem0 misc name = li_ ([class_ "tab active"] <> misc <> [tabClick]) name
|
||||
|
||||
repoMenuItem :: Term [Attribute] (t1 -> t2) => [Attribute] -> t1 -> t2
|
||||
repoMenuItem misc name = li_ ([class_ "tab"] <> misc <> [tabClick]) name
|
||||
|
||||
renderRepoHtml :: Monad m => PluginMethod -> GitRepoPage -> m ByteString
|
||||
renderRepoHtml (Method _ kw) page@(GitRepoPage{..}) = pure $ renderBS $ wrapped do
|
||||
|
||||
|
|
@ -118,61 +131,21 @@ renderRepoHtml (Method _ kw) page@(GitRepoPage{..}) = pure $ renderBS $ wrapped
|
|||
let name' = coerce @_ @(Maybe Text) repoPageName
|
||||
let brief = coerce @_ @(Maybe Text) repoPageBrief & fromMaybe ""
|
||||
|
||||
let hrefBase = HM.lookup "URL_PREFIX" kw & List.singleton . maybe "/" Text.unpack
|
||||
& path
|
||||
|
||||
main_ do
|
||||
|
||||
nav_ [ role_ "tab-control", tabClick ] do
|
||||
ul_ do
|
||||
li_ [] $ label_ [Html.for_ "tab1", class_ "tab active"] "manifest"
|
||||
li_ [] $ label_ [Html.for_ "tab2", class_ "tab"] "Tab 2"
|
||||
li_ [] $ label_ [Html.for_ "tab3", class_ "tab"] "Tab 3"
|
||||
li_ [] $ label_ [Html.for_ "tab4", class_ "tab"] "Tab 4"
|
||||
|
||||
div_ [ role_ "tabs" ] do
|
||||
pure ()
|
||||
|
||||
-- div_ [ id_ "tabs"
|
||||
-- , term "hx-get" "manifest"
|
||||
-- , term "hx-trigger" "load delay:100ms"
|
||||
-- , term "hx-target" "#tabs"
|
||||
-- , term "hx-swap" "innerHTML"
|
||||
-- ] do
|
||||
|
||||
-- div_ [class_ "tab-list", role_ "tablist"] do
|
||||
-- button_ [ class_ "selected"
|
||||
-- , role_ "tab"
|
||||
-- , term "hx-get" "manifest"
|
||||
-- , term "aria-selected" "false"
|
||||
-- , term "aria-controls" "tab-content"
|
||||
-- ] "Manifest"
|
||||
|
||||
-- div_ [id_ "tab-content", role_ "tabpanel", class_ "tab-content"] do
|
||||
-- [qc|
|
||||
-- Commodo normcore truffaut VHS duis gluten-free keffiyeh iPhone taxidermy godard ramps anim pour-over.
|
||||
-- Pitchfork vegan mollit umami quinoa aute aliquip kinfolk eiusmod live-edge cardigan ipsum locavore.
|
||||
-- Polaroid duis occaecat narwhal small batch food truck.
|
||||
-- PBR&B venmo shaman small batch you probably haven't heard of them hot chicken readymade.
|
||||
-- Enim tousled cliche woke, typewriter single-origin coffee hella culpa.
|
||||
-- Art party readymade 90's, asymmetrical hell of fingerstache ipsum.
|
||||
-- |]
|
||||
|
||||
-- pure ()
|
||||
|
||||
-- section_ [id_ "repo-data"] do
|
||||
|
||||
-- for_ name' $ \name -> do
|
||||
-- h1_ (toHtml name)
|
||||
-- renderMarkdown brief
|
||||
|
||||
-- table_ do
|
||||
-- tr_ do
|
||||
-- th_ "code/hbs2:"
|
||||
-- td_ mempty
|
||||
|
||||
-- pure ()
|
||||
|
||||
|
||||
-- section_ [id_ "repo-manifest-text"] do
|
||||
-- renderMarkdown mf
|
||||
-- FIXME: click-on-nav-make-tab-lost-active
|
||||
nav_ [ role_ "tab-control" ] do
|
||||
repoMenu do
|
||||
repoMenuItem mempty $ a_ [href_ hrefBase] "root"
|
||||
repoMenuItem0 mempty "manifest"
|
||||
|
||||
section_ [id_ "repo-data"] do
|
||||
for_ name' $ \name -> do
|
||||
h1_ (toHtml name)
|
||||
renderMarkdown brief
|
||||
|
||||
renderMarkdown mf
|
||||
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ button.search svg {
|
|||
body, html {
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
font-size: 20px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -133,16 +133,14 @@ nav.left .info-block {
|
|||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
section#repo-manifest-text {
|
||||
width: 60rem;
|
||||
font-size: 24px;
|
||||
section#repo-data {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
|
||||
section#repo-manifest-text > h1::after,
|
||||
section#repo-manifest-text > h2::after,
|
||||
section#repo-manifest-text > h3::after,
|
||||
section#repo-manifest-text > h4::after
|
||||
section#repo-data> h1::after,
|
||||
section#repo-data> h2::after,
|
||||
section#repo-data> h3::after,
|
||||
section#repo-data> h4::after
|
||||
{
|
||||
content: "";
|
||||
display: block;
|
||||
|
|
@ -214,6 +212,10 @@ div .repo-list-item {
|
|||
color: inherit;
|
||||
}
|
||||
|
||||
.repo-info h2 {
|
||||
font-size: 1.35rem;
|
||||
}
|
||||
|
||||
.repo-info h2 a:hover {
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
|
@ -288,31 +290,31 @@ form.search button {
|
|||
vertical-align: top;
|
||||
}
|
||||
|
||||
|
||||
[role="tabs"] {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
[role="tabs"] section {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
[role="tabs"] figure {
|
||||
flex-grow: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
[role="tabs"] [type="radio"]:checked + figure {
|
||||
nav[role="tab-control"] {
|
||||
min-height: 24px;
|
||||
font-size: 18px;
|
||||
/* border: 1px solid black; */
|
||||
display: block;
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
nav[role="tab-control"] label.active {
|
||||
color: red; /*var(--primary);*/
|
||||
cursor: pointer;
|
||||
nav[role="tab-control"] li {
|
||||
display: block;
|
||||
padding: 0 0 0 0;
|
||||
padding-right: 1rem;
|
||||
margin-right: 2rem;
|
||||
border-right: 2px solid gray;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
nav[role="tab-control"] li a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
nav[role="tab-control"] li.active {
|
||||
display: block;
|
||||
color: #0089D1;
|
||||
}
|
||||
|
||||
|]
|
||||
|
|
@ -324,7 +326,7 @@ rootPage content = do
|
|||
head_ do
|
||||
meta_ [charset_ "UTF-8"]
|
||||
meta_ [name_ "viewport", content_ "width=device-width, initial-scale=1.0"]
|
||||
-- link_ [rel_ "stylesheet", href_"/css/pico.min.css"]
|
||||
-- FIXME: static-local-loading
|
||||
link_ [rel_ "stylesheet", href_ "https://cdn.jsdelivr.net/npm/@picocss/pico@2.0.6/css/pico.min.css"]
|
||||
script_ [src_ "https://unpkg.com/hyperscript.org@0.9.12"] ""
|
||||
script_ [src_ "https://unpkg.com/htmx.org@1.9.11"] ""
|
||||
|
|
|
|||
Loading…
Reference in New Issue