amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-24 04:33:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

mobile fixes for marquee

Browse Source
This commit is contained in:
Dan Lebo
2023-02-15 15:55:29 -08:00
parent 2cc8295e97
commit f5250af8ed
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
beta/src/components/Layout/HomeContent.js
View File

@@ -445,7 +445,9 @@ function CommunityImages() {
return (
<>
{images.map((src, i) => (
<div key={i} className="flex justify-center px-2.5 lg:px-5 min-w-[25%]">
<div
key={i}
className="flex justify-center px-2.5 lg:px-5 min-w-[50%] lg:min-w-[25%]">
<img
src={src}
className={cn(

18
beta/tailwind.config.js
View File

@@ -74,10 +74,10 @@ module.exports = {
code: 'calc(1em - 20%)',
},
animation: {
marquee: 'marquee 60s linear infinite',
marquee2: 'marquee2 60s linear infinite',
'large-marquee': 'marquee 120s linear infinite',
'large-marquee2': 'marquee2 120s linear infinite',
marquee: 'marquee 40s linear infinite',
marquee2: 'marquee2 40s linear infinite',
'large-marquee': 'large-marquee 80s linear infinite',
'large-marquee2': 'large-marquee2 80s linear infinite',
},
keyframes: {
shimmer: {
@@ -97,9 +97,17 @@ module.exports = {
},
marquee: {
'0%': {transform: 'translateX(0%)'},
'100%': {transform: 'translateX(-200%)'},
'100%': {transform: 'translateX(-400%)'},
},
marquee2: {
'0%': {transform: 'translateX(400%)'},
'100%': {transform: 'translateX(0%)'},
},
'large-marquee': {
'0%': {transform: 'translateX(0%)'},
'100%': {transform: 'translateX(-200%)'},
},
'large-marquee2': {
'0%': {transform: 'translateX(200%)'},
'100%': {transform: 'translateX(0%)'},
},