Compare commits
4 commits
shigusegub
...
shigusegub
| Author | SHA1 | Date | |
|---|---|---|---|
|
26234c032d | ||
|
9b5afe9cd4 |
||
|
|
56b3db71ff |
||
|
|
ddc1a86f40 |
7 changed files with 276 additions and 343 deletions
|
|
@ -64,9 +64,9 @@ config :pleroma, Pleroma.Upload,
|
|||
link_name: false,
|
||||
proxy_remote: false,
|
||||
filename_display_max_length: 30,
|
||||
default_description: :filename,
|
||||
default_description: nil,
|
||||
base_url: nil,
|
||||
allowed_mime_types: ["image", "audio", "video", "application"]
|
||||
allowed_mime_types: ["image", "audio", "video"]
|
||||
|
||||
config :pleroma, Pleroma.Uploaders.Local, uploads: "uploads"
|
||||
|
||||
|
|
@ -167,18 +167,18 @@ config :pleroma, :http,
|
|||
adapter: []
|
||||
|
||||
config :pleroma, :instance,
|
||||
name: "Shigusegubu",
|
||||
email: "pleroma@hjkos.com",
|
||||
notify_email: "pleroma@hjkos.com",
|
||||
description: "SigSegV, a pleroma instance",
|
||||
short_description: "HJ's semi-personal instance",
|
||||
name: "Pleroma",
|
||||
email: "example@example.com",
|
||||
notify_email: "noreply@example.com",
|
||||
description: "Pleroma: An efficient and flexible fediverse server",
|
||||
short_description: "",
|
||||
background_image: "/images/city.jpg",
|
||||
instance_thumbnail: "/instance/thumbnail.jpeg",
|
||||
favicon: "/favicon.png",
|
||||
limit: 5_000,
|
||||
description_limit: 5_000,
|
||||
remote_limit: 100_000,
|
||||
upload_limit: 200_000_000,
|
||||
upload_limit: 16_000_000,
|
||||
avatar_upload_limit: 2_000_000,
|
||||
background_upload_limit: 4_000_000,
|
||||
banner_upload_limit: 4_000_000,
|
||||
|
|
@ -196,17 +196,19 @@ config :pleroma, :instance,
|
|||
federation_incoming_replies_max_depth: 100,
|
||||
allow_relay: true,
|
||||
public: true,
|
||||
quarantined_instances: [{ "pleroma.rareome.ga", "leaks private posts or sumshit i dont rember" }],
|
||||
quarantined_instances: [],
|
||||
rejected_instances: [],
|
||||
static_dir: "instance/static/",
|
||||
allowed_post_formats: [
|
||||
"text/plain",
|
||||
"text/html",
|
||||
"text/markdown",
|
||||
"text/bbcode"
|
||||
],
|
||||
autofollowed_nicknames: [],
|
||||
autofollowing_nicknames: [],
|
||||
max_pinned_statuses: 1,
|
||||
attachment_links: true,
|
||||
attachment_links: false,
|
||||
max_report_comment_size: 1000,
|
||||
report_strip_status: true,
|
||||
safe_dm_mentions: false,
|
||||
|
|
@ -299,8 +301,8 @@ config :pleroma, :markup,
|
|||
|
||||
config :pleroma, :frontend_configurations,
|
||||
pleroma_fe: %{
|
||||
alwaysShowSubjectInput: false,
|
||||
background: "/static/sigsegv_s.png",
|
||||
alwaysShowSubjectInput: true,
|
||||
background: "/images/city.jpg",
|
||||
collapseMessageWithSubject: false,
|
||||
disableChat: false,
|
||||
greentext: false,
|
||||
|
|
@ -314,18 +316,18 @@ config :pleroma, :frontend_configurations,
|
|||
logo: "/static/logo.svg",
|
||||
logoMargin: ".1em",
|
||||
logoMask: true,
|
||||
minimalScopesMode: true,
|
||||
minimalScopesMode: false,
|
||||
noAttachmentLinks: false,
|
||||
nsfwCensorImage: "",
|
||||
postContentType: "text/plain",
|
||||
redirectRootLogin: "/main/friends",
|
||||
redirectRootNoLogin: "/main/all",
|
||||
scopeCopy: false,
|
||||
scopeCopy: true,
|
||||
sidebarRight: false,
|
||||
showFeaturesPanel: true,
|
||||
showInstanceSpecificPanel: true,
|
||||
subjectLineBehavior: "noop",
|
||||
theme: "sigsegv2",
|
||||
showInstanceSpecificPanel: false,
|
||||
subjectLineBehavior: "email",
|
||||
theme: "pleroma-dark",
|
||||
webPushNotifications: false
|
||||
}
|
||||
|
||||
|
|
@ -384,23 +386,8 @@ config :pleroma, :mrf_hellthread,
|
|||
|
||||
config :pleroma, :mrf_simple,
|
||||
media_removal: [],
|
||||
media_nsfw: [
|
||||
{ "preteengirls.biz", "pron or even cp" },
|
||||
{ "melalandia.tk", "i don't rember" },
|
||||
{ "pl.smuglo.li", "instance is dead but i still remember, rip smuglo" },
|
||||
{ "baraag.net", "pron" },
|
||||
{ "humblr.social", "3dpd pron" },
|
||||
{ "pawoo.net", "tasteful pron, mostly." },
|
||||
{ "sinblr.com", "3dpd pron" }
|
||||
],
|
||||
federated_timeline_removal: [
|
||||
{ "preteengirls.biz", "pron or even cp" },
|
||||
{ "melalandia.tk", "i don't rember" },
|
||||
{ "baraag.net", "pron" },
|
||||
{ "humblr.social", "3dpd pron" },
|
||||
{ "pawoo.net", "tasteful pron, mostly." },
|
||||
{ "sinblr.com", "3dpd pron" }
|
||||
],
|
||||
media_nsfw: [],
|
||||
federated_timeline_removal: [],
|
||||
report_removal: [],
|
||||
reject: [],
|
||||
followers_only: [],
|
||||
|
|
@ -511,7 +498,7 @@ config :pleroma, :media_preview_proxy,
|
|||
min_content_length: 100 * 1024
|
||||
|
||||
config :pleroma, :shout,
|
||||
enabled: false,
|
||||
enabled: true,
|
||||
limit: 5_000
|
||||
|
||||
config :phoenix, :format_encoders, json: Jason, "activity+json": Jason
|
||||
|
|
@ -839,7 +826,7 @@ config :pleroma, :web_cache_ttl,
|
|||
|
||||
config :pleroma, :modules, runtime_dir: "instance/modules"
|
||||
|
||||
config :pleroma, configurable_from_database: true
|
||||
config :pleroma, configurable_from_database: false
|
||||
|
||||
config :pleroma, Pleroma.Repo,
|
||||
parameters: [gin_fuzzy_search_limit: "500", jit: "off"],
|
||||
|
|
@ -912,13 +899,9 @@ config :pleroma, Pleroma.Web.ApiSpec.CastAndValidate, strict: false
|
|||
|
||||
config :pleroma, :mrf,
|
||||
policies: [
|
||||
Pleroma.Web.ActivityPub.MRF.SimplePolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.HellthreadPolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.AntiFollowbotPolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.TagPolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.ObjectAgePolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.InlineQuotePolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.AntiLinkSpamPolicy
|
||||
Pleroma.Web.ActivityPub.MRF.TagPolicy,
|
||||
Pleroma.Web.ActivityPub.MRF.InlineQuotePolicy
|
||||
],
|
||||
transparency: true,
|
||||
transparency_exclusions: []
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ After=network.target postgresql.service
|
|||
ExecReload=/bin/kill $MAINPID
|
||||
KillMode=process
|
||||
Restart=on-failure
|
||||
StandardOutput=journal
|
||||
|
||||
; Name of the user that runs the Pleroma service.
|
||||
User=pleroma
|
||||
|
|
@ -15,11 +14,9 @@ Environment="MIX_ENV=prod"
|
|||
|
||||
; Make sure that all paths fit your installation.
|
||||
; Path to the home directory of the user running the Pleroma service.
|
||||
Environment="HOME=/home/pleroma"
|
||||
Environment="HOME=/var/lib/pleroma"
|
||||
; Path to the folder containing the Pleroma installation.
|
||||
WorkingDirectory=/home/pleroma/pleroma
|
||||
; Path to the environment file. the file contains RELEASE_COOKIE and etc
|
||||
;EnvironmentFile=/opt/pleroma/config/pleroma.env
|
||||
WorkingDirectory=/opt/pleroma
|
||||
; Path to the Mix binary.
|
||||
ExecStart=/usr/bin/mix phx.server
|
||||
|
||||
|
|
@ -27,7 +24,7 @@ ExecStart=/usr/bin/mix phx.server
|
|||
; Use private /tmp and /var/tmp folders inside a new file system namespace, which are discarded after the process stops.
|
||||
PrivateTmp=true
|
||||
; The /home, /root, and /run/user folders can not be accessed by this service anymore. If your Pleroma user has its home folder in one of the restricted places, or use one of these folders as its working directory, you have to set this to false.
|
||||
ProtectHome=false
|
||||
ProtectHome=true
|
||||
; Mount /usr, /boot, and /etc as read-only for processes invoked by this service.
|
||||
ProtectSystem=full
|
||||
; Sets up a new /dev mount for the process and only adds API pseudo devices like /dev/null, /dev/zero or /dev/random but not physical devices. Disabled by default because it may not work on devices like the Raspberry Pi.
|
||||
|
|
|
|||
|
|
@ -133,15 +133,11 @@ defmodule Pleroma.Constants do
|
|||
do: ~r/^[^[:cntrl:] ()<>@,;:\\"\/\[\]?=]+\/[^[:cntrl:] ()<>@,;:\\"\/\[\]?=]+(; .*)?$/
|
||||
)
|
||||
|
||||
const(activity_json_canonical_mime_type,
|
||||
do: "application/ld+json; profile=\"https://www.w3.org/ns/activitystreams\""
|
||||
)
|
||||
|
||||
const(activity_json_mime_types,
|
||||
do: [
|
||||
"application/ld+json; profile=\"https://www.w3.org/ns/activitystreams\"",
|
||||
"application/activity+json"
|
||||
]
|
||||
# List of allowed chars in the path segment of a URI
|
||||
# unreserved, sub-delims, ":", "@" and "/" allowed as the separator in path
|
||||
# https://datatracker.ietf.org/doc/html/rfc3986
|
||||
const(uri_path_allowed_reserved_chars,
|
||||
do: ~c"!$&'()*+,;=/:@"
|
||||
)
|
||||
|
||||
const(upload_object_types, do: ["Document", "Image"])
|
||||
|
|
|
|||
|
|
@ -13,10 +13,8 @@
|
|||
<h1 class="instance-header__title"><%= Pleroma.Config.get([:instance, :name]) %></h1>
|
||||
</a>
|
||||
</div>
|
||||
<div class="contents">
|
||||
<div class="panel">
|
||||
<%= @inner_content %>
|
||||
</div>
|
||||
<div class="container">
|
||||
<%= @inner_content %>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,19 +5,10 @@
|
|||
<% # Note: using hidden input with `unchecked_value` in order to distinguish user's empty selection from `scope` param being omitted %>
|
||||
<%= if scope in @scopes do %>
|
||||
<div class="scope">
|
||||
<span class="checkbox">
|
||||
<%= checkbox @form, :"scope_#{scope}", value: scope in @scopes && scope, checked_value: scope, unchecked_value: "", name: "authorization[scope][]" %>
|
||||
<%= label @form, :"scope_#{scope}", "" %>
|
||||
</span>
|
||||
<%= checkbox @form, :"scope_#{scope}", value: scope in @scopes && scope, checked_value: scope, unchecked_value: "", name: "authorization[scope][]" %>
|
||||
<%= label @form, :"scope_#{scope}", String.capitalize(scope) %>
|
||||
<%= if scope in @scopes && scope do %>
|
||||
<dl>
|
||||
<dt>
|
||||
<%= :"Elixir.Gettext".dgettext(Gettext, "oauth_scopes", scope) %>
|
||||
</dt>
|
||||
<dd>
|
||||
<code><%= scope %></code>
|
||||
</dd>
|
||||
</dl>
|
||||
<code><%= scope %></code> <%= :"Elixir.Gettext".dgettext(Gettext, "oauth_scopes", scope) %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% else %>
|
||||
|
|
|
|||
|
|
@ -8,20 +8,17 @@
|
|||
<%= form_for @conn, Routes.o_auth_path(@conn, :authorize), [as: "authorization"], fn f -> %>
|
||||
|
||||
<%= if @user do %>
|
||||
<div class="account-header">
|
||||
<div class="account-header_container">
|
||||
<img class="account-header__banner" src="<%= Pleroma.User.banner_url(@user) %>">
|
||||
<div class="account-header__overlay"></div>
|
||||
<div class="account-header">
|
||||
<div class="account-header__banner" style="background-image: url('<%= Pleroma.User.banner_url(@user) %>')"></div>
|
||||
<div class="account-header__avatar" style="background-image: url('<%= Pleroma.User.avatar_url(@user) %>')"></div>
|
||||
<div class="account-header__meta">
|
||||
<div class="account-header__display-name"><%= @user.name %></div>
|
||||
<div class="account-header__nickname">@<%= Pleroma.User.full_nickname(@user.nickname) %></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="account-header__avatar" style="background-image: url('<%= Pleroma.User.avatar_url(@user) %>')"></div>
|
||||
<div class="account-header__meta">
|
||||
<div class="account-header__display-name"><%= @user.name %></div>
|
||||
<div class="account-header__nickname">@<%= Pleroma.User.full_nickname(@user.nickname) %></div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="panel-body">
|
||||
<div class="container__content">
|
||||
<%= if @app do %>
|
||||
<p><%= raw Gettext.dpgettext("static_pages", "oauth authorize message", "Application <strong>%{client_name}</strong> is requesting access to your account.", client_name: safe_to_string(html_escape(@app.client_name))) %></p>
|
||||
<%= render Phoenix.Controller.view_module(@conn), "_scopes.html", Map.merge(assigns, %{form: f}) %>
|
||||
|
|
@ -32,7 +29,7 @@
|
|||
<a class="button button--cancel" href="/">
|
||||
<%= Gettext.dpgettext("static_pages", "oauth authorize cancel button", "Cancel") %>
|
||||
</a>
|
||||
<%= submit Gettext.dpgettext("static_pages", "oauth authorize approve button", "Approve"), class: "button button--approve" %>
|
||||
<%= submit Gettext.dpgettext("static_pages", "oauth authorize approve button", "Approve"), class: "button--approve" %>
|
||||
</div>
|
||||
<% else %>
|
||||
<%= if @params["registration"] in ["true", true] do %>
|
||||
|
|
@ -54,9 +51,7 @@
|
|||
<%= label f, :password, Gettext.dpgettext("static_pages", "oauth login password prompt", "Password") %>
|
||||
<%= password_input f, :password %>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<%= submit Gettext.dpgettext("static_pages", "oauth login button", "Log In"), class: "button button--approve" %>
|
||||
</div>
|
||||
<%= submit Gettext.dpgettext("static_pages", "oauth login button", "Log In") %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,84 +3,206 @@
|
|||
}
|
||||
|
||||
:root {
|
||||
font-size: 16px;
|
||||
|
||||
--bg: rgba(18, 26, 36, 1);
|
||||
--fg: rgba(24, 34, 48, 1);
|
||||
--text: rgba(185, 185, 186, 1);
|
||||
--link: rgba(216, 160, 112, 1);
|
||||
--accent: rgba(216, 160, 112, 1);
|
||||
--cRed: rgba(211, 16, 20, 1);
|
||||
--cBlue: rgba(0, 149, 255, 1);
|
||||
--cGreen: rgba(15, 160, 15, 1);
|
||||
--cOrange: rgba(255, 165, 0, 1);
|
||||
--font: sans-serif;
|
||||
--monoFont: monospace;
|
||||
--wallpaper: rgba(14, 21, 29, 1);
|
||||
--selectionBackground: rgba(216, 160, 112, 1);
|
||||
--selectionText: rgba(0, 0, 0, 1);
|
||||
--badgeNotification: rgba(211, 16, 20, 1);
|
||||
--brand-color: #d8a070;
|
||||
--background-color: #121a24;
|
||||
--foreground-color: #182230;
|
||||
--primary-text-color: #b9b9ba;
|
||||
--muted-text-color: #89898a;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--wallpaper);
|
||||
background-color: var(--background-color);
|
||||
font-family: sans-serif;
|
||||
color: var(--text);
|
||||
color: var(--primary-text-color);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.instance-header {
|
||||
height: 60px;
|
||||
padding: 10px;
|
||||
background: var(--foreground-color);
|
||||
box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.instance-header__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
align-items: center;
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.instance-header__thumbnail {
|
||||
max-width: 40px;
|
||||
border-radius: 4px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.instance-header__title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 400px;
|
||||
background-color: var(--foreground-color);
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
margin: 35px auto;
|
||||
box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.5);
|
||||
padding: 0em 1em 0em 1em;
|
||||
}
|
||||
|
||||
.container__content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 24px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: var(--primary-text-color);
|
||||
font-weight: normal;
|
||||
font-size: 18px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link);
|
||||
color: var(--brand-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.button {
|
||||
form {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.input {
|
||||
color: var(--muted-text-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 10px;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 10px;
|
||||
background-color: var(--background-color);
|
||||
color: var(--primary-text-color);
|
||||
border: 0;
|
||||
transition-property: border-bottom;
|
||||
transition-duration: 0.35s;
|
||||
border-bottom: 2px solid #2a384a;
|
||||
font-size: 14px;
|
||||
width: inherit;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.scopes-input {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 1em 0;
|
||||
color: var(--muted-text-color);
|
||||
}
|
||||
|
||||
.scopes-input label:first-child {
|
||||
height: 2em;
|
||||
}
|
||||
|
||||
.scopes {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
color: var(--primary-text-color);
|
||||
}
|
||||
|
||||
.scope {
|
||||
display: flex;
|
||||
flex-basis: 100%;
|
||||
height: 2em;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.scope:before {
|
||||
color: var(--primary-text-color);
|
||||
content: "✔\fe0e";
|
||||
margin-left: 1em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
[type="checkbox"] + label {
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
margin: 0.5em;
|
||||
}
|
||||
|
||||
[type="checkbox"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[type="checkbox"] + label:before {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
color: white;
|
||||
background-color: var(--background-color);
|
||||
border: 4px solid var(--background-color);
|
||||
box-shadow: 0px 0px 1px 0 var(--brand-color);
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
margin-right: 1.0em;
|
||||
content: "";
|
||||
transition-property: background-color;
|
||||
transition-duration: 0.35s;
|
||||
color: var(--background-color);
|
||||
margin-bottom: -0.2em;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
[type="checkbox"]:checked + label:before {
|
||||
background-color: var(--brand-color);
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
border-bottom: 2px solid var(--brand-color);
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.actions button,
|
||||
.actions a.button {
|
||||
width: auto;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
a.button,
|
||||
button {
|
||||
width: 100%;
|
||||
background-color: #1c2a3a;
|
||||
color: var(--primary-text-color);
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
padding: 0 1em;
|
||||
line-height: 2;
|
||||
margin-top: 2em;
|
||||
font-size: 1em;
|
||||
padding: 10px 16px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
text-transform: uppercase;
|
||||
font-size: 16px;
|
||||
box-shadow: 0px 0px 2px 0px black,
|
||||
0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset,
|
||||
0px -1px 0px 0px rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
a.button:hover,
|
||||
button:hover {
|
||||
cursor: pointer;
|
||||
box-shadow:
|
||||
0 0 2px 0 black,
|
||||
0 1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 -1px 0 0 rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
box-shadow:
|
||||
0 0 1px 2px rgba(185, 185, 186, 0.4),
|
||||
0 1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 -1px 0 0 rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
.button:active {
|
||||
transform: translate(1px, 1px);
|
||||
box-shadow:
|
||||
0 0 2px 0 black,
|
||||
0 -1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 1px 0 0 rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
.button:hover:active {
|
||||
box-shadow:
|
||||
0 0 1px 2px rgba(185, 185, 186, 0.4),
|
||||
0 -1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 1px 0 0 rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
.input {
|
||||
color: var(--text);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: 0px 0px 0px 1px var(--brand-color),
|
||||
0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset,
|
||||
0px -1px 0px 0px rgba(0, 0, 0, 0.2) inset;
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
|
|
@ -104,222 +226,73 @@ a {
|
|||
font-size: 16px;
|
||||
}
|
||||
|
||||
.instance-header {
|
||||
display: flex;
|
||||
height: 3.5rem;
|
||||
padding: 0 1em;
|
||||
background: var(--fg);
|
||||
box-shadow:
|
||||
0 1px 4px 0 rgba(0, 0, 0, 0.4),
|
||||
0 2px 7px 0 rgba(0, 0, 0, 0.3);
|
||||
justify-content: center;
|
||||
align-self: stretch;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.instance-header__content {
|
||||
line-height: 3.5rem;
|
||||
display: flex;
|
||||
flex: 1 1 45em;
|
||||
max-width: 45em;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.instance-header__thumbnail {
|
||||
max-width: 3.5em;
|
||||
border-radius: 0.25em;
|
||||
margin-right: 0.75em;
|
||||
}
|
||||
|
||||
.instance-header__title {
|
||||
font-weight: bold;
|
||||
color: var(--text);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.contents {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.panel {
|
||||
color: var(--text);
|
||||
background-color: var(--bg);
|
||||
position: relative;
|
||||
max-width: 45em;
|
||||
border-radius: 0.5em;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
box-shadow:
|
||||
0 0 3px 0 rgba(0, 0, 0, 0.5),
|
||||
0 4px 6px 3px rgba(0, 0, 0, 0.3);
|
||||
padding: 0;
|
||||
flex: 1 1 45em;
|
||||
}
|
||||
|
||||
.button {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.panel-body {
|
||||
padding: 0 1em 1em;
|
||||
background-color: var(--bg);
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.actions .button {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
|
||||
.account-header {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: end;
|
||||
width: 100%;
|
||||
aspect-ratio: 3;
|
||||
gap: 1em;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.account-header_container {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 0;
|
||||
mask: linear-gradient(to top,transparent 0,white 5em) bottom no-repeat;
|
||||
}
|
||||
|
||||
.account-header__overlay,
|
||||
.account-header__banner {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
inset: 0;
|
||||
}
|
||||
|
||||
.account-header__overlay {
|
||||
background-color: rgba(18, 26, 36, 0.5);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.account-header__banner {
|
||||
z-index: -2;
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.account-header__avatar {
|
||||
width: 6em;
|
||||
height: 6em;
|
||||
flex: 0 0 6em;
|
||||
z-index: 1;
|
||||
height: 112px;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.account-header__avatar {
|
||||
width: 94px;
|
||||
height: 94px;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
margin: -47px 10px 0;
|
||||
border: 6px solid var(--foreground-color);
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.account-header__meta {
|
||||
z-index: 1;
|
||||
flex: 1 1 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 10em;
|
||||
font-size: 125%;
|
||||
padding: 6px 20px 17px;
|
||||
}
|
||||
|
||||
.account-header__nickname,
|
||||
.account-header__display-name {
|
||||
font-size: 1.25em;
|
||||
white-space: nowrap;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.acocunt-header__display-name {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.account-header__nickname {
|
||||
font-size: 0.75em;
|
||||
color: var(--link);
|
||||
font-size: 14px;
|
||||
color: var(--muted-text-color);
|
||||
}
|
||||
|
||||
input {
|
||||
display: inline-block;
|
||||
background-color: var(--background);
|
||||
outline: none;
|
||||
color: var(--text);
|
||||
line-height: 2;
|
||||
border-radius: 0.5em;
|
||||
box-shadow: var(--shadow);
|
||||
border: none;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
@media all and (max-width: 420px) {
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
display: none;
|
||||
}
|
||||
.scope {
|
||||
flex-basis: 0%;
|
||||
}
|
||||
|
||||
input, label, label::before {
|
||||
--background: rgba(15, 21, 30, 1);
|
||||
--shadow:
|
||||
0 0 2px 0 rgba(0, 0, 0, 1),
|
||||
0 -1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 1px 0 0 rgba(0, 0, 0, 0.2) inset,
|
||||
0 0 2px 0 rgba(0, 0, 0, 0.15) inset,
|
||||
1px 0 1px 1px rgba(185, 185, 186, 0.15),
|
||||
-1px 0 1px 1px rgba(185, 185, 186, 0.15);
|
||||
--shadowHover:
|
||||
0 0 4px 0 rgba(185, 185, 186, 0.5),
|
||||
0 -1px 0 0 rgba(255, 255, 255, 0.2) inset,
|
||||
0 1px 0 0 rgba(0, 0, 0, 0.2) inset,
|
||||
0 0 2px 0 rgba(0, 0, 0, 0.15) inset,
|
||||
1px 0 1px 1px rgba(185, 185, 186, 0.15),
|
||||
-1px 0 1px 1px rgba(185, 185, 186, 0.15);
|
||||
}
|
||||
.scope:before {
|
||||
content: "";
|
||||
margin-left: 0em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.scope:first-child:before {
|
||||
margin-left: 1em;
|
||||
content: "✔\fe0e";
|
||||
}
|
||||
|
||||
label[type="checkbox"]::before {
|
||||
content: ""
|
||||
}
|
||||
.scope:after {
|
||||
content: ",";
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked + label::before {
|
||||
content: "✓"
|
||||
}
|
||||
|
||||
label {
|
||||
padding: 1em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
input[type="checkbox"] + label::before {
|
||||
content: "";
|
||||
|
||||
box-shadow:
|
||||
min-width: 1em;
|
||||
min-height: 1em;
|
||||
text-align: center;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
label:hover::before {
|
||||
box-shadow: var(--shadowHover);
|
||||
}
|
||||
|
||||
.scope {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
dl {
|
||||
margin: 0.75em;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
dt, dd {
|
||||
margin: 0;
|
||||
}
|
||||
.scope:last-child:after {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
.form-row {
|
||||
display: flex;
|
||||
}
|
||||
.form-row > label {
|
||||
line-height: 47px;
|
||||
flex: 1;
|
||||
}
|
||||
.form-row > input {
|
||||
flex: 2;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue