saulteafarmer/plebdevs
1
0
Fork 0
mirror of https://github.com/AustinKelsay/plebdevs.git synced 2025-04-22 16:51:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix max width on hero statement for mobile

Browse Source
This commit is contained in:
austinkelsay 2024-10-11 16:03:43 -05:00
parent 3075b28272
commit 2282819ac5
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/banner/HeroBanner.js
View File

@ -14,10 +14,10 @@ const HeroBanner = () => {
const [isAnimating, setIsAnimating] = useState(false);
const techs = ['Bitcoin', 'Lightning', 'Nostr'];
const windowWidth = useWindowWidth();
const isTabView = windowWidth <= 1360;
const router = useRouter();
const { returnImageProxy } = useImageProxy();
const isTabView = windowWidth <= 1360;
const isMobile = windowWidth <= 800;
const isWideScreen = windowWidth >= 2200;
const isSuperWideScreen = windowWidth >= 2600;
@ -81,7 +81,7 @@ const HeroBanner = () => {
)}
<div className={`absolute inset-0 flex flex-col justify-center ${isTabView ? 'items-center text-center' : 'items-start pl-12'}`}>
<h1 className={`text-4xl sm:text-4xl lg:text-6xl font-bold leading-tight mb-6 ${isTabView ? 'px-4 max-w-[50%]' : ''}`}>
<h1 className={`text-4xl sm:text-4xl lg:text-6xl font-bold leading-tight mb-6 ${isTabView ? 'px-4' : 'max-w-[50%]'}`}>
<span className="block">Learn to code</span>
<span className={`block ${getColorClass(currentTech)} transition-opacity duration-500 ${isAnimating ? 'opacity-0' : 'opacity-100'}`}>
Build {currentTech} apps