@@ -1,6 +1,6 @@ | |||
The MIT License (MIT) | |||
Copyright (c) 2016 Gil Mizrahi | |||
Copyright (c) 2018 Gil Mizrahi | |||
Permission is hereby granted, free of charge, to any person obtaining a copy | |||
of this software and associated documentation files (the "Software"), to deal | |||
@@ -1,11 +1,8 @@ | |||
route: about | |||
title: About | |||
route: home | |||
title: Home | |||
--- | |||
Hablog | |||
====== | |||
A simple static blog platform with tags. Made with Haskell and Scotty. | |||
Hablog will read posts written in Markdown from the `_posts` folder. | |||
@@ -53,8 +50,13 @@ tags: <tags for the post, separated, by, commas> | |||
```markdown | |||
title: <the title of the page> | |||
route: <the route of the page> | |||
--- | |||
<The rest of the post in Markdown format> | |||
``` | |||
## Home page | |||
The front page will either be `Home` or, if that isn't available, the blog page will be the front page. |
@@ -5,14 +5,14 @@ Description: blog system with tags | |||
License: MIT | |||
license-file: LICENSE | |||
Author: Gil Mizrahi | |||
Maintainer: soupiral@gmail.com | |||
Maintainer: gilmi@posteo.net | |||
Stability: Experimental | |||
Category: Web | |||
Build-type: Simple | |||
Cabal-version: >=1.10 | |||
tested-with: GHC==8.0.2 | |||
tested-with: GHC==8.2.2 | |||
extra-source-files: | |||
README.md | |||
@@ -14,23 +14,24 @@ import Web.Hablog.Config | |||
import qualified Web.Hablog.Post as Post | |||
import qualified Web.Hablog.Page as Page | |||
template :: Config -> Bool -> T.Text -> H.Html -> H.Html | |||
template cfg highlight title container = | |||
template :: Config -> Bool -> T.Text -> String -> H.Html -> H.Html | |||
template cfg highlight title pageRoute container = | |||
H.docTypeHtml $ do | |||
H.head $ do | |||
H.title (H.toHtml (T.concat [blogTitle cfg, " - ", title])) | |||
H.meta ! A.content "width=650" ! A.name "viewport" | |||
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href (H.stringValue . bgTheme $ blogTheme cfg) | |||
if highlight | |||
then H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href (H.stringValue . codeTheme $ blogTheme cfg) | |||
else mempty | |||
H.body $ do | |||
H.div ! A.class_ "container" $ do | |||
logo cfg | |||
logo cfg pageRoute | |||
H.div ! A.class_ "maincontainer" $ container | |||
footer | |||
if highlight | |||
then do | |||
H.script ! A.src "static/highlight/highlight.pack.js" $ "" | |||
H.script ! A.src "/static/highlight/highlight.pack.js" $ "" | |||
H.script "hljs.initHighlightingOnLoad();" | |||
else | |||
mempty | |||
@@ -40,22 +41,24 @@ mainTemplate = H.article ! A.class_ "content" | |||
notFoundPage :: Config -> H.Html | |||
notFoundPage cfg = | |||
template cfg False "Not Found" $ mainTemplate $ do | |||
template cfg False "Not Found" "notfound" $ mainTemplate $ do | |||
H.h1 "Not found" | |||
H.p "The page you search for is not available." | |||
logo :: Config -> H.Html | |||
logo cfg = H.header ! A.class_ "logo" $ H.h1 $ H.a ! A.href "/" $ H.toHtml (blogTitle cfg) | |||
logo :: Config -> String -> H.Html | |||
logo cfg pageRoute = H.header ! A.class_ "logo" $ H.h1 $ do | |||
H.a ! A.href (H.stringValue $ "/" ++ pageRoute) $ H.toHtml (blogTitle cfg) | |||
"/" >> H.toHtml pageRoute | |||
footer :: H.Html | |||
footer = H.footer ! A.class_ "footer" $ do | |||
H.div $ H.a ! A.href "/rss" $ "RSS feed" | |||
H.div $ H.a ! A.href "/blog/rss" $ "RSS feed" | |||
H.span "Powered by " | |||
H.a ! A.href "https://github.com/soupi/hablog" $ "Hablog" | |||
errorPage :: Config -> T.Text -> String -> H.Html | |||
errorPage cfg ttl msg = | |||
template cfg False ttl $ do | |||
template cfg False ttl "" $ do | |||
H.h2 "Something Went Wrong..." | |||
H.p $ H.toHtml msg | |||
@@ -76,13 +79,13 @@ postsListItem :: Post.Post -> H.Html | |||
postsListItem post = H.li $ do | |||
H.span ! A.class_ "postDate" $ H.toHtml $ Post.getDate post | |||
H.span ! A.class_ "seperator" $ " - " | |||
H.a ! A.href (fromString $ T.unpack ("/" `T.append` Post.getPath post)) $ H.toHtml $ Post.title post | |||
H.a ! A.href (fromString $ T.unpack ("/blog/" `T.append` Post.getPath post)) $ H.toHtml $ Post.title post | |||
postPage :: Config -> Post.Post -> H.Html | |||
postPage cfg post = template cfg True (Post.title post) $ | |||
postPage cfg post = template cfg True (Post.title post) "blog" $ | |||
H.article ! A.class_ "post" $ do | |||
H.div ! A.class_ "postTitle" $ do | |||
H.a ! A.href (fromString $ T.unpack ("/" `T.append` Post.getPath post)) $ H.h2 ! A.class_ "postHeader" $ H.toHtml (Post.title post) | |||
H.a ! A.href (fromString $ T.unpack ("/blog/" `T.append` Post.getPath post)) $ H.h2 ! A.class_ "postHeader" $ H.toHtml (Post.title post) | |||
H.span ! A.class_ "postSubTitle" $ do | |||
H.span ! A.class_ "postAuthor" $ H.toHtml $ authorsList $ Post.authors post | |||
H.span ! A.class_ "seperator" $ " - " | |||
@@ -92,30 +95,33 @@ postPage cfg post = template cfg True (Post.title post) $ | |||
H.div ! A.class_ "postContent" $ Post.content post | |||
pagePage :: Config -> Page.Page -> H.Html | |||
pagePage cfg page = template cfg True (Page.getPageName page) $ | |||
H.article ! A.class_ "post" $ do | |||
H.div ! A.class_ "postTitle" $ | |||
H.a ! A.href (fromString (Page.getPageURL page)) $ H.h2 ! A.class_ "postHeader" $ H.toHtml (Page.getPageName page) | |||
H.div ! A.class_ "postContent" $ Page.getPageContent page | |||
pagePage cfg page = template cfg True (Page.getPageName page) (Page.getPageURL page) $ pageContent page | |||
pageContent :: Page.Page -> H.Html | |||
pageContent page = do | |||
H.article ! A.class_ "post" $ do | |||
H.div ! A.class_ "postContent" $ Page.getPageContent page | |||
pagesList :: [Page.Page] -> H.Html | |||
pagesList = H.ul . mconcat . fmap pagesListItem . sort | |||
pagesList = mconcat . fmap pagesListItem . sort | |||
pagesListItem :: Page.Page -> H.Html | |||
pagesListItem page = H.li $ H.a ! A.href (fromString ("/page/" ++ Page.getPageURL page)) $ H.toHtml (Page.getPageName page) | |||
pagesListItem page = | |||
H.li | |||
$ H.a ! A.href (fromString ("/" ++ Page.getPageURL page)) | |||
$ H.toHtml (Page.getPageName page) | |||
tagsList :: [T.Text] -> H.Html | |||
tagsList = H.ul . mconcat . fmap tagsListItem . sort | |||
tagsListItem :: T.Text -> H.Html | |||
tagsListItem tag = H.li $ H.a ! A.href (fromString $ T.unpack ("/tags/" `T.append` tag)) $ H.toHtml tag | |||
tagsListItem tag = H.li $ H.a ! A.href (fromString $ T.unpack ("/blog/tags/" `T.append` tag)) $ H.toHtml tag | |||
authorsList :: [T.Text] -> H.Html | |||
authorsList = H.ul . mconcat . fmap authorsListItem . sort | |||
authorsListItem :: T.Text -> H.Html | |||
authorsListItem author = H.li $ H.a ! A.href (fromString $ T.unpack ("/authors/" `T.append` author)) $ H.toHtml author | |||
authorsListItem author = H.li $ H.a ! A.href (fromString $ T.unpack ("/blog/authors/" `T.append` author)) $ H.toHtml author | |||
@@ -28,23 +28,44 @@ import qualified Web.Hablog.Post as Post | |||
import qualified Web.Hablog.Page as Page | |||
import Network.URI (URI) | |||
presentMain :: HablogAction () | |||
presentMain = do | |||
presentHome :: HablogAction () | |||
presentHome = do | |||
allPages <- liftIO getAllPages | |||
cfg <- getCfg | |||
case L.find (\p -> Page.getPageURL p == "home") allPages of | |||
Nothing -> presentBlog | |||
Just homePage -> do | |||
html $ HR.renderHtml $ template cfg False "home" "home" $ do | |||
H.nav ! A.class_ "menu" $ do | |||
H.ul ! A.class_ "pages" $ do | |||
pagesList allPages | |||
H.li $ H.a ! A.href "/blog" $ "Blog" | |||
H.div ! A.class_ "content" $ do | |||
pageContent homePage | |||
presentBlog :: HablogAction () | |||
presentBlog = do | |||
allPosts <- liftIO getAllPosts | |||
allPages <- liftIO getAllPages | |||
tgs <- liftIO getTagList | |||
auths <- liftIO getAuthorsList | |||
cfg <- getCfg | |||
html $ HR.renderHtml $ template cfg False "Posts" $ do | |||
H.aside ! A.class_ "aside" $ do | |||
presentPagesList allPages | |||
H.div ! A.class_ "AllAuthorsList" $ do | |||
H.h1 "Authors" | |||
auths | |||
H.div ! A.class_ "AllTagsList" $ do | |||
H.h1 "Tags" | |||
tgs | |||
postsListHtml allPosts | |||
html $ HR.renderHtml $ template cfg False "Blog" "blog" $ do | |||
H.nav ! A.class_ "menu" $ do | |||
H.ul ! A.class_ "pages" $ do | |||
pagesList allPages | |||
H.li $ H.a ! A.href "/blog" $ "Blog" | |||
H.div ! A.class_ "main-content" $ do | |||
postsListHtml allPosts | |||
H.aside ! A.class_ "aside" $ do | |||
H.div ! A.class_ "AllAuthorsList" $ do | |||
H.h1 "Authors" | |||
auths | |||
H.div ! A.class_ "AllTagsList" $ do | |||
H.h1 "Tags" | |||
tgs | |||
presentRSS :: URI -> HablogAction () | |||
presentRSS domain = do | |||
@@ -64,20 +85,25 @@ showPostsWhere :: (Post.Post -> Bool) -> HablogAction () | |||
showPostsWhere test = do | |||
cfg <- getCfg | |||
allPosts <- liftIO getAllPosts | |||
html $ HR.renderHtml $ template cfg False "Posts" $ | |||
html $ HR.renderHtml $ template cfg False "Posts" "blog" $ | |||
postsListHtml $ filter test allPosts | |||
presentPagesList :: [Page.Page] -> H.Html | |||
presentPagesList [] = pure () | |||
presentPagesList pages = | |||
H.div ! A.class_ "AllAuthorsList" $ do | |||
H.h1 "Pages" | |||
getPageList pages | |||
presentPage :: T.Text -> HablogAction () | |||
presentPage route = do | |||
pages <- liftIO getAllPages | |||
showOrNotFound (presentPage' pages) . filter (((==) $ T.unpack $ T.toLower route) . Page.getPageURL) $ pages | |||
presentPage' :: [Page.Page] -> Config -> Page.Page -> H.Html | |||
presentPage' pages cfg page = do | |||
template cfg False (Page.getPageName page) (Page.getPageURL page) $ do | |||
H.nav ! A.class_ "menu" $ do | |||
H.ul ! A.class_ "pages" $ do | |||
pagesList pages | |||
H.li $ H.a ! A.href "/blog" $ "Blog" | |||
H.div ! A.class_ "content" $ do | |||
pageContent page | |||
presentPage :: T.Text -> HablogAction () | |||
presentPage title = | |||
showOrNotFound pagePage . filter ((== T.unpack title) . Page.getPageURL) =<< liftIO getAllPages | |||
getAllPages :: IO [Page.Page] | |||
getAllPages = getAllFromDir Page.toPage "_pages" | |||
@@ -108,13 +134,13 @@ presentTags :: HablogAction () | |||
presentTags = do | |||
cfg <- getCfg | |||
tags <- liftIO getTagList | |||
html . HR.renderHtml $ template cfg False "Posts Tags" tags | |||
html . HR.renderHtml $ template cfg False "Posts Tags" "blog" tags | |||
getTagList :: IO H.Html | |||
getTagList = pure . tagsList . getAllTags =<< getAllPosts | |||
getPageList :: [Page.Page] -> H.Html | |||
getPageList = pagesList | |||
getPageList = H.ul . pagesList | |||
getAuthorsList :: IO H.Html | |||
@@ -124,19 +150,19 @@ presentTag :: T.Text -> HablogAction () | |||
presentTag tag = do | |||
cfg <- getCfg | |||
posts <- liftIO getAllPosts | |||
html . HR.renderHtml . template cfg False tag $ postsListHtml $ filter (hasTag tag) posts | |||
html . HR.renderHtml . template cfg False tag "blog" $ postsListHtml $ filter (hasTag tag) posts | |||
presentAuthors :: HablogAction () | |||
presentAuthors = do | |||
cfg <- getCfg | |||
authors <- liftIO getAuthorsList | |||
html . HR.renderHtml $ template cfg False "Posts Authors" authors | |||
html . HR.renderHtml $ template cfg False "Posts Authors" "blog" authors | |||
presentAuthor :: T.Text -> HablogAction () | |||
presentAuthor auth = do | |||
cfg <- getCfg | |||
posts <- liftIO getAllPosts | |||
html . HR.renderHtml . template cfg False auth . postsListHtml $ filter (hasAuthor auth) posts | |||
html . HR.renderHtml . template cfg False auth "blog" . postsListHtml $ filter (hasAuthor auth) posts | |||
getPageFromFile :: T.Text -> IO (Maybe Page.Page) | |||
getPageFromFile title = do | |||
@@ -47,13 +47,10 @@ runTLS tlsCfg cfg = | |||
-- | Hablog's router | |||
router :: Maybe URI -> Hablog () | |||
router domain = do | |||
get "/" presentMain | |||
when (isJust domain) | |||
$ get "/rss" (presentRSS $ fromJust domain) | |||
get "/post/:yyyy/:mm/:dd/:title" $ do | |||
(yyyy, mm, dd) <- getDate | |||
title <- param "title" | |||
presentPost (mconcat [yyyy,"/",mm,"/",dd, "/", title]) | |||
get "/" presentHome | |||
get "/blog" presentBlog | |||
get (regex "/static/(.*)") $ do | |||
path <- fmap (drop 1 . T.unpack) (param "0") | |||
if hasdots path then | |||
@@ -62,39 +59,100 @@ router domain = do | |||
let mime = Mime.defaultMimeLookup (T.pack path) | |||
setHeader "content-type" $ TL.fromStrict (T.decodeUtf8 mime) | |||
file path | |||
get "/post/:yyyy/:mm/:dd" $ do | |||
route domain | |||
get "/:page" $ do | |||
page <- param "page" | |||
presentPage (TL.toLower page) | |||
notFound $ do | |||
cfg <- getCfg | |||
html $ HR.renderHtml $ errorPage cfg (blogTitle cfg `TL.append` " - 404: not found") "404 - Could not find the page you were looking for." | |||
where | |||
hasdots [] = False | |||
hasdots ('.':'.':_) = True | |||
hasdots (_:rest) = hasdots rest | |||
route :: Maybe URI -> Hablog () | |||
route domain = do | |||
when (isJust domain) | |||
$ get "/blog/rss" (presentRSS $ fromJust domain) | |||
get "/blog/post/:yyyy/:mm/:dd/:title" $ do | |||
(yyyy, mm, dd) <- getDate | |||
title <- param "title" | |||
presentPost (mconcat [yyyy,"/",mm,"/",dd, "/", title]) | |||
get "/blog/post/:yyyy/:mm/:dd" $ do | |||
(yyyy, mm, dd) <- getDate | |||
showPostsWhere (eqDate (yyyy, mm, dd)) | |||
get "/post/:yyyy/:mm" $ do | |||
get "/blog/post/:yyyy/:mm" $ do | |||
yyyy <- param "yyyy" | |||
mm <- param "mm" | |||
showPostsWhere (eqYM (yyyy, mm)) | |||
get "/post/:yyyy" $ do | |||
get "/blog/post/:yyyy" $ do | |||
yyyy <- param "yyyy" | |||
showPostsWhere (eqY yyyy) | |||
get "/tags" | |||
get "/blog/tags" | |||
presentTags | |||
get "/tags/:tag" $ do | |||
get "/blog/tags/:tag" $ do | |||
tag <- param "tag" | |||
presentTag tag | |||
get "/authors" | |||
get "/blog/authors" | |||
presentAuthors | |||
get "/authors/:author" $ do | |||
get "/blog/authors/:author" $ do | |||
author <- param "author" | |||
presentAuthor author | |||
get "/page/:page" $ do | |||
page <- param "page" | |||
presentPage page | |||
notFound $ do | |||
cfg <- getCfg | |||
html $ HR.renderHtml $ errorPage cfg (blogTitle cfg `TL.append` " - 404: not found") "404 - Could not find the page you were looking for." | |||
-- redirects | |||
when (isJust domain) | |||
$ get "/rss" $ do | |||
redirect "/blog/rss" | |||
get "/post/:yyyy/:mm/:dd/:title" $ do | |||
(yyyy, mm, dd) <- getDate | |||
title <- param "title" | |||
redirect $ mconcat ["/blog/post/", yyyy, "/", mm, "/", dd, "/", title] | |||
get "/post/:yyyy/:mm/:dd" $ do | |||
(yyyy, mm, dd) <- getDate | |||
redirect $ mconcat ["/blog/post/", yyyy, "/", mm, "/", dd] | |||
get "/post/:yyyy/:mm" $ do | |||
yyyy <- param "yyyy" | |||
mm <- param "mm" | |||
redirect $ mconcat ["/blog/post/", yyyy, "/", mm] | |||
get "/post/:yyyy" $ do | |||
yyyy <- param "yyyy" | |||
redirect $ mconcat ["/blog/post/", yyyy] | |||
get "/tags" $ do | |||
redirect "/blog/tags" | |||
get "/tags/:tag" $ do | |||
tag <- param "tag" | |||
redirect $ mconcat ["/blog/tags/", tag] | |||
get "/authors" $ do | |||
redirect "/blog/authors" | |||
get "/authors/:author" $ do | |||
author <- param "author" | |||
redirect $ mconcat ["/blog/authors/", author] | |||
where | |||
getDate = (,,) | |||
<$> param "yyyy" | |||
<*> param "mm" | |||
<*> param "dd" | |||
hasdots [] = False | |||
hasdots ('.':'.':_) = True | |||
hasdots (_:rest) = hasdots rest |
@@ -1,12 +1,12 @@ | |||
resolver: lts-9.0 | |||
resolver: lts-10.4 | |||
packages: | |||
- '.' | |||
extra-deps: | |||
- scotty-tls-0.4.1 | |||
- rss-3000.2.0.6 | |||
- HaXml-1.25.3 | |||
- scotty-tls-0.4.1 | |||
- time-1.6.0.1 | |||
flags: {} | |||
@@ -302,3 +302,30 @@ code { | |||
padding-left: 2px; | |||
padding-right: 2px; | |||
} | |||
nav { | |||
margin: auto; | |||
width: 300px; | |||
} | |||
nav li:after { | |||
margin-left: 1rem; | |||
margin-right: 1rem; | |||
content: "|"; | |||
color: #666; | |||
} | |||
nav li:last-child:after { | |||
margin-left: 0rem; | |||
content: ""; | |||
} | |||
nav li { | |||
display: inline-block; | |||
font-size: 1.3rem; | |||
} | |||
.pageHeader { | |||
margin-left: 70px; | |||
margin-bottom: 30px; | |||
} |
@@ -4,16 +4,17 @@ | |||
html, body { height:98%; } | |||
body { | |||
line-height: 1.4; | |||
background: repeat-x fixed 0% 0% #eee; | |||
overflow-y:scroll; | |||
/* font-family: 'Open Sans', Helvetica, tahoma, arial, sans-serif; */ | |||
font-family: 'Roboto', helvetica, arial, sans-serif; | |||
line-height: 1.4; | |||
background: repeat-x fixed 0% 0% #eee; | |||
overflow-y:scroll; | |||
/* font-family: 'Open Sans', Helvetica, tahoma, arial, sans-serif; */ | |||
font-family: 'Roboto', helvetica, arial, sans-serif; | |||
font-weight: 400; | |||
font-size: 1.2rem; | |||
} | |||
.logo a, .logo h1 { | |||
margin-left: 20px; | |||
font-size: 36px; | |||
font-size: 2rem; | |||
margin-bottom: 0px; | |||
font-weight: 300; | |||
} | |||
@@ -26,7 +27,7 @@ h2 { | |||
h3, h4, h5, input, .nav a | |||
{ | |||
font-family: 'Roboto', helvetica, arial, sans-serif; | |||
font-family: 'Roboto', helvetica, arial, sans-serif; | |||
font-weight: 300; | |||
} | |||
a { | |||
@@ -35,89 +36,77 @@ a { | |||
input | |||
{ | |||
color: black; | |||
margin-bottom: 12px; | |||
font-size: 14px; | |||
margin-bottom: 0.8rem; | |||
font-size: 1rem; | |||
} | |||
.container { | |||
max-width: 980px; | |||
max-width: 1200px; | |||
min-width: 500px; | |||
margin: auto; | |||
margin-top: 0px; | |||
margin-bottom: 0px; | |||
clear: both; | |||
height: 97%; | |||
} | |||
.maincontainer | |||
{ | |||
max-width: 980px; | |||
max-width: 1200px; | |||
min-width: 500px; | |||
background: #fff; | |||
background: #fff; | |||
border: 1px solid #bbb; | |||
margin: 15px auto; | |||
padding: 20px; | |||
overflow:hidden; | |||
margin-bottom:10px; | |||
margin: 1rem auto; | |||
padding: 1.2rem; | |||
margin-bottom:0.7rem; | |||
color: #444; | |||
min-height: 450px; | |||
min-height: 400px; | |||
} | |||
.header { | |||
color: #555; | |||
margin: auto; | |||
margin-bottom: 10px; | |||
padding: 10px; | |||
color: #555; | |||
margin: auto; | |||
margin-bottom: 0.7rem; | |||
padding: 0.7rem; | |||
} | |||
.logo { | |||
text-decoration: none; | |||
margin-top: 10px; | |||
margin-bottom: 10px; | |||
} | |||
.nav { width: 430px; margin: auto; text-align: center; } | |||
.nav li | |||
{ | |||
font-size: 14px; | |||
display: inline-block; | |||
margin: 5px; | |||
color: #555; | |||
margin-top: 0.7rem; | |||
margin-bottom: 0.7rem; | |||
} | |||
ul { list-style: none; } | |||
.postContent ul { | |||
list-style-type: disc; | |||
margin-left: 20px; | |||
margin-left: 1.5rem; | |||
} | |||
.nav a | |||
{ | |||
font-size:20px; | |||
font-size:1.5rem; | |||
} | |||
a:visited { | |||
color: #0b85ef; | |||
color: #0b85ef; | |||
} | |||
a { | |||
color: #0b85ef; | |||
text-decoration: none; | |||
font-weight: normal; | |||
color: #0b85ef; | |||
text-decoration: none; | |||
font-weight: normal; | |||
-webkit-transition: all 0.3s ease; | |||
-moz-transition: all 0.3s ease; | |||
-o-transition: all 0.3s ease; | |||
-ms-transition: all 0.3s ease; | |||
transition: all 0.3s ease; | |||
-webkit-transition: all 0.3s ease; | |||
-moz-transition: all 0.3s ease; | |||
-o-transition: all 0.3s ease; | |||
-ms-transition: all 0.3s ease; | |||
transition: all 0.3s ease; | |||
} | |||
.current a { | |||
color: black; | |||
} | |||
a:hover { | |||
color: black; | |||
color: black; | |||
} | |||
.rounded-corners, .sidebar, .header, .container, .maincontainer, .content article { | |||
@@ -127,137 +116,74 @@ a:hover { | |||
} | |||
.content { | |||
padding-right: 30px; | |||
padding-left: 10px; | |||
padding-top: 20px; | |||
overflow: hidden; | |||
padding-right: 0.7rem; | |||
padding-left: 0.7rem; | |||
padding-top: 1.5rem; | |||
} | |||
.content p { | |||
text-align: justify; | |||
margin-top: 0px; | |||
margin-left: 10px; | |||
text-align: justify; | |||
margin-top: 0px; | |||
margin-left: 0.7rem; | |||
} | |||
label { | |||
margin-bottom: 2px; | |||
} | |||
.formdiv label | |||
{ | |||
display: block; | |||
width: 200px; | |||
margin-bottom: 5px; | |||
font-size: 18px; | |||
/* text-align: right; */ | |||
} | |||
.formdiv input[type='text'] | |||
{ | |||
width: 90%; | |||
margin-right: 5px; | |||
} | |||
.formdiv | |||
{ | |||
margin-bottom: 30px; | |||
} | |||
.addformdiv label | |||
{ | |||
display:block; | |||
width: 200px; | |||
margin-bottom: 5px; | |||
font-size: 18px; | |||
} | |||
.addformdiv input[type='text'], input[type="url"] | |||
{ | |||
width: 50%; | |||
} | |||
.addformdiv | |||
{ | |||
margin-bottom: 30px; | |||
} | |||
hr { | |||
border-color: #FFF; | |||
} | |||
table { | |||
border: 1px solid #666; | |||
text-align: center; | |||
} | |||
#animelist li { | |||
display: inline-block; | |||
margin-right: 15px; | |||
} | |||
#animelist img { | |||
width: 200px; | |||
height: 200px; | |||
} | |||
#bgimg | |||
{ | |||
float: right; | |||
z-index: -1; | |||
} | |||
.post { margin: 20px; } | |||
.Authornm { color: #79BAF2; } | |||
.postAuthor | |||
{ | |||
} | |||
.postTitle ul, .postTitle li { padding: 0; display: inline; } | |||
.postAuthor img | |||
{ | |||
width: 50px; | |||
display: block; | |||
} | |||
.postSubTitle | |||
{ | |||
display: block; | |||
margin-bottom: 20px; | |||
margin-bottom: 1.5rem; | |||
} | |||
.postDate | |||
{ | |||
font-size: 14px; | |||
font-size: 1.2rem; | |||
color: #555; | |||
} | |||
.postTags li | |||
{ | |||
list-style-type: none; | |||
display: inline; | |||
font-size: 14px; | |||
margin-right: 8px; | |||
} | |||
.postContent | |||
{ | |||
margin-left: 70px; | |||
margin-right: 70px; | |||
font-size: 1.2rem; | |||
margin-right: 0.6rem; | |||
} | |||
.post | |||
{ | |||
padding-bottom: 20px; | |||
margin-bottom: 30px; | |||
padding-bottom: 60px; | |||
padding-bottom: 1.5rem; | |||
margin-bottom: 2rem; | |||
padding-bottom: 4rem; | |||
} | |||
.post:nth-last-child(2) { border-bottom: 0px; } | |||
.seperator { font-size: 16px; color: #888; } | |||
.aside { float:right; margin-right: 40px; } | |||
.PostsList { margin-left: 20px; } | |||
.main-content { display: flex; flex-wrap: wrap; } | |||
.aside { margin-right: 3rem; margin-left: 1rem; } | |||
.PostsList { min-width: 480px; margin-right: 1rem; margin-left: 1rem; flex: auto; } | |||
ul { padding-left: 0; } | |||
.postHeader | |||
{ | |||
color: #333; | |||
font-weight: 700; | |||
font-size: 28px; | |||
} | |||
.postContent h1 { font-size: 26px; } | |||
.postContent h2 { font-size: 24px; } | |||
.postContent h3 { font-size: 22px; } | |||
.postContent h4 { font-size: 20px; } | |||
.postContent h5 { font-size: 18px; } | |||
.postContent h6 { font-size: 16px; } | |||
font-size: 2rem; | |||
} | |||
.postContent h1 { font-size: 2.1rem; } | |||
.postContent h2 { font-size: 1.9rem; } | |||
.postContent h3 { font-size: 1.7rem; } | |||
.postContent h4 { font-size: 1.6rem; } | |||
.postContent h5 { font-size: 1.5rem; } | |||
.postContent h6 { font-size: 1.4rem; } | |||
.postContent h1, .postContent h2, .postContent h3, .postContent h4, .postContent h5, .postContent h6 | |||
{ | |||
@@ -268,10 +194,10 @@ ul { padding-left: 0; } | |||
{ | |||
font-family: 'Roboto', helvetica, arial, sans-serif; | |||
font-weight: initial; | |||
font-size: 17px; | |||
font-size: 1.3rem; | |||
} | |||
.postContent code { | |||
font-size: 16px; | |||
font-size: 1.1rem; | |||
} | |||
.postContent img | |||
@@ -282,11 +208,72 @@ ul { padding-left: 0; } | |||
.footer { | |||
color: #666; | |||
font-size: 14px; | |||
padding: 20px; | |||
font-size: 1.2rem; | |||
padding: 1.5rem; | |||
text-align: center; | |||
} | |||
code { | |||
background-color: #f8f8ff; | |||
padding: 2px; | |||
} | |||
nav { | |||
text-align: center; | |||
} | |||
nav li:first-child:after { | |||
content: "<$>"; | |||
} | |||
nav li:after { | |||
margin-left: 0.8rem; | |||
margin-right: 0.8rem; | |||
content: "<*>"; | |||
color: #abc; | |||
} | |||
nav li:last-child:after { | |||
margin-left: 0rem; | |||
content: ""; | |||
} | |||
nav li { | |||
display: inline-block; | |||
font-size: 1.3rem; | |||
} | |||
.pageHeader { | |||
margin-left: 70px; | |||
margin-bottom: 30px; | |||
} | |||
#contact-info p { | |||
text-align: center !important; | |||
} | |||
@media screen and (min-width: 901px) { | |||
body { | |||
max-width: 98%; | |||
min-width: 400px; | |||
} | |||
.container { | |||
max-width: 1200px; | |||
min-width: 500px; | |||
margin: auto; | |||
} | |||
.maincontainer { | |||
max-width: 1200px; | |||
min-width: 500px; | |||
} | |||
.postContent { | |||
margin: 0.5rem; | |||
} | |||
.postContent | |||
{ | |||
margin-left: 4rem; | |||
margin-right: 4rem; | |||
} | |||
.PostsList { margin-right: 1rem; margin-left: 3rem; } | |||
} |