diff --git a/routes/home.js b/routes/home.js index 66c9d72..6acc1ea 100644 --- a/routes/home.js +++ b/routes/home.js @@ -5,8 +5,22 @@ const homeRoute = require('express').Router(); const processJsonSubreddit = require('../inc/processJsonSubreddit.js'); const tedditApiSubreddit = require('../inc/teddit_api/handleSubreddit.js')(); const processMoreComments = require('../inc/processMoreComments.js')(); +const frontpagePath = config.clean_homepage ? '/frontpage' : ''; -homeRoute.get('/:sort?', async (req, res, next) => { +if (config.clean_homepage) { + homeRoute.get('/', (req, res, next) => { + if (req.cookies.clean_homepage && req.cookies.clean_homepage == 'true') { + return res.redirect('/frontpage'); + } + + res.render('homepage', { + user_preferences: req.cookies, + internal_config: config, + }); + }); +} + +homeRoute.get(`${frontpagePath}/:sort?`, async (req, res, next) => { let past = req.query.t; let before = req.query.before; let after = req.query.after; diff --git a/static/css/styles.css b/static/css/styles.css index ac0f412..9ed4593 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -1580,6 +1580,68 @@ code { padding:4px; margin:5px 0 } + +/* HOMEPAGE SECTION */ +body.homepage.clean { + margin: 0; + width: 100vw; + height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +body.homepage.clean main { + flex-grow: 1; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +body.homepage.clean h1 { + margin-bottom: 1rem; + font-size: 3rem; + text-align: center; + width: 100%; +} + +body.homepage.clean form { + width: 100vw; + max-width: 750px; + text-align: center; +} + +body.homepage.clean input[name="q"] { + width: 90%; + padding: 0.4rem; + border: none; + color: white; + background: #555; + margin-bottom: 1rem; +} + +body.homepage.clean .sublinks { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; + max-width: 650px; +} + +body.homepage.clean .sublinks a { + color: gray; + margin-right: 0.3rem; +} + +@media only screen and (max-width: 768px) { + body.homepage.clean form, body.homepage.clean .sublinks { + width: 90%; + max-width: unset; + } +} + /* Fix spoiler texts not showing without JS */ .md .md-spoiler-text:not(.revealed):active,.md .md-spoiler-text:not(.revealed):focus,.md .md-spoiler-text:not(.revealed):hover { color: black; diff --git a/views/homepage.pug b/views/homepage.pug new file mode 100644 index 0000000..6b573d9 --- /dev/null +++ b/views/homepage.pug @@ -0,0 +1,77 @@ +doctype html +html + head + title teddit + meta(property='og:title', content='home : teddit') + include includes/meta_default.pug + include includes/meta_description.pug + include includes/head.pug + body(class="" + (user_preferences.theme === 'auto' ? 'dark' : user_preferences.theme) + " homepage clean") + main + h1 teddit + form(action="/search" method="GET") + input(type="text" name="q") + input(type="hidden" name="restrict_sr" value="on") + input(type="hidden" name="nsfw" value="on") + input(type="hidden" name="sort" value="relevance") + input(type="hidden" name="t" value="all") + .sublinks + if user_preferences.subbed_subreddits && Array.isArray(user_preferences.subbed_subreddits) + a(href="/r/popular") Popular + a(href="/r/all") All + a(href="/saved") Saved + each subreddit in user_preferences.subbed_subreddits + a(href="/r/" + subreddit) #{subreddit} + else + a(href="/r/popular") Popular + a(href="/r/all") All + a(href="/saved") Saved + a(href="/r/AskReddit") AskReddit + a(href="/r/pics") pics + a(href="/r/news") news + a(href="/r/worldnews") worldnews + a(href="/r/funny") funny + a(href="/r/tifu") tifu + a(href="/r/videos") videos + a(href="/r/gaming") gaming + a(href="/r/aww") aww + a(href="/r/todayilearned") todayilearned + a(href="/r/gifs") gifs + a(href="/r/Art") Art + a(href="/r/explainlikeimfive") explainlikeimfive + a(href="/r/movies") movies + a(href="/r/Jokes") Jokes + a(href="/r/TwoXChromosomes") TwoXChromosomes + a(href="/r/mildlyinteresting") mildlyinteresting + a(href="/r/LifeProTips") LifeProTips + a(href="/r/askscience") askscience + a(href="/r/IAmA") IAmA + a(href="/r/dataisbeautiful") dataisbeautiful + a(href="/r/books") books + a(href="/r/science") science + a(href="/r/Showerthoughts") Showerthoughts + a(href="/r/gadgets") gadgets + a(href="/r/Futurology") Futurology + a(href="/r/nottheonion") nottheonion + a(href="/r/history") history + a(href="/r/sports") sports + a(href="/r/OldSchoolCool") OldSchoolCool + a(href="/r/GetMotivated") GetMotivated + a(href="/r/DIY") DIY + a(href="/r/photoshopbattles") photoshopbattles + a(href="/r/nosleep") nosleep + a(href="/r/Music") Music + a(href="/r/space") space + a(href="/r/food") food + a(href="/r/UpliftingNews") UpliftingNews + a(href="/r/EarthPorn") EarthPorn + a(href="/r/Documentaries") Documentaries + a(href="/r/InternetIsBeautiful") InternetIsBeautiful + a(href="/r/WritingPrompts") WritingPrompts + a(href="/r/creepy") creepy + a(href="/r/philosophy") philosophy + a(href="/r/announcements") announcements + a(href="/r/listentothis") listentothis + a(href="/r/blog") blog + include includes/footer.pug + \ No newline at end of file