more tinkering with new uiQ
This commit is contained in:
parent
2c0253b1d0
commit
6b62e83099
15 changed files with 156 additions and 176 deletions
|
@ -27,7 +27,7 @@ import Yesod.AtomFeed
|
||||||
getHomeR :: Handler Html
|
getHomeR :: Handler Html
|
||||||
getHomeR = do
|
getHomeR = do
|
||||||
recentMedia <- runDB $ selectList [] [Desc MediumTime, LimitTo 15]
|
recentMedia <- runDB $ selectList [] [Desc MediumTime, LimitTo 15]
|
||||||
nextMediaQuery <- runDB $ selectList [] [Desc MediumTime, LimitTo 1, OffsetBy 30]
|
nextMediaQuery <- runDB $ selectList [] [Desc MediumTime, LimitTo 1, OffsetBy 15]
|
||||||
let nextMedia = not $ L.null nextMediaQuery
|
let nextMedia = not $ L.null nextMediaQuery
|
||||||
defaultLayout $ do
|
defaultLayout $ do
|
||||||
rssLink RootFeedRssR "Root Feed"
|
rssLink RootFeedRssR "Root Feed"
|
||||||
|
|
|
@ -31,7 +31,7 @@ getNewAlbumR = do
|
||||||
(albumWidget, enctype) <- generateFormPost $
|
(albumWidget, enctype) <- generateFormPost $
|
||||||
renderBootstrap3 BootstrapBasicForm $
|
renderBootstrap3 BootstrapBasicForm $
|
||||||
albumForm userId
|
albumForm userId
|
||||||
formLayout $ do
|
defaultLayout $ do
|
||||||
setTitle "Eidolon :: Create new Album"
|
setTitle "Eidolon :: Create new Album"
|
||||||
$(widgetFile "newAlbum")
|
$(widgetFile "newAlbum")
|
||||||
Nothing -> do
|
Nothing -> do
|
||||||
|
|
|
@ -12,11 +12,6 @@ body {
|
||||||
color: rgba(255,255,255,0.7);
|
color: rgba(255,255,255,0.7);
|
||||||
}
|
}
|
||||||
|
|
||||||
#main {
|
|
||||||
margin-top: 80px;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: white;
|
color: white;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -54,19 +49,14 @@ a:hover, .item a:hover, .medium a:hover, a:hover figcaption {
|
||||||
margin: 40px 80px 40px;
|
margin: 40px 80px 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#reel {
|
.reel {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0 80px;
|
margin: 80px 80px 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.middle {
|
|
||||||
position: relative;
|
|
||||||
top: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item, .medium {
|
.item, .medium {
|
||||||
color: rgba(0,0,0,0.7);
|
color: rgba(0,0,0,0.7);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
@ -109,6 +99,10 @@ a:hover, .item a:hover, .medium a:hover, a:hover figcaption {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.subheader > * {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.subheader a {
|
.subheader a {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: inline;
|
display: inline;
|
||||||
|
@ -122,6 +116,8 @@ a:hover, .item a:hover, .medium a:hover, a:hover figcaption {
|
||||||
|
|
||||||
.subheader p {
|
.subheader p {
|
||||||
font-size: 14pt;
|
font-size: 14pt;
|
||||||
|
display: block;
|
||||||
|
height: 150px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.column {
|
.column {
|
||||||
|
@ -195,6 +191,10 @@ footer {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.middle {
|
||||||
|
margin-top: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 755px) {
|
@media (max-width: 755px) {
|
||||||
#main {
|
#main {
|
||||||
margin-top: 120px;
|
margin-top: 120px;
|
||||||
|
|
|
@ -1,32 +1,26 @@
|
||||||
$newline always
|
$newline always
|
||||||
<div id="header" class="item" data-width="400">
|
<div .subheader .item>
|
||||||
<div class="inner">
|
|
||||||
<h1>Admin interface
|
<h1>Admin interface
|
||||||
<p>
|
<p>
|
||||||
Be careful with your actions here, every click will perform directly the advertised action.
|
Be careful with your actions here, every click will perform directly the advertised action.
|
||||||
|
|
||||||
|
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item>
|
||||||
<div class="inner">
|
|
||||||
<p>
|
<p>
|
||||||
<a href=@{AdminProfilesR}>User profiles
|
<a href=@{AdminProfilesR}>User profiles
|
||||||
|
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item>
|
||||||
<div class="inner">
|
|
||||||
<p>
|
<p>
|
||||||
<a href=@{AdminAlbumsR}>Albums
|
<a href=@{AdminAlbumsR}>Albums
|
||||||
|
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item>
|
||||||
<div class="inner">
|
|
||||||
<p>
|
<p>
|
||||||
<a href=@{AdminMediaR}>Media
|
<a href=@{AdminMediaR}>Media
|
||||||
|
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item>
|
||||||
<div class="inner">
|
|
||||||
<p>
|
<p>
|
||||||
<a href=@{AdminCommentR}>Comments
|
<a href=@{AdminCommentR}>Comments
|
||||||
|
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item>
|
||||||
<div class="inner">
|
|
||||||
<p>
|
<p>
|
||||||
<a href=@{AdminSearchReloadR}>Repopulate search index
|
<a href=@{AdminSearchReloadR}>Repopulate search index
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
$newline always
|
$newline always
|
||||||
<div #reel>
|
|
||||||
<div .subheader .item>
|
<div .subheader .item>
|
||||||
<h1>#{albumTitle album} <small>by <a href=@{UserR ownerName}>#{ownerSlug}</a></small>
|
<h1>#{albumTitle album} <small>by <a href=@{UserR ownerName}>#{ownerSlug}</a></small>
|
||||||
$if presence == True
|
$if presence == True
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<div #reel .middle>
|
<div .medium .middle>
|
||||||
<div .medium>
|
|
||||||
<form class="inner" method=post enctype=#{enctype}>
|
<form class="inner" method=post enctype=#{enctype}>
|
||||||
Upload multiple images
|
Upload multiple images
|
||||||
^{uploadWidget}
|
^{uploadWidget}
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<div #reel .middle>
|
<div .medium .middle>
|
||||||
<div .medium>
|
|
||||||
<form method=post enctype=#{enctype}>
|
<form method=post enctype=#{enctype}>
|
||||||
Image upload to album #{albumTitle album}
|
Image upload to album #{albumTitle album}
|
||||||
^{dUploadWidget}
|
^{dUploadWidget}
|
||||||
|
|
|
@ -9,11 +9,6 @@ $doctype 5
|
||||||
<meta name="author" content="">
|
<meta name="author" content="">
|
||||||
|
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||||
<noscript>
|
|
||||||
<link rel="stylesheet" href=@{StaticR css_style_css} />
|
|
||||||
<link rel="stylesheet" href=@{StaticR css_style_global_css} />
|
|
||||||
<link rel="stylesheet" href=@{StaticR css_style_desktop_css} />
|
|
||||||
<link rel="stylesheet" href=@{StaticR css_style_noscript_css} />
|
|
||||||
|
|
||||||
^{pageHead pc}
|
^{pageHead pc}
|
||||||
^{pageHead wc}
|
^{pageHead wc}
|
||||||
|
|
|
@ -43,5 +43,5 @@
|
||||||
$maybe msg <- mmsg
|
$maybe msg <- mmsg
|
||||||
<div #message>#{msg}
|
<div #message>#{msg}
|
||||||
|
|
||||||
<div id="main" role="main">
|
<div .reel role="main">
|
||||||
^{pageBody wc}
|
^{pageBody wc}
|
||||||
|
|
|
@ -1,17 +1,16 @@
|
||||||
$doctype 5
|
$doctype 5
|
||||||
<div id="header">
|
<div .subheader .item>
|
||||||
<h1>Eidolon
|
<h1>Eidolon
|
||||||
<p>
|
<p>
|
||||||
A simple gallery System in Haskell and Yesod
|
A simple gallery System in Haskell and Yesod
|
||||||
<div #reel>
|
|
||||||
$forall (Entity mediumId medium) <- recentMedia
|
$forall (Entity mediumId medium) <- recentMedia
|
||||||
<article class="item">
|
<div class="item">
|
||||||
<a href=@{MediumR mediumId}>
|
<a href=@{MediumR mediumId}>
|
||||||
<figure>
|
<figure>
|
||||||
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
||||||
<figcaption>#{mediumTitle medium}
|
<figcaption>#{mediumTitle medium}
|
||||||
$if nextMedia
|
$if nextMedia
|
||||||
<div .item .pagination>
|
<div .item .subheader .pagin>
|
||||||
<p>
|
<p>
|
||||||
<a href=@{PageR 1}>
|
<a href=@{PageR 1}>
|
||||||
older
|
older
|
||||||
|
|
|
@ -1,7 +1,5 @@
|
||||||
$newline always
|
$newline always
|
||||||
|
<div .medium .middle>
|
||||||
<div #reel .middle>
|
|
||||||
<div .medium>
|
|
||||||
<noscript>Please enable Javascript
|
<noscript>Please enable Javascript
|
||||||
<h3>Login
|
<h3>Login
|
||||||
<form>
|
<form>
|
||||||
|
|
|
@ -1,17 +1,17 @@
|
||||||
<div .column>
|
<div .column>
|
||||||
<div class="medium">
|
<div .medium>
|
||||||
<h1>#{mediumTitle medium}
|
<h1>#{mediumTitle medium}
|
||||||
<p>
|
<p>
|
||||||
by <a href=@{UserR ownerName}>#{ownerName}</a> from album <a href=@{AlbumR albumId}>#{albumTitle album}</a>
|
by <a href=@{UserR ownerName}>#{ownerName}</a> from album <a href=@{AlbumR albumId}>#{albumTitle album}</a>
|
||||||
<div class="medium image">
|
<div .medium .image>
|
||||||
<a href=@{ir}>
|
<a href=@{ir}>
|
||||||
<picture>
|
<picture>
|
||||||
<source srcset="@{pr}, @{ir} 2x" media="(min-width: 600px)">
|
<source srcset="@{pr}, @{ir} 2x" media="(min-width: 600px)">
|
||||||
<source srcset="@{tr}, @{pr} 2x">
|
<source srcset="@{tr}, @{pr} 2x">
|
||||||
<img src=@{pr} title=#{mediumTitle medium}>
|
<img src=@{pr} title=#{mediumTitle medium}>
|
||||||
|
|
||||||
<div class="medium">
|
<div .medium>
|
||||||
<p class="desc">
|
<p>
|
||||||
Uploaded on: #{formatTime defaultTimeLocale "%A %F %H:%M" (mediumTime medium)}<br>
|
Uploaded on: #{formatTime defaultTimeLocale "%A %F %H:%M" (mediumTime medium)}<br>
|
||||||
$maybe d <- mediumDescription medium
|
$maybe d <- mediumDescription medium
|
||||||
Description:<br>
|
Description:<br>
|
||||||
|
@ -19,7 +19,7 @@
|
||||||
$nothing
|
$nothing
|
||||||
No description given
|
No description given
|
||||||
|
|
||||||
<div class="tags">
|
<div .tags>
|
||||||
<p>
|
<p>
|
||||||
Tags:
|
Tags:
|
||||||
<ul>
|
<ul>
|
||||||
|
@ -37,7 +37,7 @@
|
||||||
<p>There are no Comments yet
|
<p>There are no Comments yet
|
||||||
$else
|
$else
|
||||||
$forall (Entity commentId comment) <- comments
|
$forall (Entity commentId comment) <- comments
|
||||||
<div .medium .comment data-width="300">
|
<div .medium .comment>
|
||||||
<a href=@{ProfileR $ commentAuthor comment}>#{commentAuthorSlug comment}</a> wrote on #{formatTime defaultTimeLocale "%A %F %H:%M" $ commentTime comment}:
|
<a href=@{ProfileR $ commentAuthor comment}>#{commentAuthorSlug comment}</a> wrote on #{formatTime defaultTimeLocale "%A %F %H:%M" $ commentTime comment}:
|
||||||
<hr>
|
<hr>
|
||||||
#{commentContent comment}
|
#{commentContent comment}
|
||||||
|
@ -48,7 +48,7 @@
|
||||||
<a href=@{CommentDeleteR commentId}>Delete this comment
|
<a href=@{CommentDeleteR commentId}>Delete this comment
|
||||||
$forall (Entity replyId reply) <- replies
|
$forall (Entity replyId reply) <- replies
|
||||||
$if commentParent reply == Just commentId
|
$if commentParent reply == Just commentId
|
||||||
<article .comment .reply .medium>
|
<div .comment .reply .medium>
|
||||||
<a href=@{ProfileR $ commentAuthor reply}>#{commentAuthorSlug reply}</a> replied on #{formatTime defaultTimeLocale "%A %F %H:%M" $ commentTime reply}:
|
<a href=@{ProfileR $ commentAuthor reply}>#{commentAuthorSlug reply}</a> replied on #{formatTime defaultTimeLocale "%A %F %H:%M" $ commentTime reply}:
|
||||||
<hr>
|
<hr>
|
||||||
#{commentContent reply}
|
#{commentContent reply}
|
||||||
|
@ -57,8 +57,7 @@
|
||||||
<a href=@{CommentDeleteR replyId}>Delete this comment
|
<a href=@{CommentDeleteR replyId}>Delete this comment
|
||||||
|
|
||||||
$if userId /= Nothing
|
$if userId /= Nothing
|
||||||
<div class="medium">
|
<div .medium>
|
||||||
<div class="inner">
|
|
||||||
<form method=post enctype=#{enctype}>
|
<form method=post enctype=#{enctype}>
|
||||||
^{commentWidget}
|
^{commentWidget}
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<div id="header" class="item" data-width="300">
|
<div .medium .middle>
|
||||||
|
|
||||||
<h3>Create new Album
|
<h3>Create new Album
|
||||||
<form class="inner r" method=post enctype=#{enctype}>
|
<form class="inner r" method=post enctype=#{enctype}>
|
||||||
^{albumWidget}
|
^{albumWidget}
|
||||||
|
|
|
@ -1,24 +1,24 @@
|
||||||
$doctype 5
|
$doctype 5
|
||||||
$if page == 1
|
$if page == 1
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item .subheader>
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<p>
|
<p>
|
||||||
<a href=@{HomeR}>
|
<a href=@{HomeR}>
|
||||||
newer
|
newer
|
||||||
$else
|
$else
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item .subheader>
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<p>
|
<p>
|
||||||
<a href=@{PageR (page - 1)}>
|
<a href=@{PageR (page - 1)}>
|
||||||
newer
|
newer
|
||||||
$forall (Entity mediumId medium) <- pageMedia
|
$forall (Entity mediumId medium) <- pageMedia
|
||||||
<article class="item" data-width=#{mediumThumbWidth medium}>
|
<div .item>
|
||||||
<a href=@{MediumR mediumId}>
|
<a href=@{MediumR mediumId}>
|
||||||
<figure>
|
<figure>
|
||||||
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
||||||
<figcaption>#{mediumTitle medium}
|
<figcaption>#{mediumTitle medium}
|
||||||
$if nextMedia
|
$if nextMedia
|
||||||
<div id="header" class="item" data-width="400">
|
<div .item .subheader>
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<p>
|
<p>
|
||||||
<a href=@{PageR (page + 1)}>
|
<a href=@{PageR (page + 1)}>
|
||||||
|
|
|
@ -1,11 +1,10 @@
|
||||||
$newline always
|
$newline always
|
||||||
<div #header>
|
<div .subheader .item>
|
||||||
<h1>Profile of #{ownerSlug}
|
<h1>Profile of #{ownerSlug}
|
||||||
$if presence == True
|
$if presence == True
|
||||||
<a href=@{ProfileSettingsR ownerId}>Change your profile settings
|
<a href=@{ProfileSettingsR ownerId}>Change your profile settings
|
||||||
|
|
||||||
<div #reel>
|
<div .subheader .item>
|
||||||
<article .subheader .item>
|
|
||||||
$if null userAlbs
|
$if null userAlbs
|
||||||
<p class="center">This user has no albums yet
|
<p class="center">This user has no albums yet
|
||||||
$else
|
$else
|
||||||
|
@ -13,7 +12,7 @@ $newline always
|
||||||
<p>Albums of this user
|
<p>Albums of this user
|
||||||
$if not (null userAlbs)
|
$if not (null userAlbs)
|
||||||
$forall (Entity albumId album) <- userAlbs
|
$forall (Entity albumId album) <- userAlbs
|
||||||
<article class="item">
|
<div class="item">
|
||||||
<a href=@{AlbumR albumId}>
|
<a href=@{AlbumR albumId}>
|
||||||
<figure>
|
<figure>
|
||||||
$if (albumSamplePic album) == Nothing
|
$if (albumSamplePic album) == Nothing
|
||||||
|
@ -23,11 +22,11 @@ $newline always
|
||||||
<figcaption>#{albumTitle album}
|
<figcaption>#{albumTitle album}
|
||||||
|
|
||||||
$if not (null sharedAlbs)
|
$if not (null sharedAlbs)
|
||||||
<article .subheader .item>
|
<div .subheader .item>
|
||||||
<h1>Shared Albums
|
<h1>Shared Albums
|
||||||
<p>Albums others have shared with this user
|
<p>Albums others have shared with this user
|
||||||
$forall Just (Entity albumId album) <- sharedAlbs
|
$forall Just (Entity albumId album) <- sharedAlbs
|
||||||
<article .item>
|
<div .item>
|
||||||
<a href=@{AlbumR albumId}>
|
<a href=@{AlbumR albumId}>
|
||||||
<figure>
|
<figure>
|
||||||
$if (albumSamplePic album) == Nothing
|
$if (albumSamplePic album) == Nothing
|
||||||
|
@ -37,11 +36,11 @@ $newline always
|
||||||
<figcaption>#{albumTitle album}
|
<figcaption>#{albumTitle album}
|
||||||
|
|
||||||
$if not (null recentMedia)
|
$if not (null recentMedia)
|
||||||
<article .subheader .item>
|
<div .subheader .item>
|
||||||
<h1>Newest images
|
<h1>Newest images
|
||||||
<p>Recent uploads by #{ownerSlug}
|
<p>Recent uploads by #{ownerSlug}
|
||||||
$forall (Entity mediumId medium) <- take 10 recentMedia
|
$forall (Entity mediumId medium) <- take 10 recentMedia
|
||||||
<article .item>
|
<div .item>
|
||||||
<a href=@{MediumR mediumId}>
|
<a href=@{MediumR mediumId}>
|
||||||
<figure>
|
<figure>
|
||||||
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
<img src=@{StaticR $ StaticRoute (drop 2 $ map T.pack $ splitDirectories $ mediumThumb medium) []} title=#{mediumTitle medium}>
|
||||||
|
|
Loading…
Reference in a new issue