Redesign issue header

This commit is contained in:
Vladimir Krutkin 2024-10-11 14:49:53 +03:00 committed by voidlizard
parent 85f3053d85
commit 6eb63e9cce
3 changed files with 105 additions and 30 deletions

View File

@ -55,6 +55,7 @@ header>nav {
padding-top: var(--pico-block-spacing-vertical);
padding-bottom: var(--pico-block-spacing-vertical);
padding-left: var(--pico-block-spacing-horizontal);
overflow: auto;
}
article {
@ -89,9 +90,6 @@ article {
color: var(--pico-secondary-hover);
}
.copyable-text {
}
.copy-button .icon {
width: 1.125rem;
height: 1.125rem;
@ -110,19 +108,6 @@ article {
margin-bottom: var(--pico-block-spacing-vertical);
}
.mb-0 {
margin-bottom: 0;
}
.py-0 {
padding-top: 0;
padding-bottom: 0;
}
.text-nowrap {
text-wrap: nowrap;
}
.repo-menu {
--pico-nav-breadcrumb-divider: '|';
}
@ -147,6 +132,93 @@ aside li :where(a,[role=link]):not(:hover) {
margin-bottom: calc(var(--pico-typography-spacing-vertical) * .25);
}
.issue-info-card {
padding: 0;
}
.issue-info-card>header {
margin: 0;
}
.issue-info-card>header h5 {
color: inherit;
margin-bottom: 0;
}
.issue-info-table tr:hover {
background-color: var(--pico-background-color);
}
.issue-info-table td,
.issue-info-table th {
border-bottom-color: var(--pico-card-border-color);
}
.issue-info-table tr:last-child>td,
.issue-info-table tr:last-child>th {
border-bottom: none;
}
.issue-info-table tr:last-child>td:first-child,
.issue-info-table tr:last-child>th:first-child {
border-bottom-left-radius: var(--pico-border-radius);
}
.issue-info-table tr:last-child>td:last-child,
.issue-info-table tr:last-child>th:last-child {
border-bottom-right-radius: var(--pico-border-radius);
}
.issue-info-card .issue-id {
cursor: pointer;
border-bottom: none;
color: var(--pico-secondary);
}
.issue-info-card .issue-id:hover {
text-decoration: underline;
color: var(--pico-secondary-hover);
}
/* Tailwind-style classes */
.mb-0 {
margin-bottom: 0;
}
.mb-1 {
margin-bottom: var(--pico-spacing);
}
.p-0 {
padding: 0;
}
.py-0 {
padding-top: 0;
padding-bottom: 0;
}
.w-full {
width: 100%;
}
.whitespace-nowrap {
white-space: nowrap;
}
.font-normal {
font-weight: 400;
}
.text-secondary {
color: var(--pico-secondary);
}
.overflow-x-auto {
overflow-x: auto;
}
/* fastpok CSS end */

View File

@ -35,8 +35,8 @@ instance ToHtml (IssueOptionalArg Fixme FixmeAttrName) where
toHtml (IssueOptionalArg fxm n) = do
for_ (fixmeGet n fxm) $ \t -> do
tr_ do
th_ $ strong_ (toHtml $ show $ pretty n)
td_ (toHtml $ show $ pretty t)
td_ [class_ "whitespace-nowrap"] $ strong_ (toHtml $ show $ pretty n)
td_ [class_ "w-full"] (toHtml $ show $ pretty t)
toHtmlRaw = toHtml
@ -78,7 +78,7 @@ issuePage repo@(RepoLww lww) f = rootPage do
div_ [class_ "content"] $ do
nav_ [style_ "margin-bottom: 2em;"] do
nav_ [class_ "mb-1"] do
div_ do
small_ do
@ -87,20 +87,21 @@ issuePage repo@(RepoLww lww) f = rootPage do
span_ [class_ "inline-icon-wrapper"] $ svgIcon IconArrowUturnLeft
span_ [] "back to issues"
section_ do
table_ do
tr_ do
td_ [colspan_ "2"] do
article_ [class_ "issue-info-card"] do
header_ do
h5_ do
toHtml (coerce @_ @Text $ fixmeTag fxm)
" "
span_ [class_ "font-normal"] do
let fkKey = coerce @_ @Text $ fixmeKey fxm
strong_ [style_ "margin-right: 1ch;"] $ toHtml (coerce @_ @Text $ fixmeTag fxm)
span_ [ style_ "margin-right: 1ch;"
-- FIXME: make-underlined-on-hover
-- $assigned fastpok
, class_ "copyable-text"
span_ [ class_ "issue-id secondary"
, data_ "tooltip" "Copy"
, onClickCopyText $ Text.take 10 fkKey
] $ toHtml (H $ fixmeKey fxm)
" "
span_ [] $ toHtml (coerce @_ @Text $ fixmeTitle fxm)
toHtml (coerce @_ @Text $ fixmeTitle fxm)
div_ [class_ "overflow-x-auto"] $ table_ [class_ "issue-info-table mb-0"] do
toHtml (issueOptionalArg fxm "workflow")
toHtml (issueOptionalArg fxm "class")

View File

@ -48,6 +48,8 @@ onClickCopyText :: Text -> Attribute
onClickCopyText s =
hyper_ [qc|on click writeText('{s}') into the navigator's clipboard
set @data-tooltip to 'Copied!'
wait 2s
set @data-tooltip to 'Copy'
|]
@ -131,7 +133,7 @@ dashboardRootPage = rootPage do
div_ do
div_ [class_ "text-nowrap"] do
div_ [class_ "whitespace-nowrap"] do
small_ $ "Updated " <> toHtml updated
when locked do