gnh1201/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2025-07-15 08:48:15 +00:00
Code Issues Actions 15 Packages Projects Releases Wiki Activity

Add icon to header of pinned posts carousel in web UI (#34869)
Some checks failed
Check i18n / check-i18n (push) Waiting to run
Details
CodeQL / Analyze (javascript) (push) Waiting to run
Details
CodeQL / Analyze (ruby) (push) Waiting to run
Details
Check formatting / lint (push) Waiting to run
Details
Ruby Testing / build (production) (push) Waiting to run
Details
Ruby Testing / build (test) (push) Waiting to run
Details
Ruby Testing / test (.ruby-version) (push) Blocked by required conditions
Details
Ruby Testing / test (3.2) (push) Blocked by required conditions
Details
Ruby Testing / test (3.3) (push) Blocked by required conditions
Details
Ruby Testing / ImageMagick tests (.ruby-version) (push) Blocked by required conditions
Details
Ruby Testing / ImageMagick tests (3.2) (push) Blocked by required conditions
Details
Ruby Testing / ImageMagick tests (3.3) (push) Blocked by required conditions
Details
Ruby Testing / End to End testing (.ruby-version) (push) Blocked by required conditions
Details
Ruby Testing / End to End testing (3.2) (push) Blocked by required conditions
Details
Ruby Testing / End to End testing (3.3) (push) Blocked by required conditions
Details
Ruby Testing / Elastic Search integration testing (.ruby-version, docker.elastic.co/elasticsearch/elasticsearch:7.17.13) (push) Blocked by required conditions
Details
Ruby Testing / Elastic Search integration testing (.ruby-version, docker.elastic.co/elasticsearch/elasticsearch:8.10.2) (push) Blocked by required conditions
Details
Ruby Testing / Elastic Search integration testing (.ruby-version, opensearchproject/opensearch:2) (push) Blocked by required conditions
Details
Ruby Testing / Elastic Search integration testing (3.2, docker.elastic.co/elasticsearch/elasticsearch:7.17.13) (push) Blocked by required conditions
Details
Ruby Testing / Elastic Search integration testing (3.3, docker.elastic.co/elasticsearch/elasticsearch:7.17.13) (push) Blocked by required conditions
Details
CSS Linting / lint (push) Has been cancelled
Details
JavaScript Linting / lint (push) Has been cancelled
Details
JavaScript Testing / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Eugen Rochko 2025-05-31 00:24:34 +02:00 committed by GitHub
parent 1cc853059f
commit 44d71d59ef
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/javascript/mastodon/components/featured_carousel.tsx
View File

@ -5,6 +5,7 @@ import {
useLayoutEffect, useLayoutEffect,
useRef, useRef,
useState, useState,
useId,
} from 'react'; } from 'react';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
@ -17,12 +18,14 @@ import { animated, useSpring } from '@react-spring/web';
import { useDrag } from '@use-gesture/react'; import { useDrag } from '@use-gesture/react';
import { expandAccountFeaturedTimeline } from '@/mastodon/actions/timelines'; import { expandAccountFeaturedTimeline } from '@/mastodon/actions/timelines';
import { Icon } from '@/mastodon/components/icon';
import { IconButton } from '@/mastodon/components/icon_button'; import { IconButton } from '@/mastodon/components/icon_button';
import StatusContainer from '@/mastodon/containers/status_container'; import StatusContainer from '@/mastodon/containers/status_container';
import { usePrevious } from '@/mastodon/hooks/usePrevious'; import { usePrevious } from '@/mastodon/hooks/usePrevious';
import { useAppDispatch, useAppSelector } from '@/mastodon/store'; import { useAppDispatch, useAppSelector } from '@/mastodon/store';
import ChevronLeftIcon from '@/material-icons/400-24px/chevron_left.svg?react'; import ChevronLeftIcon from '@/material-icons/400-24px/chevron_left.svg?react';
import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react'; import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react';
import PushPinIcon from '@/material-icons/400-24px/push_pin.svg?react';
const messages = defineMessages({ const messages = defineMessages({
previous: { id: 'featured_carousel.previous', defaultMessage: 'Previous' }, previous: { id: 'featured_carousel.previous', defaultMessage: 'Previous' },
@ -38,6 +41,7 @@ export const FeaturedCarousel: React.FC<{
tagged?: string; tagged?: string;
}> = ({ accountId, tagged }) => { }> = ({ accountId, tagged }) => {
const intl = useIntl(); const intl = useIntl();
const accessibilityId = useId();
// Load pinned statuses // Load pinned statuses
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
@ -120,11 +124,15 @@ export const FeaturedCarousel: React.FC<{
className='featured-carousel' className='featured-carousel'
{...bind()} {...bind()}
aria-roledescription='carousel' aria-roledescription='carousel'
aria-labelledby='featured-carousel-title' aria-labelledby={`${accessibilityId}-title`}
role='region' role='region'
> >
<div className='featured-carousel__header'> <div className='featured-carousel__header'>
<h4 className='featured-carousel__title' id='featured-carousel-title'> <h4
className='featured-carousel__title'
id={`${accessibilityId}-title`}
>
<Icon id='thumb-tack' icon={PushPinIcon} />
<FormattedMessage <FormattedMessage
id='featured_carousel.header' id='featured_carousel.header'
defaultMessage='{count, plural, one {Pinned Post} other {Pinned Posts}}' defaultMessage='{count, plural, one {Pinned Post} other {Pinned Posts}}'

8
app/javascript/styles/mastodon/components.scss
View File

@ -11074,5 +11074,13 @@ noscript {
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
text-transform: uppercase; text-transform: uppercase;
display: flex;
align-items: center;
gap: 4px;
.icon {
width: 16px;
height: 16px;
}
} }
} }