feat: WCAG AA accessibility, code splitting, responsive ads layout
- Add React.lazy code splitting for all 15 tool pages - Fix WCAG AA contrast issues (304 text color fixes) - Add ARIA labels and aria-expanded to navigation buttons - Add aria-live for error announcements in tools - Implement responsive ad layout: - Desktop (≥1280px): Right sidebar with 3 ad units - Tablet (1024-1279px): Bottom section with 3 horizontal units - Mobile (<1024px): Fixed bottom banner - Add TabletAdSection component for tablet ad placement - Integrate Onidel affiliate partnership - Update all Adsterra domains to solutionbiologyisle.com - Add release notes for 2026-02-18 updates
This commit is contained in:
27
src/components/TabletAdSection.js
Normal file
27
src/components/TabletAdSection.js
Normal file
@@ -0,0 +1,27 @@
|
||||
import React from 'react';
|
||||
import AdBlock from './AdBlock';
|
||||
import OfferBlock from './OfferBlock';
|
||||
import AffiliateBlock from './AffiliateBlock';
|
||||
|
||||
const TabletAdSection = () => {
|
||||
return (
|
||||
<div className="hidden lg:flex xl:hidden flex-col mt-8 pt-6 border-t border-gray-200 dark:border-gray-700">
|
||||
<h3 className="text-sm font-medium text-gray-600 dark:text-gray-600 mb-4 text-center">
|
||||
Sponsored
|
||||
</h3>
|
||||
<div className="flex justify-center gap-4 overflow-x-auto pb-4">
|
||||
<div className="flex-shrink-0">
|
||||
<AdBlock adKey="7c55aebcdd74f6e9a8dc24bd13e7d949" adDomain="solutionbiologyisle.com" />
|
||||
</div>
|
||||
<div className="flex-shrink-0">
|
||||
<OfferBlock />
|
||||
</div>
|
||||
<div className="flex-shrink-0">
|
||||
<AffiliateBlock />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TabletAdSection;
|
||||
Reference in New Issue
Block a user