TheAnachronism/docspell
1
0
Fork 0
mirror of https://github.com/TheAnachronism/docspell.git synced 2025-10-31 09:30:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix min height of tag area in detail

Browse Source 
This avoids "nervous/noisy" ui flickering when changing between items
where one has no tags/fields to show.
This commit is contained in:
Eike Kettner
2021-02-15 00:10:38 +01:00
parent a10971607e
commit 9c90d7c4c2
2 changed files with 12 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
modules/webapp/src/main/elm/Comp/ItemDetail/ItemInfoHeader.elm
View File

@@ -149,16 +149,14 @@ view settings model =
]
|> List.map Tuple.first
)
, div [ class "font-semibold mb-2 mt-3 pr-3" ]
(renderTagsAndFields settings model)
, renderTagsAndFields settings model
]
renderTagsAndFields : UiSettings -> Model -> List (Html Msg)
renderTagsAndFields : UiSettings -> Model -> Html Msg
renderTagsAndFields settings model =
[ div [ class "flex flex-row flex-wrap items-center sm:justify-end" ]
div [ class "flex flex-row flex-wrap items-center font-semibold sm:justify-end mt-1 min-h-7" ]
(renderTags settings model ++ renderCustomValues settings model)
]
renderTags : UiSettings -> Model -> List (Html Msg)
@@ -167,7 +165,7 @@ renderTags settings model =
tagView t =
Comp.LinkTarget.makeTagLink
(IdName t.id t.name)
[ ( "label inline-flex ml-2 hover:opacity-90 mt-1 items-center", True )
[ ( "label md:text-sm inline-flex ml-2 hover:opacity-90 mt-1 items-center", True )
, ( Data.UiSettings.tagColorString2 t settings, True )
]
SetLinkTarget
@@ -185,7 +183,7 @@ renderCustomValues settings model =
fieldView cv =
Comp.LinkTarget.makeCustomFieldLink2
cv
[ ( "ml-2 hover:opacity-90 mt-1 " ++ S.basicLabel, True ) ]
[ ( "ml-2 md:text-sm hover:opacity-90 mt-1 " ++ S.basicLabel, True ) ]
SetLinkTarget
labelThenName cv =

7
modules/webapp/src/main/styles/index.css
View File

@@ -120,6 +120,13 @@
z-index: 35;
}
@variants responsive {
.min-h-7 {
min-height: 1.75rem;
}
}
.scrollbar-none {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */