Fix colors and typography on hashtag bar in web UI (#26666)
parent
92c9bf731d
commit
a4130c4139
|
@ -10,8 +10,8 @@ import { groupBy, minBy } from 'lodash';
|
||||||
|
|
||||||
import { getStatusContent } from './status_content';
|
import { getStatusContent } from './status_content';
|
||||||
|
|
||||||
// About two lines on desktop
|
// Fit on a single line on desktop
|
||||||
const VISIBLE_HASHTAGS = 7;
|
const VISIBLE_HASHTAGS = 3;
|
||||||
|
|
||||||
// Those types are not correct, they need to be replaced once this part of the state is typed
|
// Those types are not correct, they need to be replaced once this part of the state is typed
|
||||||
export type TagLike = Record<{ name: string }>;
|
export type TagLike = Record<{ name: string }>;
|
||||||
|
@ -210,7 +210,7 @@ const HashtagBar: React.FC<{
|
||||||
|
|
||||||
const revealedHashtags = expanded
|
const revealedHashtags = expanded
|
||||||
? hashtags
|
? hashtags
|
||||||
: hashtags.slice(0, VISIBLE_HASHTAGS - 1);
|
: hashtags.slice(0, VISIBLE_HASHTAGS);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='hashtag-bar'>
|
<div className='hashtag-bar'>
|
||||||
|
|
|
@ -9308,19 +9308,24 @@ noscript {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
line-height: 18px;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
|
color: $darker-text-color;
|
||||||
|
|
||||||
a {
|
a {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
color: $dark-text-color;
|
color: inherit;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
&:hover {
|
&:hover span {
|
||||||
text-decoration: none;
|
|
||||||
|
|
||||||
span {
|
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.link-button {
|
||||||
|
color: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
padding: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue