logo

mastofe

My custom branche(s) on git.pleroma.social/pleroma/mastofe
commit: 7ee8e50b9cf15fd01719ec9a073fcacb18f31eeb
parent: 995f0ad51ca2d151291ff827c7e0b2378ff0e108
Author: Stephen Burgess <stephenburgess8@gmail.com>
Date:   Sun, 23 Apr 2017 14:34:33 -0500

fix(style): Fix styles after classname refactor (#2368)

Float detailed status display avatar left. Only apply display block to display names in status info, not in detailed status. Thanks to @nightpool for finding those. Make star icon in notification show up as gold. Add anchor selector back to status__content__spoiler-link in order to override default anchor style elsewhere.

Diffstat:

Mapp/assets/javascripts/components/features/status/components/detailed_status.jsx2+-
Mapp/assets/stylesheets/components.scss11+++++++++--
2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/components/features/status/components/detailed_status.jsx b/app/assets/javascripts/components/features/status/components/detailed_status.jsx @@ -51,7 +51,7 @@ class DetailedStatus extends React.PureComponent { return ( <div className='detailed-status'> <a href={status.getIn(['account', 'url'])} onClick={this.handleAccountClick} className='detailed-status__display-name'> - <div className='.detailed-status__display-avatar'><Avatar src={status.getIn(['account', 'avatar'])} staticSrc={status.getIn(['account', 'avatar_static'])} size={48} /></div> + <div className='detailed-status__display-avatar'><Avatar src={status.getIn(['account', 'avatar'])} staticSrc={status.getIn(['account', 'avatar_static'])} size={48} /></div> <DisplayName account={status.get('account')} /> </a> diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss @@ -496,6 +496,9 @@ a.status__content__spoiler-link { .status__display-name { color: lighten($color1, 26%); +} + +.status__info .status__display-name { display: block; max-width: 100%; padding-right: 25px; @@ -835,7 +838,7 @@ a.status__content__spoiler-link { } .detailed-status__display-avatar { - float: right; + float: left; margin-right: 10px; } @@ -861,7 +864,7 @@ a.status__content__spoiler-link { opacity: 0.5; } - .status__content__spoiler-link { + a.status__content__spoiler-link { background: lighten($color1, 26%); color: lighten($color1, 4%); @@ -889,6 +892,10 @@ a.status__content__spoiler-link { .notification__favourite-icon-wrapper { left: -26px; position: absolute; + + .star-icon { + color: #ca8f04; + } } .star-icon.active {