Update catalog view styles

This commit is contained in:
towards-a-new-leftypol 2024-02-11 15:27:22 -05:00
parent 24758470af
commit b44523d6d9
3 changed files with 56 additions and 53 deletions

View File

@ -11,13 +11,6 @@
<script language="javascript" src="./dist/build/chandlr/chandlr.jsexe/lib.js"></script>
<script language="javascript" src="./dist/build/chandlr/chandlr.jsexe/out.js"></script>
<style>
.theme-catalog div.thread {
margin-top: .2em;
margin-bottom: .2em;
margin-left: .2em;
margin-right: .2em;
}
.post.op.multifile,
.post.reply.multifile .body {
clear: both;

View File

@ -15,7 +15,7 @@ import qualified Data.Text as T
import Data.JSString (append, JSString)
import Miso
( View, div_ , class_ , img_ , href_ , a_
, src_ , title_ , strong_ , span_
, src_ , title_ , b_ , span_
, p_ , id_ , Effect , noEff
, text, rawHtml, onWithOptions
, defaultOptions, preventDefault
@ -72,32 +72,34 @@ view iface model =
gridItem :: Interface a -> Model -> CatalogPost -> View a
gridItem iface m post =
div_
[ class_ "mix" ]
[ div_
[ class_ "thread grid-li grid-size-small" ]
[ a_
[ href_ thread_url
, onClick_ (threadSelected iface post)
]
[ img_
[ class_ "thread-image"
, src_ thumb_url
, title_ ( toMisoString $ show $ CatalogPost.bump_time post )
]
]
, div_
[ class_ "replies" ]
(
[ strong_ [][ text post_count_str ]
, p_
[ class_ "intro" ]
[ span_
[ class_ "subject" ]
subject
]
] ++ body
)
[ class_ "thread grid-li grid-size-small" ]
[ a_
[ href_ thread_url
, onClick_ (threadSelected iface post)
]
[ img_
[ class_ "thread-image"
, src_ thumb_url
, title_ ( toMisoString $ show $ CatalogPost.bump_time post )
]
]
, div_
[ class_ "replies" ]
(
[ div_
[ class_ "meta" ]
[ "R: "
, b_ [][ text post_count_str ]
, "+"
]
, p_
[ class_ "intro" ]
[ span_
[ class_ "subject" ]
subject
]
] ++ body
)
]
where
@ -108,7 +110,7 @@ gridItem iface m post =
body = map (rawHtml . toMisoString) $ maybeToList $ CatalogPost.body post
post_count_str :: MisoString
post_count_str = "R: " `append` (toMisoString $ (CatalogPost.estimated_post_count post) - 1) `append` "+"
post_count_str = toMisoString $ (CatalogPost.estimated_post_count post) - 1
thumb_url :: MisoString
thumb_url =

View File

@ -851,9 +851,8 @@ pre {
float: none!important;
margin: auto;
max-height: 150px;
max-width: 200px;
max-width: 150px;
box-shadow: 0 0 4px rgba(0,0,0,0.55);
border: 2px solid rgba(153,153,153,0);
}
.theme-catalog div.thread {
@ -861,18 +860,17 @@ pre {
vertical-align: top;
text-align: center;
font-weight: normal;
margin-top: 2px;
margin-bottom: 2px;
padding: 2px;
height: 300px;
width: 205px;
max-height: 300px;
width: 180px;
overflow: hidden;
position: relative;
font-size: 11px;
max-height: 300px;
background: rgba(182, 182, 182, 0.12);
border: 2px solid rgba(111, 111, 111, 0.34);
max-height:300px;
font-size: 10pt;
margin-top: 5px;
margin-bottom: 20px;
}
.theme-catalog .thread .meta {
font-size: 11px;
}
.theme-catalog div.thread strong {
@ -889,23 +887,33 @@ pre {
}
.theme-catalog div.grid-size-vsmall img {
max-height: 33%;
max-width: 95%
max-height: 80px;
max-width: 80px;
}
.theme-catalog div.grid-size-vsmall {
min-width:90px; max-width: 90px;
min-width: 90px;
max-width: 90px;
max-height: 148px;
font-size: 11px;
margin-bottom: 10px;
}
.theme-catalog div.grid-size-small img {
max-height: 33%;
max-width: 95%
min-width: 50px;
min-height: 50px;
max-width: 150px;
max-width: 150px;
}
.theme-catalog .thread.grid-size-small .replies {
max-width: 150px;
padding: 0 15px;
}
.theme-catalog div.grid-size-small {
min-width:140px; max-width: 140px;
max-height: 192px;
width: 180px;
}
.theme-catalog div.grid-size-medium img {