diff --git a/chandlr.cabal b/chandlr.cabal
index c4e7ba9..8df84b7 100644
--- a/chandlr.cabal
+++ b/chandlr.cabal
@@ -66,8 +66,8 @@ executable chandlr
Action
Network.Http
Network.Client
+ Network.CatalogPostType
Routes
- Common.PostsType
-- LANGUAGE extensions used by modules in this package.
-- other-extensions:
diff --git a/index.html b/index.html
index fc78657..6ed6bcb 100644
--- a/index.html
+++ b/index.html
@@ -3,11 +3,20 @@
-
+
Chandlr
+
+
diff --git a/src/Action.hs b/src/Action.hs
index 487d979..ecbc81a 100644
--- a/src/Action.hs
+++ b/src/Action.hs
@@ -2,9 +2,8 @@ module Action where
import Component.CatalogGrid as Grid
import Network.Client as Client
-import Data.Text (Text)
-import Common.PostsType (Post)
+import Network.CatalogPostType (CatalogPost)
data Action
= GridAction Grid.Action
@@ -14,6 +13,6 @@ data Action
, board :: String
, board_thread_id :: Int
}
- | HaveLatest (Client.HttpResult [Post])
+ | HaveLatest (Client.HttpResult [CatalogPost])
| ClientAction Client.Action
| NoAction
diff --git a/src/Component/CatalogGrid.hs b/src/Component/CatalogGrid.hs
index 768c117..443b376 100644
--- a/src/Component/CatalogGrid.hs
+++ b/src/Component/CatalogGrid.hs
@@ -3,37 +3,34 @@
module Component.CatalogGrid
( Model
, initialModel
-, Action
+, Action (..)
, Interface (..)
, view
, update
) where
+import Data.List (intercalate)
+import Data.Maybe (maybeToList)
+import Data.JSString (append)
import Miso
- ( View
- , div_
- , class_
- , img_
- , href_
- , a_
- , src_
- , alt_
- , title_
- , strong_
- , span_
- , p_
- , br_
- , id_
- , Effect
- , noEff
+ ( View , div_ , class_ , img_ , href_ , a_
+ , src_ , alt_ , title_ , strong_ , span_
+ , p_ , br_ , id_ , Effect , noEff
+ , text, rawHtml
)
-type Model = ()
+import Network.CatalogPostType (CatalogPost)
+import qualified Network.CatalogPostType as CatalogPost
+import Miso.String (toMisoString, MisoString)
+
+data Model = Model
+ { displayItems :: [ CatalogPost ]
+ } deriving Eq
initialModel :: Model
-initialModel = ()
+initialModel = Model { displayItems = [] }
-type Action = ()
+data Action = DisplayItems [ CatalogPost ]
data Interface a = Interface
{ passAction :: Action -> a
@@ -45,43 +42,63 @@ update
-> Action
-> Model
-> Effect a Model
-update = const $ const noEff
+update _ (DisplayItems xs) m = noEff (m { displayItems = xs })
+update _ _ m = noEff m
view :: Interface a -> Model -> View a
view iface model =
div_
- [ class_ "threads" ]
+ [ class_ "theme-catalog" ]
[ div_
- [ id_ "Grid" ]
- [ gridItem | _ <- [0..10] :: [ Int ] ]
+ [ class_ "threads" ]
+ [ div_
+ [ id_ "Grid" ]
+ (map gridItem (displayItems model))
+ ]
]
-gridItem :: View a
-gridItem =
+gridItem :: CatalogPost -> View a
+gridItem post =
div_
[ class_ "mix" ]
[ div_
[ class_ "thread grid-li grid-size-small" ]
[ a_
- [ href_ "/a/res/1.html" ]
+ [ href_ thread_url ]
[ img_
[ class_ "thread-image"
, src_ "/a/thumb/1111111111111.png"
, alt_ "Opening post image"
- , title_ "Dec 18 23:12"
+ , title_ ( toMisoString $ show $ CatalogPost.bump_time post )
]
]
, div_
[ class_ "replies" ]
- [ strong_ [][ "R: 517 / I: 204" ]
- , p_
- [ class_ "intro" ]
- [ span_
- [ class_ "subject" ][ "This is the thread subject, usually a brief description." ]
- ]
- , "Hello World"
- , br_ []
- , "Hello World2"
- ]
+ (
+ [ strong_ [][ text post_count_str ]
+ , p_
+ [ class_ "intro" ]
+ [ span_
+ [ class_ "subject" ]subject
+ ]
+ ] ++ body
+ )
]
]
+
+ where
+ subject :: [ View a ]
+ subject = map (text . toMisoString) $ maybeToList $ CatalogPost.subject post
+
+ body :: [ View a ]
+ body = map (rawHtml . toMisoString) $ maybeToList $ CatalogPost.body post
+
+ post_count_str :: MisoString
+ post_count_str = "R: " `append` (toMisoString $ CatalogPost.post_count post)
+
+ thread_url :: MisoString
+ thread_url = toMisoString $ intercalate "/"
+ [ CatalogPost.site_name post
+ , CatalogPost.pathpart post
+ , show $ CatalogPost.board_thread_id post
+ ]
diff --git a/src/Main.hs b/src/Main.hs
index 813646f..d8ecc55 100644
--- a/src/Main.hs
+++ b/src/Main.hs
@@ -127,14 +127,14 @@ mainUpdate (HaveLatest Client.Error) m = m <# do
consoleLog "Getting Latest failed!"
return NoAction
-mainUpdate (HaveLatest (Client.HttpResponse {..})) m = m <# do
+mainUpdate (HaveLatest (Client.HttpResponse {..})) m = m <#
case body of
Nothing -> do
consoleLog "Didn't get anything back from API"
+ return NoAction
Just posts -> do
mapM_ (consoleLog . toJSString . show) posts
-
- return NoAction
+ return $ GridAction $ Grid.DisplayItems posts
mainUpdate GetLatest m = m <# Client.fetchLatest (clientModel m) iClient
diff --git a/src/Network/CatalogPostType.hs b/src/Network/CatalogPostType.hs
new file mode 100644
index 0000000..92808d0
--- /dev/null
+++ b/src/Network/CatalogPostType.hs
@@ -0,0 +1,29 @@
+{-# LANGUAGE DeriveGeneric #-}
+{-# LANGUAGE DeriveAnyClass #-}
+
+module Network.CatalogPostType
+ ( CatalogPost (..) )
+ where
+
+import GHC.Generics
+import Data.Aeson (FromJSON, ToJSON)
+import Data.Time.Clock (UTCTime) -- Required for timestamp with time zone
+import Data.Int (Int64)
+import Data.Text (Text)
+
+data CatalogPost = CatalogPost
+ { post_id :: Maybe Int64
+ , board_post_id :: Int64
+ , board_thread_id :: Int64
+ , creation_time :: UTCTime
+ , bump_time :: UTCTime
+ , body :: Maybe Text
+ , name :: Maybe Text
+ , subject :: Maybe Text
+ , email :: Maybe Text
+ , thread_id :: Int
+ , post_count :: Int
+ , site_name :: String
+ , pathpart :: String
+ --, site_id :: Int
+ } deriving (Show, Generic, FromJSON, ToJSON, Eq)
diff --git a/src/Network/Client.hs b/src/Network/Client.hs
index 13e8be3..df7017f 100644
--- a/src/Network/Client.hs
+++ b/src/Network/Client.hs
@@ -26,15 +26,15 @@ import GHCJS.DOM.Types (JSString)
import Miso (effectSub, Effect)
import qualified Network.Http as Http
-import Common.PostsType (Post)
+import Network.CatalogPostType (CatalogPost)
-data Action = Connect (Http.HttpActionResult [Post])
+data Action = Connect (Http.HttpActionResult [CatalogPost])
data Interface a = Interface
{ passAction :: Action -> a
- , returnResult :: Http.HttpResult [Post] -> a
+ , returnResult :: Http.HttpResult [CatalogPost] -> a
}
data Model = Model
@@ -50,7 +50,7 @@ update
-> Effect a Model
update iface (Connect (abort, resultVar)) m = effectSub m $
\sink -> void $ forkIO $ do
- result :: Http.HttpResult [Post] <- takeMVar resultVar
+ result :: Http.HttpResult [CatalogPost] <- takeMVar resultVar
sink $ (returnResult iface) result
data FetchCatalogArgs = FetchCatalogArgs
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..d89d0cc
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,2003 @@
+/*Lainchan*/
+
+div.sidearrows{
+ display:none;
+}
+
+img {
+ image-orientation: from-image;
+}
+
+/* boardlist gets all scrunched on small screens */
+@media screen and (max-width: 600px) {
+ header, img.board_image {
+ margin-top: 5em;
+ }
+}
+
+@media screen and (min-width: 700px) {
+ header, img.board_image {
+ margin-top: 3em;
+ }
+}
+
+html, body {
+ max-width: 100%!important;
+ margin: 0;
+ box-sizing: border-box;
+}
+
+.post-image{
+ max-width: 94%!important;
+}
+select{
+ float:right;
+}
+
+div.pages{
+
+ margin:0!important;
+ padding: 0!important;
+}
+
+div.boardlist.bottom {
+
+ text-align: center!important;
+ display: none!important;
+}
+
+img.banner, img.board_image {
+
+ max-width: 100vw;
+
+}
+
+.pintro{
+ width: 98%!important;
+}
+
+.bar {
+
+ display: table!important;
+ position: fixed;
+ width: 100%;
+ left: 0px;
+ z-index: 3;
+ background-color: #D6DAF0;
+ border-color: #B7C5D9;
+}
+.bar > :not(script) {
+ display: table-cell;
+ vertical-align: middle;
+}
+.bar.top {
+ text-align: center;
+ top: 0px;
+ border-bottom: 1px solid #B7C5D9;
+}
+
+.bar.bottom {
+ bottom: 0px;
+ border-top: 1px solid #333333;
+ /*background-color: #333333 ;*/
+}
+
+
+/*homepage banner*/
+div.lain_banner{
+ margin:auto;
+ position: absolute;
+}
+
+
+/* === GENERAL TAG SETTINGS === */
+
+/* Page Layouts */
+body {
+ background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%;
+ color: black;
+ font-family: arial,helvetica,sans-serif;
+ font-size: 10pt;
+ padding-left: 4px;
+ padding-right: 4px;
+}
+
+main,
+aside,
+section {
+ display: block;
+ margin: 0 auto;
+ width: 100%;
+}
+
+main {
+ max-width: 1110px;
+}
+
+/* Tables */
+table {
+ margin: auto;
+
+}
+table.board-list-table {
+ width: 100%;
+}
+table tbody td {
+ margin: 0;
+ padding: 4px 15px 4px 4px;
+
+ text-align: left;
+}
+table thead th {
+ border: 1px solid #000333;
+ padding: 4px 15px 5px 5px;
+
+ background: #98E;
+ color: #000333;
+ text-align: left;
+ white-space: nowrap;
+}
+table tbody tr:nth-of-type( even ) {
+ background-color: transparent!important;
+}
+
+tr{
+
+}
+
+td.minimal,th.minimal {
+ width: 1%;
+ white-space: nowrap;
+}
+
+table.mod.config-editor {
+ font-size: 9pt;
+ width: 100%;
+}
+
+table.mod.config-editor td {
+ text-align: left;
+ padding: 5px;
+ border-bottom: 1px solid #98e;
+}
+
+table.mod.config-editor input[type="text"] {
+ width: 98%;
+}
+
+.longtable p {
+ margin: 0;
+}
+
+/* Uncategorized */
+#post-form-outer {
+ text-align: center;
+}
+
+#post-form-inner {
+ display: inline-block;
+}
+
+.post-table, .post-table-options, textarea {
+ width: 100%;
+}
+
+#post-form-inner .post-table tr {
+ background-color: transparent;
+}
+
+.post-table th, .post-table-options th {
+ width: 85px;
+}
+
+.post-table-options {
+ display: none;
+}
+
+.required-field-cell {
+ vertical-align: top;
+}
+
+.show-options-cell {
+ text-align: right;
+}
+
+.hidden {
+ display:none;
+}
+
+a,a:visited {
+ text-decoration: underline;
+ color: #34345C;
+}
+
+a:hover,.intro a.post_no:hover {
+ color: #ff0000;
+}
+
+a.post_no {
+ text-decoration: none;
+ margin: 0;
+ padding: 0;
+}
+
+.intro a.post_no {
+ color: inherit;
+}
+
+.intro a.post_no,p.intro a.email,p.intro a.post_anchor {
+ margin: 0;
+}
+
+.intro a.email span.name {
+ color: #34345C;
+}
+
+.intro a.email:hover span.name {
+ color: #ff0000;
+}
+
+.intro label {
+ display: inline;
+}
+
+.intro time,p.intro a.ip-link,p.intro a.capcode {
+ direction: ltr;
+ unicode-bidi: embed;
+}
+
+h2 {
+ color: #AF0A0F;
+ font-size: 11pt;
+ margin: 0;
+ padding: 0;
+}
+
+header {
+ margin: 3em 0;
+}
+
+h1 {
+ font-family: tahoma;
+ letter-spacing: -2px;
+ font-size: 20pt;
+ margin: 0;
+}
+
+header div.subtitle,h1 {
+ color: #AF0A0F;
+ text-align: center;
+}
+
+header div.subtitle {
+ font-size: 8pt;
+}
+
+form table {
+ margin: auto;
+}
+
+form table input {
+ height: auto;
+}
+
+input[type="text"],input[type="password"],textarea {
+ border: 1px solid #a9a9a9;
+ text-indent: 0;
+ text-shadow: none;
+ text-transform: none;
+ word-spacing: normal;
+ font-size: inherit;
+ font-family: sans-serif;
+
+ padding:0px!important;
+}
+
+
+
+#upload input[type="file"] {
+ max-width: 270px;
+}
+
+form table tr td {
+ text-align: left;
+ margin: 0;
+ padding: 0;
+}
+
+form table.mod tr td {
+ padding: 2px;
+}
+
+form table tr th {
+ text-align: left;
+ padding: 4px;
+}
+
+form table tr th {
+ background: #98E;
+}
+
+form table tr td div.center {
+ text-align: center;
+ float: left;
+ padding: 3px;
+ padding-top: 0px;
+ border: 1px dashed black;
+ margin: 2px
+}
+
+/*form table tr td div input {
+ display: block;
+ margin: 2px auto 0 auto;
+}
+form table tr td div label {
+ font-size: 10px;
+}*/
+
+.unimportant,.unimportant * {
+ font-size: 10px;
+}
+
+.file {
+ float: left;
+ margin-right: 2px;
+}
+
+.file:not(.multifile) .post-image {
+ float: left;
+}
+
+/*
+ * Party Hats
+ */
+
+/*
+.thread {
+ position: relative;
+}
+
+[data-board] > .files > :nth-child(1):not(.multifile) > a:before {
+ content: url('/static/partyhat.png');
+ position: absolute;
+ top: -120px;
+ left: 0px;
+
+}
+[data-board] > .files > :nth-child(1).multifile > a:before {
+ content: url('/static/partyhat.png');
+ position: absolute;
+ top: -120px;
+ left: -20px;
+
+}
+*/
+
+.file:not(.multifile) {
+ float: none;
+}
+
+p.fileinfo {
+ display: block;
+ margin: 0 0 0 20px;
+}
+
+div.post p.fileinfo {
+ padding-left: 5px;
+}
+
+div.banner {
+ background-color: #E04000;
+ font-size: 12pt;
+ font-weight: bold;
+ text-align: center;
+ margin: 1em 0;
+}
+
+div.banner,div.banner a {
+ color: white;
+}
+
+div.banner a:hover {
+ color: #EEF2FF;
+ text-decoration: none;
+}
+
+img.banner,img.board_image {
+ display: block;
+ margin: 3em auto 0 auto;
+}
+
+.post-image {
+ display: block;
+ float: left;
+ margin: 5px 20px 10px 20px;
+ border: none;
+}
+
+.full-image {
+ float: left;
+ padding: 5px;
+ margin: 0 20px 0 0;
+ max-width: 98%;
+}
+
+div.post .post-image {
+ padding: 5px;
+ margin: 0 20px 0 0;
+}
+
+div.post img.icon {
+ display: inline;
+ margin: 0 5px;
+ padding: 0;
+}
+
+div.post i.fa, div.thread i.fa {
+ margin: 0 4px;
+ font-size: 16px;
+}
+
+div.post.op {
+ margin-right: 20px;
+ margin-bottom: 5px;
+}
+
+div.post.op hr {
+ border-color: #D9BFB7;
+}
+
+.intro {
+ margin: 0.5em 0;
+ padding: 0;
+ padding-bottom: 0.2em;
+}
+
+input.delete {
+ float: left;
+ margin: 1px 6px 0 0;
+}
+
+.intro span.subject {
+ color: #0F0C5D;
+ font-weight: bold;
+}
+
+.intro span.name {
+ color: #117743;
+ font-weight: bold;
+}
+
+.intro span.capcode,p.intro a.capcode,p.intro a.nametag {
+ color: #F00000;
+ margin-left: 0;
+}
+
+.intro a {
+ margin-left: 5px;
+}
+
+.sage {
+ color: red;
+ font-weight: bold;
+}
+
+.required-star {
+ color: maroon;
+}
+
+div.post p {
+ display: block;
+ margin: 0;
+
+ line-height: 1.16em;
+ font-size: 13px;
+ min-height: 1.16em;
+}
+
+div.post div.body {
+ margin-top: 0.8em;
+ padding-right: 3em;
+ padding-bottom: 0.3em;
+}
+
+div.post.reply div.body {
+ margin-left: 1.8em;
+}
+
+div.post.reply.highlighted {
+ background: #D6BAD0;
+}
+
+div.post.reply div.body a {
+ color: #D00;
+}
+
+div.post div.body {
+ word-wrap: break-word;
+ white-space: pre-wrap;
+}
+
+div.post.reply {
+ background: #D6DAF0;
+ margin: 0.2em 4px;
+ padding: 0.5em 0.3em 0.5em 0.6em;
+ border-width: 1px;
+ border-style: none solid solid none;
+ border-color: #B7C5D9;
+ display: inline-block;
+ max-width: 94%!important;
+}
+
+div.post.reply.has-file.body-not-empty {
+ min-width: 33%;
+}
+
+div.post_modified {
+ margin-left: 1.8em;
+}
+div.post_modified div.content-status {
+ margin-top: 0.5em;
+ padding-bottom: 0em;
+ font-size: 72%;
+}
+div.post_modified div.content-status:first-child {
+ margin-top: 1.3em;
+}
+
+div.post_modified div.content-status:first-child {
+ margin-top: 1.3em;
+}
+
+a.dashed-underline {
+ text-decoration: none;
+ border-bottom: 1px dashed;
+}
+
+span.trip {
+ color: #228854;
+}
+
+.quote {
+ color: #789922;
+}
+
+span.omitted {
+ display: block;
+ margin-top: 1em;
+}
+
+br.clear {
+ clear: left;
+ display: block;
+}
+
+span.controls {
+ float: right;
+ margin: 0;
+ padding: 0;
+ font-size: 80%;
+}
+
+span.controls.op {
+ float: none;
+ margin-left: 10px;
+}
+
+span.controls a {
+ margin: 0;
+}
+
+div#wrap {
+ width: 900px;
+ margin: 0 auto;
+}
+
+div.module,
+div.ban {
+ background: white;
+ border: 1px solid #98E;
+ max-width: 700px;
+ margin: 30px auto;
+}
+
+div.ban p,
+div.ban h2 {
+ padding: 3px 7px;
+}
+
+div.ban h2 {
+ background: #98E;
+ color: black;
+ font-size: 12pt;
+}
+
+div.ban p {
+ font-size: 12px;
+ margin-bottom: 12px;
+}
+
+div.ban p.reason {
+ font-weight: bold;
+}
+
+span.heading {
+ color: #AF0A0F;
+ font-size: 11pt;
+ font-weight: bold;
+}
+
+span.spoiler {
+ background: black;
+ color: black;
+ padding: 0 1px;
+}
+
+div.post.reply div.body span.spoiler a {
+ color: black;
+}
+
+span.spoiler:hover,div.post.reply div.body span.spoiler:hover a {
+ color: white;
+}
+
+div.styles {
+ float: right;
+ padding-bottom: 20px;
+}
+
+div.styles a {
+ margin: 0 10px;
+}
+
+div.styles a.selected {
+ text-decoration: none;
+}
+
+table.test {
+ width: 100%;
+}
+
+table.test td,table.test th {
+ text-align: left;
+ padding: 5px;
+}
+
+table.test tr.h th {
+ background: #98E;
+}
+
+table.test td img {
+ margin: 0;
+}
+
+fieldset label {
+ display: block;
+}
+
+div.pages {
+ /*! color: #89A; */
+ /*! background: #D6DAF0; */
+ display: inline-block;
+ padding: 8px;
+ /*! margin: 8px 0 4px 0; */
+ /*! border-right: 1px solid #B7C5D9; */
+ /*! border-bottom: 1px solid #B7C5D9; */
+}
+
+div.pages.top {
+ display: block;
+ padding: 5px 8px;
+ margin-bottom: 5px;
+ position: fixed;
+ top: 0;
+ right: 0;
+ opacity: 0.9;
+}
+
+@media screen and (max-width: 800px) {
+ div.pages.top {
+ display: none!important;
+ }
+}
+
+div.pages a.selected {
+ color: black;
+ font-weight: bolder;
+}
+
+div.pages a {
+ text-decoration: none;
+}
+
+div.pages form {
+ margin: 0;
+ padding: 0;
+ display: inline;
+}
+
+div.pages form input {
+ margin: 0 5px;
+ display: inline;
+}
+
+hr {
+ border: none;
+ border-top: 1px solid #B7C5D9;
+ height: 0;
+ clear: left;
+}
+
+div.report {
+ color: #333;
+}
+
+div.top_notice {
+ text-align: center;
+ margin: 5px auto;
+}
+
+span.public_ban {
+ display: block;
+ color: red;
+ font-weight: bold;
+ margin-top: 15px;
+}
+
+span.public_warning {
+ display: block;
+ color: steelblue;
+ font-weight: bold;
+ margin-top: 15px;
+}
+
+span.toolong {
+ display: block;
+ margin-top: 15px;
+}
+
+div.blotter {
+ color: red;
+ font-weight: bold;
+ text-align: center;
+}
+
+.desktop-style div.boardlist:not(.bottom) {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ margin-top: 0;
+ z-index: 30;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
+ border-bottom: 1px solid;
+ background-color: #D6DAF0;
+}
+
+/*.desktop-style body {
+ padding-top: 20px;
+}*/
+
+.desktop-style .sub {
+ background: inherit;
+}
+
+.desktop-style .sub .sub {
+ display: inline-block;
+ text-indent: -9000px;
+ width: 7px;
+ background: url('img/arrow.png') right center no-repeat;
+}
+
+.desktop-style .sub .sub:hover,.desktop-style .sub .sub.hover {
+ display: inline;
+ text-indent: 0;
+ background: inherit;
+}
+
+#attention_bar {
+ height: 1.5em;
+ max-height: 1.5em;
+ width: 100%;
+ max-width: 100%;
+ text-align: center;
+ overflow: hidden;
+}
+
+#attention_bar_form {
+ display: none;
+ padding: 0;
+ margin: 0;
+}
+
+#attention_bar_input {
+ width: 100%;
+ padding: 0;
+ margin: 0;
+ text-align: center;
+}
+
+#attention_bar:hover {
+ background-color: rgba(100%,100%,100%,0.2);
+}
+
+.intro.thread-hidden {
+ margin: 0;
+ padding: 0;
+}
+
+form.ban-appeal {
+ margin: 9px 20px;
+}
+
+form.ban-appeal textarea {
+ display: block;
+}
+
+.MathJax_Display {
+ display:inline!important;
+}
+pre {
+ margin:0
+ display: inline!important;
+}
+
+.theme-catalog div.thread img {
+ float: none!important;
+ margin: auto;
+ max-height: 150px;
+ max-width: 200px;
+ box-shadow: 0 0 4px rgba(0,0,0,0.55);
+ border: 2px solid rgba(153,153,153,0);
+}
+
+.theme-catalog div.thread {
+ display: inline-block;
+ vertical-align: top;
+ text-align: center;
+ font-weight: normal;
+ margin-top: 2px;
+ margin-bottom: 2px;
+ padding: 2px;
+ height: 300px;
+ width: 205px;
+ 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;
+}
+
+.theme-catalog div.thread strong {
+ display: block;
+}
+
+.theme-catalog div.threads {
+ text-align: center;
+}
+
+.theme-catalog div.thread:hover {
+ background: #D6DAF0;
+ border-color: #B7C5D9;
+}
+
+.theme-catalog div.grid-size-vsmall img {
+ max-height: 33%;
+ max-width: 95%
+}
+
+.theme-catalog div.grid-size-vsmall {
+ min-width:90px; max-width: 90px;
+ max-height: 148px;
+}
+
+.theme-catalog div.grid-size-small img {
+ max-height: 33%;
+ max-width: 95%
+}
+
+.theme-catalog div.grid-size-small {
+ min-width:140px; max-width: 140px;
+ max-height: 192px;
+}
+
+.theme-catalog div.grid-size-medium img {
+ max-height: 33%;
+ max-width: 95%
+}
+
+.theme-catalog div.grid-size-medium {
+ min-width:200px; max-width: 200px;
+ max-height: 274px;
+}
+
+.theme-catalog div.grid-size-large img {
+ max-height: 40%;
+ max-width: 95%
+}
+
+.theme-catalog div.grid-size-large {
+ min-width: 256px; max-width: 256px;
+ max-height: 384px;
+}
+
+.theme-catalog img.thread-image {
+ height: auto;
+ max-width: 100%;
+}
+
+@media (max-width: 420px) {
+ header, img.board_image {
+ margin-top: 5em;
+ }
+ div.boardlist {
+ word-spacing:-3px;
+ }
+
+ .theme-catalog ul#Grid {
+ padding-left: 18px;
+ }
+
+ .theme-catalog div.thread {
+ width: auto;
+ margin-left: 0;
+ margin-right: 0;
+ }
+
+ .theme-catalog div.threads {
+ overflow: hidden;
+ }
+ div.post .body {
+ clear: both;
+ }
+}
+
+.compact-boardlist {
+ /*padding: 3px;*/
+ padding-bottom: 0;
+}
+
+.compact-boardlist .cb-item {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.compact-boardlist .cb-icon {
+ padding-bottom: 1px;
+}
+
+.compact-boardlist .cb-fa {
+ font-size: 16px;
+}
+
+.compact-boardlist .cb-cat {
+ padding: 0px 6px 0px 6px;
+}
+
+.cb-menuitem {
+ display: table-row;
+}
+
+.cb-menuitem span {
+ padding: 5px;
+ display: table-cell;
+ text-align: left;
+ border-top: 1px solid rgba(0,0,0,0.5);
+}
+
+.cb-menuitem span.cb-uri {
+ text-align: right;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned::before {
+ content: " [ ";
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned::after {
+ content: " ] ";
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned {
+ display: inline;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned a {
+ margin-left: 3pt;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned a:first-child {
+ margin-left: 0pt;
+}
+
+.compact-boardlist #watch-pinned {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.new-posts {
+ opacity: 0.6;
+ margin-top: 1em;
+}
+
+.new-threads, .board-settings {
+ text-align: center;
+}
+
+#options_handler, #alert_handler {
+ position: fixed;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ bottom: 0px;
+ width: 100%;
+ height: 100%;
+ text-align: center;
+ z-index: 9900;
+}
+
+#options_background, #alert_background {
+ background: black;
+ opacity: 0.5;
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ bottom: 0px;
+ width: 100%;
+ height: 100%;
+ z-index: -1;
+}
+
+#options_div, #alert_div {
+ background-color: #d6daf0;
+ border: 1px solid black;
+ display: inline-block;
+ position: relative;
+ margin-top: 20px;
+}
+
+#options_div {
+ width: 600px;
+ height: 360px;
+/* width: 620px;
+ height: 400px;
+ resize: both;
+ overflow: auto;*/
+}
+
+
+
+#alert_div {
+ width: 500px;
+}
+
+#alert_message {
+ text-align: center;
+ margin: 13px;
+ font-size: 110%;
+}
+
+.alert_button {
+ margin-bottom: 13px;
+}
+
+#options_div textarea {
+ max-width: 100%;
+}
+
+#options_close, #alert_close {
+ top: 0px;
+ right: 0px;
+ position: absolute;
+ margin-right: 3px;
+ font-size: 20px;
+ z-index: 100;
+}
+
+#options_tablist {
+ padding: 0px 5px;
+ left: 0px;
+ width: 90px;
+ top: 0px;
+ bottom: 0px;
+ height: 100%;
+ border-right: 1px solid black;
+}
+
+.options_tab_icon {
+ padding: 5px;
+ color: black;
+ cursor: pointer;
+}
+
+.options_tab_icon.active {
+ color: red;
+}
+
+.options_tab_icon i {
+ font-size: 20px;
+}
+
+.options_tab_icon div {
+ font-size: 11px;
+}
+
+.options_tab {
+ padding: 10px;
+ position: absolute;
+ top: 0px;
+ bottom: 10px;
+ left: 101px;
+ right: 0px;
+ text-align: left;
+ font-size: 12px;
+ overflow-y: auto;
+}
+
+.options_tab h2 {
+ text-align: center;
+ margin-bottom: 5px;
+}
+
+.mobile-style #options_div, .mobile-style #alert_div {
+ display: block;
+ width: 100%;
+ height: 100%;
+ margin-top: 0px;
+}
+
+.mentioned {
+ word-wrap: break-word;
+}
+
+.poster_id {
+ cursor: pointer;
+ white-space:nowrap;
+ display: inline-block;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ -o-user-select: none;
+ user-select: none;
+}
+.poster_id:hover {
+ color: #800000!important;
+}
+.poster_id::before {
+ content: " ID: ";
+}
+
+pre {
+/* Better code tags */
+ max-width:inherit;
+ word-wrap:normal;
+ overflow:auto;
+ display: block!important;
+ font-size:9pt;
+ font-family:monospace;
+}
+
+span.pln {
+ color:grey;
+}
+
+@media screen and (min-width: 768px) {
+ .intro {
+ clear: none;
+ }
+
+ div.post div.body {
+ clear: none;
+ }
+}
+
+/* === SITE-WIDE ASSETS === */
+#logo {
+ display: block;
+ width: 100%;
+ padding: 0;
+ margin: 0 0 0 0;
+ text-align: center;
+}
+#logo-link {
+ display: inline;
+}
+#logo-img {
+ display: inline-block;
+ height: 128px;
+ width: auto;
+}
+
+/* === GENERAL CLASSES === */
+.loading {
+ background: none;
+ background-color: none;
+ background-image: url('/static/infinity.gif');
+ background-position: center center;
+ background-repeat: no-repeat;
+ min-height: 76px;
+ min-width: 128px;
+}
+.loading-small {
+ background: none;
+ background-color: none;
+ background-image: url('/static/infinity-small.gif');
+ background-position: center center;
+ background-repeat: no-repeat;
+ min-height: 24px;
+ min-width: 48px;
+}
+
+/* Text and accessibility */
+.ltr {
+ direction: ltr;
+}
+.rtl {
+ direction: rtl;
+ font-family: Tahoma;
+}
+
+/* Responsive helpers */
+.col {
+ box-sizing: border-box;
+ float: left;
+}
+
+.col-12 { width: 100%; }
+.col-11 { width: 91.66666667%; }
+.col-10 { width: 83.33333333%; }
+.col-9 { width: 75%; }
+.col-8 { width: 66.66666667%; }
+.col-7 { width: 58.33333333%; }
+.col-6 { width: 50%; }
+.col-5 { width: 41.66666667%; }
+.col-4 { width: 33.33333333%; }
+.col-3 { width: 25%; }
+.col-2 { width: 16.66666667%; }
+.col-1 { width: 8.33333333%; }
+
+.left-push {
+ float: left;
+}
+.right-push {
+ float: right;
+}
+
+/* Layout design */
+.box {
+ background: #D6DAF0;
+ border: 1px solid #000333;
+ color: #000333;
+ margin: 0 0 12px 0;
+}
+.box-title {
+ background: #98E;
+ color: #000333;
+ font-size: 120%;
+ font-weight: bold;
+ padding: 4px 8px;
+}
+.box-content {
+ padding: 0 8px;
+ margin: 4px 0;
+}
+
+
+.clearfix {
+ display: block;
+ clear: both;
+ visibility: hidden;
+ overflow: hidden;
+
+ font-size: 0px;
+ line-height: 0px;
+
+ box-sizing: border-box;
+ border: none;
+ height: 0;
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ zoom: 1;
+}
+
+/* === SPECIFIC PAGES & FEATURES === */
+
+/* Board List */
+div.boardlist {
+ margin-top: 3px;
+
+ color: #89A;
+ font-size: 9pt;
+ word-spacing:-3px;
+}
+div.boardlist.bottom {
+ margin-top: 12px;
+ clear: both;
+}
+div.boardlist a {
+ text-decoration: none;
+}
+
+@-moz-document url-prefix() {
+
+div.boardlist {
+ word-spacing:-3px;
+}
+
+}
+
+/* Threads */
+/* Thread Footer */
+#thread-interactions {
+ margin: 8px 0;
+ clear: both;
+}
+#thread-links {
+ float: left;
+}
+#thread-links > a {
+ padding-left: none;
+ padding-right: 10px;
+}
+#thread-quick-reply {
+ display: none;
+ position: absolute;
+ left: 50%;
+ right: 50%;
+ text-align: center;
+ width: 100px;
+ margin-left: -50px;
+}
+#thread_stats {
+ float: right;
+}
+
+#post-moderation-fields {
+ float: right;
+ text-align: right;
+}
+#delete-fields {
+}
+#report-fields {
+}
+
+/* threadwatcher */
+#watchlist {
+ display: none;
+ max-height: 250px;
+ overflow: auto;
+ border: 1px solid;
+ border-style: none solid solid none;
+ width: 50%;
+ margin: 0 auto;
+ margin-bottom: 10px;
+}
+
+#watchlist {
+ font-size: 8pt;
+ width: 15%;
+ position: fixed;
+ right: 0pt;
+ top: 20pt;
+ margin: 0pt;
+ padding: 0pt;
+}
+
+.watchlist-inner, .watchlist-controls {
+ margin: 0pt;
+ text-align: center;
+}
+
+#watchlist-toggle, .watchThread, .watchlist-remove, #clearList, #clearGhosts {
+ cursor: pointer;
+}
+.own_post {
+ font-style: italic;
+ font-weight: normal;
+ opacity: .666;
+}
+li.mix {
+ display: inline-block;
+}
+
+/* Mona Font */
+.aa {
+ font-family: Mona, "MS PGothic", "MS Pゴシック", sans-serif;
+ display: block!important;
+ font-size: 12pt;
+ line-height: 1.1;
+}
+.dx,
+.dy,
+.dz {
+ width: 30px;
+ text-align: right;
+ display: inline-block;
+}
+
+/* Dice */
+.dice-option table {
+ border: 1px dotted black;
+ margin: 0;
+ border-collapse: collapse;
+}
+.dice-option table td {
+ text-align: center;
+ border-left: 1px dotted black;
+ padding-left: 2px;
+ padding-right: 2px;
+ padding-bottom: 2px;
+}
+
+/* Quick reply (why was most of this ever in the script?) */
+#quick-reply {
+ position: fixed;
+ right: 5%;
+ top: 5%;
+ float: right;
+ display: block;
+ padding: 0 0 0 0;
+ width: 300px;
+ z-index: 100;
+}
+#quick-reply #post-form-inner {
+ min-width: 300px;
+}
+#quick-reply .post-table tr td:nth-child(2) {
+ width: 33%;
+ text-align: right;
+ padding-right: 4px;
+}
+#quick-reply tr td:nth-child(2) input[type="submit"] {
+ width: 99%;
+}
+#quick-reply th, #quick-reply td {
+ margin: 0;
+ padding: 0;
+}
+#quick-reply th {
+ text-align: center;
+ padding: 2px 0;
+ border: 1px solid #222;
+}
+#quick-reply th .handle {
+ float: left;
+ width: 100%;
+ display: inline-block;
+}
+#quick-reply th .close-btn {
+ float: right;
+ padding: 0 5px;
+}
+#quick-reply input[type="text"], #quick-reply select {
+ width: 100%;
+ padding: 2px;
+ font-size: 10pt;
+ box-sizing: border-box;
+ -webkit-box-sizing:border-box;
+ -moz-box-sizing: border-box;
+}
+#quick-reply textarea {
+ min-width: 100%;
+ box-sizing: border-box;
+ -webkit-box-sizing:border-box;
+ -moz-box-sizing: border-box;
+ font-size: 10pt;
+ resize: both;
+}
+#quick-reply input, #quick-reply select, #quick-reply textarea {
+ margin: 0 0 1px 0;
+}
+#quick-reply input[type="file"] {
+ padding: 5px 2px;
+}
+#quick-reply .nonsense {
+ display: none;
+}
+#quick-reply td.recaptcha {
+ text-align: center;
+ padding: 0 0 1px 0;
+}
+#quick-reply td.recaptcha span {
+ display: inline-block;
+ width: 100%;
+ background: white;
+ border: 1px solid #ccc;
+ cursor: pointer;
+}
+#quick-reply td.recaptcha-response {
+ padding: 0 0 1px 0;
+}
+@media screen and (max-width: 600px) {
+ #quick-reply {
+ display: none !important;
+ }
+}
+
+#youtube-size input {
+ width: 50px;
+}
+
+/* File selector */
+.dropzone {
+ color: #000;
+ cursor: default;
+ margin: auto;
+ padding: 0px 4px;
+ text-align: center;
+ min-height: 50px;
+ max-height: 140px;
+ transition: 0.2s;
+ background-color: rgba(200, 200, 200, 0.5);
+ overflow-y: auto;
+}
+.dropzone-wrap {
+ width: 100%;
+}
+.dropzone .file-hint {
+ color: rgba(0, 0, 0, 0.5);
+ cursor: pointer;
+ position: relative;
+ margin-bottom: 5px;
+ padding: 10px 0px;
+ top: 5px;
+ transition: 0.2s;
+ border: 2px dashed rgba(125, 125, 125, 0.4);
+}
+.file-hint:hover, .dropzone.dragover .file-hint {
+ color: rgba(0, 0, 0, 1);
+ border-color: rgba(125, 125, 125, 0.8);
+}
+.dropzone.dragover {
+ background-color: rgba(200, 200, 200, 1);
+}
+.dropzone .file-thumbs {
+ text-align: left;
+ width: 100%;
+}
+.dropzone .tmb-container {
+ padding: 3px;
+ overflow-x: hidden;
+ white-space: nowrap;
+}
+.dropzone .file-tmb {
+ height: 40px;
+ width: 70px;
+ cursor: pointer;
+ display: inline-block;
+ text-align: center;
+ background-color: rgba(187, 187, 187, 0.5);
+ background-size: cover;
+ background-position: center;
+}
+.dropzone .file-tmb span {
+ font-weight: 600;
+ position: relative;
+ top: 13px;
+}
+.dropzone .tmb-filename {
+ display: inline-block;
+ vertical-align: bottom;
+ bottom: 12px;
+ position: relative;
+ margin-left: 5px;
+}
+.dropzone .remove-btn {
+ cursor: pointer;
+ color: rgba(10, 43, 175, 0.89);
+ display: inline-block;
+ vertical-align: bottom;
+ bottom: 10px;
+ position: relative;
+ margin-right: 5px;
+ font-size: 20px
+}
+.dropzone .remove-btn:hover {
+ color: rgba(125, 125, 125, 1);
+}
+
+table.board-list-table {
+ display: table;
+ margin: -2px;
+ margin-bottom: 10px;
+ overflow: hidden;
+ table-layout: fixed;
+}
+
+table.board-list-table .board-cell {
+ position: static;
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+table.board-list-table .board-cell::after {
+ content: ' ';
+ clear: both;
+}
+
+table.board-list-table .board-meta {
+ padding-right: 4px;
+ width: 70px;
+}
+table.board-list-table .board-uri {
+ max-width: 196px;
+}
+table.board-list-table .board-title {
+ width: auto;
+}
+table.board-list-table .board-pph {
+ width: 55px;
+ padding: 4px;
+}
+table.board-list-table .board-max {
+ width: 90px;
+ padding: 4px;
+}
+table.board-list-table .board-unique {
+ width: 100px;
+ padding: 4px;
+}
+table.board-list-table .board-tags {
+ position: relative;
+ height: 15px;
+ width: auto;
+ padding: 0 15px 0 4px;
+}
+table.board-list-table .board-tags .tag-link {
+ display: inline;
+}
+table.board-list-table .board-tags .board-cell:hover {
+ position: absolute;
+ background: #EEF2FF;
+ line-height: 23px;
+ top: 0;
+ bottom: 0;
+ width: 310px;
+}
+table.board-list-table tr:nth-of-type( even ) .board-tags .board-cell {
+ background: #D6DAF0;
+}
+table.board-list-table .board-uri a {
+ display: inline-block;
+ float: left;
+}
+table.board-list-table .board-uri .board-nsfw {
+ color: rgb(230,0,0);
+ margin: 0 0 0 0.6em;
+ float: right;
+}
+table.board-list-table .board-uri .board-sfw {
+ color: #34345C;
+ margin: 0 0 0 0.6em;
+ float: right;
+}
+
+table.board-list-table div.board-cell {
+ max-width: 100%;
+ overflow: hidden;
+}
+
+tbody.board-list-loading {
+ display: none;
+}
+tbody.board-list-loading .loading {
+ height: 80px;
+}
+
+tbody.board-list-omitted td {
+ background: #98E;
+ border-top: 1px solid #000333;
+ padding: 8px;
+ font-size: 125%;
+ text-align: center;
+}
+tbody.board-list-omitted #board-list-more {
+ cursor: default;
+}
+tbody.board-list-omitted #board-list-more.board-list-hasmore {
+ cursor: pointer;
+}
+tbody.board-list-omitted .board-page-loadmore {
+ display: none;
+}
+tbody.board-list-omitted .board-list-hasmore .board-page-loadmore {
+ display: inline;
+}
+
+aside.search-container {
+ margin-bottom: 12px;
+}
+aside.search-container .box {
+ margin-right: 12px;
+}
+
+.board-search {
+ margin: 8px 0;
+}
+.search-item {
+ margin: 8px 0;
+}
+.search-sfw {
+ display: block;
+ cursor: pointer;
+ font-size: 110%;
+ line-height: 120%;
+}
+#search-sfw-input {
+ margin: 0;
+ padding: 0;
+ transform: scale(1.20);
+}
+#search-lang-input,
+#search-title-input,
+#search-tag-input {
+ box-sizing: border-box;
+ font-size: 110%;
+ line-height: 120%;
+ vertical-align: top;
+ padding: 2px 0 2px 4px;
+ max-width: 100%;
+ min-width: 100%;
+ width: 100%:
+}
+#search-loading {
+ display: inline-block;
+ vertical-align: bottom;
+}
+
+ul.tag-list {
+ display: block;
+ list-style: none;
+ margin: 8px 8px -9px 8px;
+ padding: 8px 0 0 0;
+ border-top: 1px solid #000333;
+}
+ul.tag-list::after {
+ content: ' ';
+ display: block;
+ clear: both;
+}
+li.tag-item {
+ display: inline-block;
+ float: left;
+ font-size: 100%;
+ list-style: none;
+ margin: 0;
+ padding: 0 4px 0 0;
+}
+li.tag-item:last-child {
+ padding-bottom: 17px;
+}
+a.tag-link {
+ overflow: hidden;
+ white-space: nowrap;
+}
+li.tag-item a.tag-link {
+}
+td.board-tags a.tag-link {
+ display: inline-block;
+ margin: 0 0.4em 0 0;
+}
+
+@media screen and (max-width: 1100px) {
+ aside.search-container {
+ width: 100%;
+ margin-bottom: 12px;
+ }
+ aside.search-container .box {
+ margin-right: 0;
+ }
+
+ section.board-list {
+ margin-top: 12px;
+ width: 100%;
+ }
+
+ table.board-list-table .board-meta,
+ table.board-list-table .board-pph,
+ table.board-list-table .board-tags {
+ padding: 0;
+ margin: 0;
+ font-size: 0;
+ width: 0;
+ }
+}
+
+#post-moderation-fields {
+ display: block;
+}
+
+.announcement {
+ font-size: 75%;
+ padding-bottom: 1%;
+ margin-left: 5%;
+ margin-right: 5%;
+}
+
+/* Gallery view */
+#gallery_images {
+ position: absolute;
+ right: 0px;
+ bottom: 0px;
+ top: 0px;
+ width: 12%;
+ background-color: rgba(0, 0, 0, 0.4);
+ overflow: auto;
+}
+#gallery_toolbar {
+ position: absolute;
+ right: 12%;
+ left: 0px;
+ bottom: 0px;
+ height: 32px;
+ background-color: rgba(0, 0, 0, 0.4);
+ text-align: right;
+}
+#gallery_images img {
+ width: 100%;
+}
+#gallery_toolbar a {
+ font-size: 28px;
+ padding-right: 5px;
+}
+#gallery_main {
+ position: absolute;
+ left: 0px;
+ right: 12%;
+ bottom: 32px;
+ top: 0px;
+ padding: 10px;
+}
+
+#gallery_images img {
+ opacity: 0.6;
+ -webkit-transition: all 0.5s;
+ transition: all 0.5s;
+}
+#gallery_images img:hover, #gallery_images img.active {
+ opacity: 1;
+}
+#gallery_images img.active {
+ -webkit-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+ -moz-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+ box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+ z-index: 1;
+}
+#gallery_main img, #gallery_main video {
+ max-width: 100%;
+ max-height: 100%;
+ position: absolute;
+}
+
+/* Fileboard */
+table.fileboard th, table.fileboard td {
+ padding: 2px;
+ text-align: center;
+}
+table.fileboard .intro a {
+ margin-left: 0px;
+}
+
+/* Rules Popup */
+#rules-popup {
+ width: 80%;
+ height: 80%;
+ position: fixed;
+ z-index: 9999;
+ left: 50%;
+ margin-left: -40%;
+ top: 50%;
+ margin-top: -40vh;
+ background: #000000;
+ text-align: center;
+ font-family: sans-serif;
+ font-size: 14px;
+ color: #FFFFFF;
+}
+#rules-popup .rules-popup-top {
+ font-size: 40px;
+ line-height: 60px;
+ position: absolute;
+ top: 0px;
+ height: 60px;
+ width: 100%;
+}
+#rules-popup .rules-popup-content-wrapper {
+ text-align: left;
+ position: absolute;
+ bottom: 80px;
+ top: 60px;
+ width: 100%;
+ overflow: auto;
+}
+#rules-popup #rules-popup-content {
+ padding: 10px;
+ font-size: 12px;
+}
+#rules-popup .rules-popup-bottom {
+ bottom: 0px;
+ height: 80px;
+ width: 100%;
+ position: absolute;
+}
+#rules-popup .rules-popup-bottom-instructions {
+ line-height: 40px;
+}
+#rules-popup .rules-popup-captcha-wrapper {
+ height: 40px;
+}
+#rules-popup .rules-popup-captcha {
+ display: inline-block;
+ border: 1px solid white;
+ font-family: serif;
+ padding: 3px;
+}
+#rules-popup .rules-popup-form {
+ display: inline-block;
+}
+#rules-popup .rules-popup-form-input {
+ width: 100px;
+}
+
+/* dropdown for boardlist. */
+.dropdown {
+ position: relative;
+ display: inline-block;
+}
+
+/* Alter details as needed, I'm not a designer. */
+.dropdown-content {
+ display: none;
+ position: absolute;
+ background-color: #666666;
+ min-width: 130px;
+ padding: 2px 6px;
+ color: #DCA1F5;
+}
+
+.dropdown:hover .dropdown-content {
+ display: block;
+ }
+
+.own_post {
+ font-style: italic;
+ font-weight: normal;
+ opacity: .666;
+}
+div.mix {
+ display: inline-block;
+}
+
+footer {
+ margin-bottom: 50px;
+}
+
+span.underline {
+ text-decoration: underline;
+}
+
+span.strikethrough {
+ text-decoration: line-through;
+}
+
+span.orangeQuote {
+ color: #FF8C00;
+}
+
+.options_general_tab--select_opt {
+ height: 2.5em;
+}
+
+.options_general_tab--select_opt span {
+ line-height: 2.5em;
+}
+
+.options_general_tab--select_opt select {
+ float: none;
+}