diff options
| author | Alex Gleason <alex@alexgleason.me> | 2020-07-27 17:15:42 -0500 |
|---|---|---|
| committer | Alex Gleason <alex@alexgleason.me> | 2020-07-27 17:15:42 -0500 |
| commit | 2208e5d9bade8f74ce47e4817a78b943f0ceff73 (patch) | |
| tree | 90d9f102e89957430973e10f6590d9c8617a6976 | |
| parent | 6afbd60af67c2c0e3b537b8e5062e0f0d1a57ebd (diff) | |
| download | pleroma-2208e5d9bade8f74ce47e4817a78b943f0ceff73.tar.gz | |
OAuth form: add instance header
| -rw-r--r-- | lib/pleroma/web/templates/layout/app.html.eex | 17 | ||||
| -rw-r--r-- | priv/static/instance/static.css | 39 |
2 files changed, 42 insertions, 14 deletions
diff --git a/lib/pleroma/web/templates/layout/app.html.eex b/lib/pleroma/web/templates/layout/app.html.eex index 7bc81ddaa..84047115e 100644 --- a/lib/pleroma/web/templates/layout/app.html.eex +++ b/lib/pleroma/web/templates/layout/app.html.eex @@ -1,16 +1,19 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> - <meta charset="utf-8" /> - <meta name="viewport" content="width=device-width,initial-scale=1,minimal-ui" /> - <title> - <%= Pleroma.Config.get([:instance, :name]) %> - </title> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width,initial-scale=1,minimal-ui"> + <title><%= Pleroma.Config.get([:instance, :name]) %></title> <link rel="stylesheet" href="/instance/static.css"> </head> <body> + <div class="instance-header"> + <div class="instance-header__content"> + <img class="instance-header__thumbnail" src="<%= Pleroma.Config.get([:instance, :instance_thumbnail]) %>"> + <h1 class="instance-header__title"><%= Pleroma.Config.get([:instance, :name]) %></h1> + </div> + </div> <div class="container"> - <h1><%= Pleroma.Config.get([:instance, :name]) %></h1> <%= render @view_module, @view_template, assigns %> </div> </body> diff --git a/priv/static/instance/static.css b/priv/static/instance/static.css index 7112e3ad8..e2e946e99 100644 --- a/priv/static/instance/static.css +++ b/priv/static/instance/static.css @@ -1,16 +1,46 @@ +* { + box-sizing: border-box; +} + body { background-color: #121a24; font-family: sans-serif; color: #b9b9ba; + padding: 0; + margin: 0; +} + +.instance-header { + padding: 10px; + background: #182230; + box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.5); +} + +.instance-header__content { + display: flex; + align-items: center; + max-width: 400px; + margin: 0 auto; +} + +.instance-header__thumbnail { + max-width: 40px; + border-radius: 4px; + margin-right: 10px; +} + +.instance-header__title { + font-size: 16px; + font-weight: bold; } .container { - max-width: 420px; + max-width: 400px; padding: 20px; background-color: #182230; border-radius: 4px; margin: auto; - margin-top: 10vh; + margin-top: 35px; box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.5); } @@ -104,7 +134,6 @@ input { background-color: #121a24; border: 4px solid #121a24; box-shadow: 0px 0px 1px 0 #d8a070; - box-sizing: border-box; width: 1.2em; height: 1.2em; margin-right: 1.0em; @@ -126,7 +155,6 @@ input:focus { } button { - box-sizing: border-box; width: 100%; background-color: #1c2a3a; color: #b9b9ba; @@ -150,7 +178,6 @@ button:hover { } .alert-danger { - box-sizing: border-box; width: 100%; background-color: #931014; border: 1px solid #a06060; @@ -162,7 +189,6 @@ button:hover { } .alert-info { - box-sizing: border-box; width: 100%; border-radius: 4px; border: 1px solid #7d796a; @@ -174,7 +200,6 @@ button:hover { .account-header { display: flex; - margin: 20px 0; } .account-header .avatar { |