logo

pleroma

My custom branche(s) on git.pleroma.social/pleroma/pleroma
commit: 9f82f67e896b11333280acb10b739347ad0828dd
parent: 58628fbd5c4c7866e91b4d47ef4945ee0b931736
Author: Haelwenn (lanodan) Monnier <contact@hacktivis.me>
Date:   Sun, 16 Feb 2020 05:06:27 +0100

StaticFE: Change styling & formatting

Diffstat:

Mlib/pleroma/web/static_fe/static_fe_view.ex6------
Mlib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex2+-
Mlib/pleroma/web/templates/static_fe/static_fe/profile.html.eex5++---
Mpriv/static/static/static-fe.css50++++++++++++++++++++++++--------------------------
4 files changed, 27 insertions(+), 36 deletions(-)

diff --git a/lib/pleroma/web/static_fe/static_fe_view.ex b/lib/pleroma/web/static_fe/static_fe_view.ex @@ -5,7 +5,6 @@ defmodule Pleroma.Web.StaticFE.StaticFEView do use Pleroma.Web, :view - alias Calendar.Strftime alias Pleroma.Emoji.Formatter alias Pleroma.User alias Pleroma.Web.Endpoint @@ -31,11 +30,6 @@ defmodule Pleroma.Web.StaticFE.StaticFEView do Utils.fetch_media_type(@media_types, mediaType) end - def format_date(date) do - {:ok, date, _} = DateTime.from_iso8601(date) - Strftime.strftime!(date, "%Y/%m/%d %l:%M:%S %p UTC") - end - def instance_name, do: Pleroma.Config.get([:instance, :name], "Pleroma") def open_content? do diff --git a/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex b/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex @@ -1,6 +1,6 @@ <div class="activity" <%= if @selected do %> id="selected" <% end %>> <p class="pull-right"> - <%= link format_date(@published), to: @link, class: "activity-link" %> + <%= link @published, to: @link, class: "activity-link" %> </p> <%= render("_user_card.html", %{user: @user}) %> <div class="activity-content"> diff --git a/lib/pleroma/web/templates/static_fe/static_fe/profile.html.eex b/lib/pleroma/web/templates/static_fe/static_fe/profile.html.eex @@ -20,11 +20,10 @@ <% end %> <p id="pagination"> <%= if @prev_page_id do %> - <%= link "«", to: "?min_id=" <> @prev_page_id %> + <%= link "Previous page", to: "?min_id=" <> @prev_page_id %> <% end %> - <%= if @prev_page_id && @next_page_id, do: " | " %> <%= if @next_page_id do %> - <%= link "»", to: "?max_id=" <> @next_page_id %> + <%= link "Next page", to: "?max_id=" <> @next_page_id %> <% end %> </p> </div> diff --git a/priv/static/static/static-fe.css b/priv/static/static/static-fe.css @@ -5,26 +5,24 @@ body { } main { - margin: 50px auto; - max-width: 960px; - padding: 40px; + margin: 2ch auto; + max-width: 80em; + padding: 2ch 2em; background-color: #313543; - border-radius: 4px; + border-radius: 4pt; } header { - margin: 50px auto; - max-width: 960px; - padding: 40px; + margin: 2ch auto; + max-width: 80em; + padding: 2ch 2em; background-color: #313543; - border-radius: 4px; + border-radius: 4pt; } .activity { border-radius: 4px; - padding: 1em; - padding-bottom: 2em; - margin-bottom: 1em; + padding: 1ch 1em; } .avatar { @@ -37,10 +35,16 @@ header { margin-right: 4px; } -.activity-content img, video, audio { - padding: 1em; - max-width: 800px; - max-height: 800px; +.activity-content img, +.activity-content video, +.activity-content audio { + width: 100%; + height: 100%; + object-fit: contain; + max-width: 90vw; + max-height: 90vh; + margin: 0 auto; + display: block; } #selected { @@ -52,20 +56,17 @@ header { margin-left: 1em; } -a { - color: white; -} - .h-card { min-height: 48px; margin-bottom: 8px; } -header a, .h-card a { +a { text-decoration: none; + color: #d8a070; } -header a:hover, .h-card a:hover { +a:hover { text-decoration: underline; } @@ -107,8 +108,7 @@ h1 { h2 { color: #9baec8; font-weight: normal; - font-size: 20px; - margin-bottom: 40px; + margin-bottom: 2ch; } form { @@ -120,8 +120,6 @@ input { width: 100%; padding: 10px; margin-top: 20px; - background-color: rgba(0,0,0,.1); - color: white; border: 0; border-bottom: 2px solid #9baec8; font-size: 14px; @@ -139,7 +137,7 @@ button { box-sizing: border-box; width: 100%; color: white; - background-color: #419bdd; + background-color: #d8a070; border-radius: 4px; border: none; padding: 10px;