Merge branch 'feat/modalicons' into 'master'

Make modal triggers not look like buttons anymore

See merge request !80
This commit is contained in:
Felix Hamann 2019-02-09 21:24:49 +01:00
commit 3f383d1608
5 changed files with 36 additions and 25 deletions

View File

@ -58,7 +58,7 @@ colCShortDescr = sortable (Just "cshort") (i18nCell MsgCourseShort)
(Just descr) -> cell (Just descr) -> cell
[whamlet| [whamlet|
$newline never $newline never
<span style="float:right"> <div>
^{modal "Beschreibung" (Right $ toWidget descr)} ^{modal "Beschreibung" (Right $ toWidget descr)}
|] |]
) )

View File

@ -81,7 +81,7 @@ courseCell Course{..} = anchorCell link name `mappend` desc
Nothing -> mempty Nothing -> mempty
(Just descr) -> cell [whamlet| (Just descr) -> cell [whamlet|
$newline never $newline never
<span style="float:right"> <div>
^{modal "Beschreibung" (Right $ toWidget descr)} ^{modal "Beschreibung" (Right $ toWidget descr)}
|] |]

View File

@ -4,9 +4,6 @@ import Data.Either (isLeft)
import Import.NoFoundation import Import.NoFoundation
lipsum :: WidgetT site IO ()
lipsum = $(widgetFile "widgets/lipsum")
modal :: WidgetT site IO () -> Either (SomeRoute site) (WidgetT site IO ()) -> WidgetT site IO () modal :: WidgetT site IO () -> Either (SomeRoute site) (WidgetT site IO ()) -> WidgetT site IO ()
modal modalTrigger modalContent = do modal modalTrigger modalContent = do
let modalDynamic = isLeft modalContent let modalDynamic = isLeft modalContent
@ -16,5 +13,14 @@ modal modalTrigger modalContent = do
case modalContent of case modalContent of
Left route -> do Left route -> do
route' <- toTextUrl route route' <- toTextUrl route
[whamlet|<a .btn ##{triggerId} href=#{route'}>^{modalTrigger}|] [whamlet|
Right _ -> [whamlet|<div .btn ##{triggerId}>^{modalTrigger}|] $newline never
<a .modal__trigger href=#{route'} ##{triggerId}>
<span .modal__trigger-label>^{modalTrigger}
|]
Right _ -> do
[whamlet|
$newline never
<div .modal__trigger ##{triggerId}>
<span .modal__trigger-label>^{modalTrigger}
|]

View File

@ -68,6 +68,11 @@
cursor: pointer; cursor: pointer;
} }
.modal__trigger-label {
font-style: italic;
text-decoration: underline;
}
.modal__closer { .modal__closer {
position: absolute; position: absolute;
top: 20px; top: 20px;