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

style(tooltips): content to the right and fixed width

Browse Source
This commit is contained in:
Sarah Vaupel 2019-10-01 15:17:14 +02:00
parent e5c7aa03db
commit 0c2f58fa42
3 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -61,7 +61,7 @@
display: none;
top: -10px;
transform: translateY(-100%);
right: 3px;
left: 3px;
width: 275px;
z-index: 10;
background-color: #fafafa;
@ -76,7 +76,7 @@
background-color: #fafafa;
transform: rotate(45deg);
position: absolute;
right: 10px;
left: 10px;
bottom: -8px;
}
}

6
src/Utils/Message.hs
View File

@ -196,7 +196,11 @@ getMessages = fmap decodeMessage <$> ClassyPrelude.Yesod.getMessages
messageTooltip :: forall site. Message -> WidgetFor site ()
messageTooltip Message{..} = let urgency = statusToUrgencyClass messageStatus
ic = iconText $ case messageIcon of
Nothing -> IconWarning
Nothing -> case messageStatus of
Utils.Message.Error -> IconProblem
Utils.Message.Warning -> IconWarning
Utils.Message.Success -> IconOK
Utils.Message.Info -> IconTooltipDefault
Just i -> i
tooltip = toWidget messageContent :: WidgetFor site ()
in $(whamletFile "templates/widgets/tooltip.hamlet")

2
templates/widgets/tooltip.hamlet
View File

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