SuperSeriousBusiness/GoToSocial
1
1
Fork 0
mirror of https://github.com/superseriousbusiness/gotosocial synced 2025-06-05 21:59:39 +02:00
Code Issues Projects Releases Wiki Activity

[chore] Refactor HTML templates and CSS (#2480)

Browse Source 
* [chore] Refactor HTML templates and CSS

* eslint

* ignore "Local"

* rss tests

* fiddle with OG just a tiny bit

* dick around with polls a bit more so SR stops saying "clickable"

* remove break

* oh lord

* don't lazy load avatar

* fix ogmeta tests

* clean up some cruft

* catch remaining calls to c.HTML

* fix error rendering + stack overflow in tag

* allow templating attributes

* fix indent

* set aria-hidden on status complementary content, since it's already present in the label anyway

* tidy up templating calls a little

* try to make styling a bit more consistent + readable

* fix up some remaining CSS issues

* fix up reports
This commit is contained in:
tobi
2023-12-27 11:23:52 +01:00
committed by GitHub
parent 97a1fd9a29
commit 0ff52b71f2
77 changed files with 3262 additions and 1736 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
web/source/settings/components/fake-profile.jsx
View File

@@ -22,24 +22,29 @@ const React = require("react");
module.exports = function FakeProfile({ avatar, header, display_name, username, role }) {
return ( // Keep in sync with web/template/profile.tmpl
<div className="profile">
<div className="header">
<div className="header-image">
<div className="profile-header">
<div className="header-image-wrapper">
<img src={header} alt={header ? `header image for ${username}` : "None set"} />
</div>
<div className="basic-info" aria-hidden="true">
<a className="avatar" href={avatar}>
<img src={avatar} alt={avatar ? `avatar image for ${username}` : "None set"} />
</a>
<span className="displayname text-cutoff">
{display_name.trim().length > 0 ? display_name : username}
<span className="sr-only">.</span>
</span>
<span className="username text-cutoff">@{username}</span>
{(role && role.name != "user") &&
<div className={`role ${role.name}`}>
<span className="sr-only">Role: </span>{role.name}
</div>
}
<dl className="namerole">
<dt className="sr-only">Display name</dt>
<dd className="displayname text-cutoff">{display_name.trim().length > 0 ? display_name : username}</dd>
<dt className="sr-only">Username</dt>
<dd className="username text-cutoff">@{username}</dd>
<dt className="sr-only">Role</dt>
{
(role && role.name != "user") ?
<>
<dd className="sr-only">Role</dd>
<dt className={`role ${role.name}`}>{role.name}</dt>
</>
: null
}
</dl>
</div>
</div>
</div>