Lint files based on updated rules

This commit is contained in:
jeffvli 2023-09-15 20:42:38 -07:00
parent d45b01625b
commit ec457d5125
57 changed files with 153 additions and 150 deletions

View file

@ -17,8 +17,8 @@ const SearchItem = styled.button`
all: unset;
box-sizing: border-box !important;
padding: 0.5rem;
border-radius: 5px;
cursor: pointer;
border-radius: 5px;
&:hover,
&:focus-visible {

View file

@ -10,12 +10,14 @@ interface LyricLineProps extends ComponentPropsWithoutRef<'div'> {
}
const StyledText = styled(TextTitle)<TitleProps & { $alignment: string; $fontSize: number }>`
color: var(--main-fg);
font-weight: 600;
text-align: ${(props) => props.$alignment};
font-size: ${(props) => props.$fontSize}px;
opacity: 0.5;
padding: 0 1rem;
font-size: ${(props) => props.$fontSize}px;
font-weight: 600;
color: var(--main-fg);
text-align: ${(props) => props.$alignment};
opacity: 0.5;
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
&.active {
opacity: 1;
@ -24,8 +26,6 @@ const StyledText = styled(TextTitle)<TitleProps & { $alignment: string; $fontSiz
&.unsynchronized {
opacity: 1;
}
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
`;
export const LyricLine = ({ text, alignment, fontSize, ...props }: LyricLineProps) => {

View file

@ -65,8 +65,8 @@ const ScrollContainer = styled(motion.div)`
mask-image: linear-gradient(
180deg,
transparent 5%,
rgba(0, 0, 0, 100%) 20%,
rgba(0, 0, 0, 100%) 85%,
rgb(0 0 0 / 100%) 20%,
rgb(0 0 0 / 100%) 85%,
transparent 95%
);

View file

@ -28,12 +28,12 @@ const SynchronizedLyricsContainer = styled.div<{ $gap: number }>`
mask-image: linear-gradient(
180deg,
transparent 5%,
rgba(0, 0, 0, 100%) 20%,
rgba(0, 0, 0, 100%) 85%,
rgb(0 0 0 / 100%) 20%,
rgb(0 0 0 / 100%) 85%,
transparent 95%
);
@media screen and (max-width: 768px) {
@media screen and (width <= 768px) {
padding: 5vh 0;
}
`;

View file

@ -21,12 +21,12 @@ const UnsynchronizedLyricsContainer = styled.div<{ $gap: number }>`
mask-image: linear-gradient(
180deg,
transparent 5%,
rgba(0, 0, 0, 100%) 20%,
rgba(0, 0, 0, 100%) 85%,
rgb(0 0 0 / 100%) 20%,
rgb(0 0 0 / 100%) 85%,
transparent 95%
);
@media screen and (max-width: 768px) {
@media screen and (width <= 768px) {
padding: 5vh 0;
}
`;