Skip to content

Commit

Permalink
Replace new-style upstream CWs with old-style CWs for now
Browse files Browse the repository at this point in the history
  • Loading branch information
ClearlyClaire committed Sep 22, 2024
1 parent 0d26c9f commit 4d75493
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 10 deletions.
26 changes: 18 additions & 8 deletions app/javascript/flavours/glitch/components/content_warning.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,25 @@
import { StatusBanner, BannerVariant } from './status_banner';
/* Significantly rewritten from upstream to keep the old design for now */

import { FormattedMessage } from 'react-intl';

export const ContentWarning: React.FC<{
text: string;
expanded?: boolean;
onClick?: () => void;
}> = ({ text, expanded, onClick }) => (
<StatusBanner
expanded={expanded}
onClick={onClick}
variant={BannerVariant.Yellow}
>
<p dangerouslySetInnerHTML={{ __html: text }} />
</StatusBanner>
<p>
<span dangerouslySetInnerHTML={{ __html: text }} className='translate' />{' '}
<button
type='button'
className='status__content__spoiler-link'
onClick={onClick}
aria-expanded={expanded}
>
{expanded ? (
<FormattedMessage id='status.show_less' defaultMessage='Show less' />
) : (
<FormattedMessage id='status.show_more' defaultMessage='Show more' />
)}
</button>
</p>
);
11 changes: 9 additions & 2 deletions app/javascript/flavours/glitch/styles/components.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1365,7 +1365,7 @@ body > [data-popper-placement] {
.status__content__spoiler-link {
display: inline-flex; // glitch: media icon in spoiler button
border-radius: 2px;
background: transparent;
background: $action-button-color; // glitch: design used in more places
border: 0;
color: $inverted-text-color;
font-weight: 700;
Expand All @@ -1378,7 +1378,8 @@ body > [data-popper-placement] {
align-items: center; // glitch: content indicator

&:hover {
background: lighten($ui-base-color, 33%);
// glitch: design used in more places
background: lighten($action-button-color, 7%);
text-decoration: none;
}

Expand Down Expand Up @@ -11219,6 +11220,12 @@ noscript {
}
}

/* glitch: used for CWs */
p {
font-size: 15px;
color: $darker-text-color;
}

&__content {
display: -webkit-box;
font-size: 15px;
Expand Down

0 comments on commit 4d75493

Please sign in to comment.