0
/
chandler-miso
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
index.html
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/lib.js"></script>
<script language="javascript" src="./dist/build/chandlr/chandlr.jsexe/out.js"></script> <script language="javascript" src="./dist/build/chandlr/chandlr.jsexe/out.js"></script>
<style> <style>
.theme-catalog div.thread {
margin-top: .2em;
margin-bottom: .2em;
margin-left: .2em;
margin-right: .2em;
}
.post.op.multifile, .post.op.multifile,
.post.reply.multifile .body { .post.reply.multifile .body {
clear: both; clear: both;

56
src/Component/CatalogGrid.hs
View File

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

46
static/style.css
View File

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