feat: Adjust comment styling

This commit is contained in:
Daniel Kempkens 2023-08-14 13:07:38 +02:00
parent 18260122bb
commit 82e435ddd8
Signed by: daniel
SSH key fingerprint: SHA256:Ks/MyhQYcPRQiwMKLAKquWCdCPe3JXlb1WttgnAoSeM
10 changed files with 18502 additions and 160 deletions

View file

@ -138,6 +138,8 @@
BDFR_BROWSER_BASE_DIRECTORY = "/Volumes/MediaScraper/Reddit";
BDFR_BROWSER_REPO_USER = db-user;
BDFR_BROWSER_REPO_HOST = db-host;
RELEASE_DISTRIBUTION = "none";
RELEASE_COOKIE = "no_dist_anyway";
};
processes = {

View file

@ -7,12 +7,8 @@ defmodule BdfrBrowser.HTTP.Plug do
plug :dispatch
get "/" do
tpl_params = [
subreddits: Subreddit.names() |> Repo.all()
]
tpl_file = Application.app_dir(:bdfr_browser, "priv/templates/http/index.eex")
content = EEx.eval_file(tpl_file, tpl_params)
tpl_args = [subreddits: Subreddit.names() |> Repo.all()]
content = render_template("index", tpl_args)
conn
|> put_resp_header("content-type", "text/html; charset=utf-8")
@ -22,13 +18,12 @@ defmodule BdfrBrowser.HTTP.Plug do
get "/r/:subreddit" do
subreddit_record = Repo.get_by(Subreddit, name: subreddit)
tpl_params = [
tpl_args = [
subreddit: subreddit,
dates: subreddit_record |> Post.date_listing() |> Repo.all()
]
tpl_file = Application.app_dir(:bdfr_browser, "priv/templates/http/subreddit.eex")
content = EEx.eval_file(tpl_file, tpl_params)
content = render_template("subreddit", tpl_args)
conn
|> put_resp_header("content-type", "text/html; charset=utf-8")
@ -38,14 +33,13 @@ defmodule BdfrBrowser.HTTP.Plug do
get "/r/:subreddit/:date" do
subreddit_record = Repo.get_by(Subreddit, name: subreddit)
tpl_params = [
tpl_args = [
subreddit: subreddit,
date: date,
posts: subreddit_record |> Post.during_month(date) |> Repo.all()
]
tpl_file = Application.app_dir(:bdfr_browser, "priv/templates/http/subreddit_posts.eex")
content = EEx.eval_file(tpl_file, tpl_params)
content = render_template("subreddit_posts", tpl_args)
conn
|> put_resp_header("content-type", "text/html; charset=utf-8")
@ -55,7 +49,7 @@ defmodule BdfrBrowser.HTTP.Plug do
get "/r/:subreddit/:date/:id" do
post_record = Post |> Repo.get(id) |> Repo.preload(comments: :children)
tpl_params = [
tpl_args = [
subreddit: subreddit,
date: date,
post: post_record,
@ -63,14 +57,27 @@ defmodule BdfrBrowser.HTTP.Plug do
comment_template: Application.app_dir(:bdfr_browser, "priv/templates/http/_comment.eex")
]
tpl_file = Application.app_dir(:bdfr_browser, "priv/templates/http/post.eex")
content = EEx.eval_file(tpl_file, tpl_params)
content = render_template("post", tpl_args)
conn
|> put_resp_header("content-type", "text/html; charset=utf-8")
|> send_resp(200, content)
end
get "/static/*path" do
file_path = Application.app_dir(:bdfr_browser, Path.join("priv/static", path))
if File.exists?(file_path) do
{:ok, file} = File.read(file_path)
conn
|> put_resp_header("content-type", mime_from_ext(file_path))
|> send_resp(200, file)
else
send_resp(conn, 404, "Not Found")
end
end
get "/media/*path" do
base_directory = Application.fetch_env!(:bdfr_browser, :base_directory)
joined_path = Path.join(path)
@ -96,6 +103,12 @@ defmodule BdfrBrowser.HTTP.Plug do
# Helper
defp render_template(name, args) do
tpl_file = Application.app_dir(:bdfr_browser, "priv/templates/http/application.eex")
embedded_tpl = Application.app_dir(:bdfr_browser, "priv/templates/http/#{name}.eex")
EEx.eval_file(tpl_file, embedded_template: embedded_tpl, embedded_args: args)
end
defp post_media(post, args) do
base_directory = Application.fetch_env!(:bdfr_browser, :base_directory)
post_dir = Path.join([base_directory | Keyword.fetch!(args, :paths)])
@ -127,6 +140,8 @@ defmodule BdfrBrowser.HTTP.Plug do
".png" -> "image/png"
".gif" -> "image/gif"
".mp4" -> "video/mp4"
".js" -> "text/javascript"
".css" -> "text/css"
end
end
end

6314
priv/static/bootstrap.bundle.js vendored Normal file

File diff suppressed because it is too large Load diff

12063
priv/static/bootstrap.css vendored Normal file

File diff suppressed because it is too large Load diff

View file

@ -1,7 +1,7 @@
<div style="padding-left: <%= level * 5 %>px;">
<div style="padding-left: <%= level * 5 %>px; margin-bottom: 2px;">
<div class="card">
<div class="card-body">
<blockquote class="blockquote mb-0">
<div class="card-body" style="padding: 8px;">
<blockquote class="blockquote mb-0" style="font-size: 1rem;">
<%= if comment.author == "AutoModerator" do %>
<p><small>Hidden AutoModerator comment</small></p>
<% else %>
@ -15,7 +15,6 @@
</blockquote>
</div>
</div>
<br>
</div>
<%= for reply <- BdfrBrowser.Repo.preload(comment, :children).children do %>

View file

@ -0,0 +1,18 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>BDFR Browser</title>
<link href="/static/bootstrap.css" rel="stylesheet">
<script src="/static/bootstrap.bundle.js"></script>
</head>
<body>
<div class="container">
<%= EEx.eval_file(embedded_template, embedded_args) %>
</div>
</body>
</html>

View file

@ -1,26 +1,9 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<h2>Archived Subreddits</h2>
<title>BDFR Browser</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<h2>Archived Subreddits</h2>
<div class="row text-center">
<div class="row text-center">
<div class="d-grid gap-2 col-12 mx-auto">
<%= for subreddit <- subreddits do %>
<a class="btn btn-outline-secondary btn-lg" href="/r/<%= subreddit %>" role="button"><%= subreddit %></a>
<% end %>
</div>
</div>
</div>
</body>
</html>
</div>

View file

@ -1,28 +1,14 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<h2><a href="<%= post.url %>"><%= post.title %></a></h2>
<title>BDFR Browser</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<h2><a href="<%= post.url %>"><%= post.title %></a></h2>
<p>
<p>
<small><a href="https://reddit.com/user/<%= post.author %>"><%= post.author %></a></small>
-
<small><%= DateTime.to_iso8601(post.posted_at) %></small>
-
<a href="https://reddit.com<%= post.permalink %>">Open reddit</a>
</p>
</p>
<%= unless Enum.empty?(media.images) do %>
<%= unless Enum.empty?(media.images) do %>
<div id="carouselImages" class="carousel slide">
<div class="carousel-inner">
<%= for {img, i} <- Enum.with_index(media.images) do %>
@ -42,9 +28,9 @@
</button>
</div>
<br>
<% end %>
<% end %>
<%= unless Enum.empty?(media.videos) do %>
<%= unless Enum.empty?(media.videos) do %>
<div class="row">
<%= for video <- media.videos do %>
<video controls loop>
@ -53,14 +39,10 @@
<% end %>
</div>
<br>
<% end %>
<% end %>
<%= for comment <- post.comments do %>
<div class="row">
<%= for comment when is_nil(comment.parent_id) <- post.comments do %>
<div class="row" style="margin-bottom: 4px;">
<%= EEx.eval_file(comment_template, comment: comment, level: 0, comment_template: comment_template) %>
</div>
<br>
<% end %>
</div>
</body>
</html>
<% end %>

View file

@ -1,26 +1,9 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<h2><%= subreddit %></h2>
<title>BDFR Browser</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<h2><%= subreddit %></h2>
<div class="row text-center">
<div class="row text-center">
<div class="d-grid gap-2 col-12 mx-auto">
<%= for date <- dates do %>
<a class="btn btn-outline-secondary btn-lg" href="/r/<%= subreddit %>/<%= date %>" role="button"><%= date %></a>
<% end %>
</div>
</div>
</div>
</body>
</html>
</div>

View file

@ -1,20 +1,6 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<h2><%= subreddit %></h2>
<title>BDFR Browser</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<h2><%= subreddit %></h2>
<div class="row text-center">
<div class="row text-center">
<div class="d-grid gap-2 col-12 mx-auto">
<%= for post <- posts do %>
<div class="card">
@ -27,7 +13,4 @@
</div>
<% end %>
</div>
</div>
</div>
</body>
</html>
</div>