Change some styling on meme page
Signed-off-by: Skylar "The Cobra" Widulski <cobra@vern.cc>
This commit is contained in:
parent
d8648530b7
commit
3a7dbb8168
|
@ -119,6 +119,12 @@
|
|||
(li (@ (class "episodes"))
|
||||
(a (@ (href "/episodes"))))))))
|
||||
|
||||
(define footer
|
||||
`(footer
|
||||
(div (@ (class "box footer"))
|
||||
(p (a (@ (href "http://git.vern.cc/cobra/MeMe"))
|
||||
"Source Code")))))
|
||||
|
||||
(define (leaderboard-as-sxml leaderboard)
|
||||
`(div (@ (class "leaderboard box"))
|
||||
(ul (@ (class "leaderboard"))
|
||||
|
@ -156,11 +162,12 @@
|
|||
(define (meme-as-sxml meme)
|
||||
`(div
|
||||
(div (@ (class "box meme"))
|
||||
(img (@ (src ,(proxy (cadr meme)))))
|
||||
(h1 ,(car meme))
|
||||
,(html->shtml (caddr meme))
|
||||
,(html->shtml (cadddr meme))
|
||||
,(html->shtml (car (list-tail meme 4)))
|
||||
(img (@ (src ,(proxy (cadr meme))))))
|
||||
(div (@ (class "subdiv"))
|
||||
,(html->shtml (caddr meme))
|
||||
,(html->shtml (cadddr meme))
|
||||
,(html->shtml (car (list-tail meme 4)))))
|
||||
(div (@ (class "box meme-body"))
|
||||
,(map (lambda (s)
|
||||
(html->shtml (string-replace-substring s "https://knowyourmeme.com" "")))
|
||||
|
@ -249,7 +256,8 @@
|
|||
(body
|
||||
,heading
|
||||
(center
|
||||
(h1 (@ (class "error")) ,(number->string code)))))))
|
||||
(h1 (@ (class "error")) ,(number->string code)))
|
||||
,footer))))
|
||||
|
||||
(define (newsfeed-template body)
|
||||
(shtml->html
|
||||
|
@ -263,11 +271,13 @@
|
|||
,(pagination-as-sxml (get-pagination body)))
|
||||
(div (@ (class "right"))
|
||||
,(sidebar-gallery-as-sxml (get-sidebar-gallery body))
|
||||
,(sidebar-trending-as-sxml (get-sidebar-trending body)))))))
|
||||
,(sidebar-trending-as-sxml (get-sidebar-trending body)))
|
||||
,footer))))
|
||||
|
||||
(define (meme-template body)
|
||||
(shtml->html
|
||||
`(html ,(html-head "MeMe")
|
||||
(body
|
||||
,heading
|
||||
,(meme-as-sxml (get-meme body))))))
|
||||
,(meme-as-sxml (get-meme body))
|
||||
,footer))))
|
||||
|
|
|
@ -61,7 +61,8 @@ a {
|
|||
|
||||
.trending.box,
|
||||
.leaderboard.box,
|
||||
.heading.box {
|
||||
.heading.box,
|
||||
.footer.box {
|
||||
line-height: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
@ -178,9 +179,15 @@ table.trending-images img {
|
|||
|
||||
.meme.box {
|
||||
width: 93%;
|
||||
max-height: 8em;
|
||||
min-height: 8em;
|
||||
padding: 0 2%;
|
||||
padding-bottom: 1em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.meme.box .subdiv {
|
||||
bottom: 1em;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.meme-body.box {
|
||||
|
@ -191,21 +198,23 @@ table.trending-images img {
|
|||
.meme.box h1 {
|
||||
margin-bottom: 0.5em;
|
||||
margin-top: 0.3em;
|
||||
max-width: 65%;
|
||||
}
|
||||
|
||||
.meme.box img {
|
||||
max-height: 7em;
|
||||
max-height: 100%;
|
||||
width: 35%;
|
||||
float: right;
|
||||
margin-top: -7em;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.meme.box p, .meme.box h5 {
|
||||
margin: 0;
|
||||
.meme.box .subdiv p, .meme.box .subdiv h5 {
|
||||
margin: 0.5em 0;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
||||
.meme.box h5 {
|
||||
margin-bottom: 0.5em;
|
||||
.meme.box .subdiv h5 {
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
|
||||
.meme-body.box img {
|
||||
|
|
Loading…
Reference in New Issue