fraport/fradrive-old
Archived
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(tooltips): add option for inline tooltips

Browse Source
This commit is contained in:
Sarah Vaupel 2019-10-01 18:35:51 +02:00
parent 5a49febf9c
commit 0b2e9319be
7 changed files with 16 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/utils/tooltips/tooltips.scss
View File

@ -1,7 +1,7 @@
.tooltip { .tooltip {
position: relative; position: relative;
display: inline-block; display: inline-block;
vertical-align: -0.375rem; vertical-align: middle;
&:hover .tooltip__content { &:hover .tooltip__content {
display: inline-block; display: inline-block;
@ -55,8 +55,6 @@
} }
.tooltip.tooltip__inline { .tooltip.tooltip__inline {
vertical-align: middle;
.tooltip__handle { .tooltip__handle {
height: 1.0rem; height: 1.0rem;
line-height: 1.0rem; line-height: 1.0rem;

8
src/Handler/Info.hs
View File

@ -54,7 +54,7 @@ getInfoLecturerR =
tooltipPlanned = toWidget [whamlet| _{MsgLecturerInfoTooltipPlanned} |] tooltipPlanned = toWidget [whamlet| _{MsgLecturerInfoTooltipPlanned} |]
tooltipNewU2W = toWidget [whamlet| _{MsgLecturerInfoTooltipNewU2W} |] tooltipNewU2W = toWidget [whamlet| _{MsgLecturerInfoTooltipNewU2W} |]
newFeat, plannedFeat, newU2WFeat :: WidgetFor UniWorX () newFeat, plannedFeat, newU2WFeat :: WidgetFor UniWorX ()
newFeat = toWidget [whamlet| ^{iconTooltip tooltipNew (Just IconNew)} |] newFeat = toWidget [whamlet| ^{iconTooltip tooltipNew (Just IconNew) False} |]
-- probFeat = toWidget [whamlet| ^{iconTooltip tooltipProblem (Just IconProblem)} |] -- probFeat = toWidget [whamlet| ^{iconTooltip tooltipProblem (Just IconProblem) False} |]
plannedFeat = toWidget [whamlet| ^{iconTooltip tooltipPlanned (Just IconPlanned)} |] plannedFeat = toWidget [whamlet| ^{iconTooltip tooltipPlanned (Just IconPlanned) False} |]
newU2WFeat = toWidget [whamlet| ^{iconTooltip tooltipNewU2W (Just IconAnnounce)} |] newU2WFeat = toWidget [whamlet| ^{iconTooltip tooltipNewU2W (Just IconAnnounce) True} |] -- to be used inside text blocks

13
src/Utils/Icon.hs
View File

@ -119,12 +119,13 @@ icon ic = [shamlet|
|] |]
-- Create an icon (defaults to "?") with a specified tooltip -- Create an icon (defaults to "?") with a specified tooltip
iconTooltip :: forall site. WidgetFor site () -> Maybe Icon -> WidgetFor site () iconTooltip :: forall site. WidgetFor site () -> Maybe Icon -> Bool -> WidgetFor site ()
iconTooltip tooltip mIcon = let ic = iconText $ case mIcon of iconTooltip tooltip mIcon isInlineTooltip = let
Nothing -> IconTooltipDefault ic = iconText $ case mIcon of
Just i -> i Nothing -> IconTooltipDefault
urgency = "urgency__info" :: Text Just i -> i
in $(whamletFile "templates/widgets/tooltip.hamlet") urgency = "urgency__info" :: Text
in $(whamletFile "templates/widgets/tooltip.hamlet")
-- declare constats for all icons for compatibility and convenience -- declare constats for all icons for compatibility and convenience
-- "IconCourse" generates "iconCourse = icon IconCourse" -- "IconCourse" generates "iconCourse = icon IconCourse"

1
src/Utils/Message.hs
View File

@ -203,4 +203,5 @@ messageTooltip Message{..} = let urgency = statusToUrgencyClass messageStatus
Utils.Message.Info -> IconTooltipDefault Utils.Message.Info -> IconTooltipDefault
Just i -> i Just i -> i
tooltip = toWidget messageContent :: WidgetFor site () tooltip = toWidget messageContent :: WidgetFor site ()
isInlineTooltip = False
in $(whamletFile "templates/widgets/tooltip.hamlet") in $(whamletFile "templates/widgets/tooltip.hamlet")

2
templates/adminTest.hamlet
View File

@ -8,7 +8,7 @@
Der Handler sollte jeweils aktuelle Beispiele für alle möglichen Funktionalitäten enthalten, so dass man immer weiß, wo man nachschlagen kann. Der Handler sollte jeweils aktuelle Beispiele für alle möglichen Funktionalitäten enthalten, so dass man immer weiß, wo man nachschlagen kann.
<p> <p>
^{iconTooltip testTooltipMsg Nothing} ^{iconTooltip testTooltipMsg Nothing False}
^{messageTooltip msgInfoTooltip} ^{messageTooltip msgInfoTooltip}
^{messageTooltip msgSuccessTooltip} ^{messageTooltip msgSuccessTooltip}
^{messageTooltip msgWarningTooltip} ^{messageTooltip msgWarningTooltip}

2
templates/widgets/multiFileField.hamlet
View File

@ -20,6 +20,6 @@ $# new files
_{MsgMultiFileUploadInfo} _{MsgMultiFileUploadInfo}
<div .file-input__unpack> <div .file-input__unpack>
^{iconTooltip autoUnzipInfo Nothing} ^{iconTooltip autoUnzipInfo Nothing False}
<label for=#{fieldId}_zip>_{MsgAutoUnzip} <label for=#{fieldId}_zip>_{MsgAutoUnzip}
<input type=checkbox id=#{fieldId}_zip name=#{fieldName} value=#{unpackZips}> <input type=checkbox id=#{fieldId}_zip name=#{fieldName} value=#{unpackZips}>

2
templates/widgets/tooltip.hamlet
View File

@ -1,6 +1,6 @@
$newline never $newline never
<div .tooltip> <div .tooltip :isInlineTooltip:.tooltip__inline>
<div .tooltip__handle .#{urgency}> <div .tooltip__handle .#{urgency}>
<i .fas .fa-^{ic}> <i .fas .fa-^{ic}>
<div .tooltip__content> <div .tooltip__content>