Skip to content

Commit

Permalink
refactor: fix lint (#510)
Browse files Browse the repository at this point in the history
  • Loading branch information
FoxtrotSierra6829 authored Dec 24, 2023
1 parent 06a6cc7 commit 9569eac
Show file tree
Hide file tree
Showing 24 changed files with 126 additions and 121 deletions.
12 changes: 6 additions & 6 deletions src/components/home/A320Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,15 +13,15 @@ export const A320Header = () => {
return (
<header>
<video
className="object-cover fixed -z-10 w-screen h-screen opacity-10"
className="fixed -z-10 h-screen w-screen object-cover opacity-10"
src="https://cdn.flybywiresim.com/assets/website/video/A32NX.mp4"
playsInline
autoPlay
muted
loop
/>
<Container className="relative max-w-6xl min-h-screen">
<div className="absolute bottom-0 left-0 h-2/3 px-page">
<Container className="relative min-h-screen max-w-6xl">
<div className="px-page absolute bottom-0 left-0 h-2/3">
<h1 className="text-8xl font-bold">
<span className="text-teal">A32</span>
<span className="text-blue">N</span>
Expand All @@ -31,17 +31,17 @@ export const A320Header = () => {
A community built and maintained project aiming to provide high quality and detailed aircraft
for Microsoft Flight Simulator.
</p>
<div className="flex gap-4 my-5 max-w-md">
<div className="my-5 flex max-w-md gap-4">
<Button
onClick={handleClick}
className="w-40 hover:text-blue-light bg-blue-light hover:bg-white border-2 border-blue-light"
className="w-40 border-2 border-blue-light bg-blue-light hover:bg-white hover:text-blue-light"
>
Installer
</Button>

<Link href="/a32nx">
<Button
className="w-44 text-blue-light hover:text-blue-light hover:bg-white border-2 border-blue-light"
className="w-44 border-2 border-blue-light text-blue-light hover:bg-white hover:text-blue-light"
>
Learn More
</Button>
Expand Down
16 changes: 8 additions & 8 deletions src/components/home/Community.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,15 +49,15 @@ export const Community = () => {
return () => clearInterval(interval);
}, []);
return (
<section id="community" className="flex flex-col justify-between items-center text-blue-dark-contrast bg-gray-50 lg:flex-row">
<Container className="flex flex-col py-12 max-w-6xl lg:px-24">
<span className="mb-3 w-24 h-2 bg-teal-light-contrast rounded-full" />
<section id="community" className="flex flex-col items-center justify-between bg-gray-50 text-blue-dark-contrast lg:flex-row">
<Container className="flex max-w-6xl flex-col py-12 lg:px-24">
<span className="mb-3 h-2 w-24 rounded-full bg-teal-light-contrast" />
<h1>Community Insights</h1>
<p className="max-w-prose text-gray-800">
Discover the extensive community behind every FlyByWire Simulations aircraft - a vibrant and active online group that prioritises collaborative work and openness.
</p>

<div className="grid grid-cols-2 gap-y-8 my-6 sm:grid-cols-4">
<div className="my-6 grid grid-cols-2 gap-y-8 sm:grid-cols-4">
<Statistic statCount={liveFlights} statName="Live Flights" />
<Statistic statCount={commitCount} statName="Commits" />
<Statistic statCount={contributorCount} statName="Contributors" />
Expand All @@ -67,7 +67,7 @@ export const Community = () => {
<div className="my-8">
<Card bgColour="gray-100" className="border-discord shadow-lg">
<CardTitle>
<span className="flex justify-center items-center p-2 mr-2 bg-discord rounded-xl">
<span className="mr-2 flex items-center justify-center rounded-xl bg-discord p-2">
<Image src="/svg/discordLogo.svg" width={23} height={23} />
</span>
Discord
Expand All @@ -78,18 +78,18 @@ export const Community = () => {
</CardBody>

<a
className="self-center py-2 px-3 text-xl font-semibold text-white bg-discord hover:bg-discord-dark rounded-xl transition"
className="self-center rounded-xl bg-discord px-3 py-2 text-xl font-semibold text-white transition hover:bg-discord-dark"
href="https://discord.gg/flybywire"
target="_blank"
rel="noreferrer"
>
Join the Community
<IconArrowRight className="inline-flex mb-1 ml-1" size={20} stroke={2} />
<IconArrowRight className="mb-1 ml-1 inline-flex" size={20} stroke={2} />
</a>
</Card>
</div>
</Container>
<div className="relative z-10 w-full h-144 lg:w-1/2 lg:h-200">
<div className="relative z-10 h-144 w-full lg:h-200 lg:w-1/2">
<MapDisplay refreshInterval={mapRefreshInterval} disableMenu disableWeather={false} disableScroll forceTileset="carto-light" />
</div>
</section>
Expand Down
10 changes: 5 additions & 5 deletions src/components/home/Donate.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ import Container from '../utils/Container';
export const Donate = () => (
<section className="bg-blue-darker">
<div className="relative">
<img className="object-cover absolute w-full h-full opacity-10" src="/img/donate.jpg" alt="" />
<img className="absolute h-full w-full object-cover opacity-10" src="/img/donate.jpg" alt="" />

<Container className="flex relative top-0 flex-col items-center py-12 max-w-7xl lg:items-start">
<Container className="relative top-0 flex max-w-7xl flex-col items-center py-12 lg:items-start">
<div className="max-w-4xl text-center lg:text-left">
<h1 className="text-teal">Donate</h1>
<p>
Expand All @@ -17,13 +17,13 @@ export const Donate = () => (
We use Open Collective to transparently manage our donations and expenses, which means you can see how we utilize donated funds at any time.
</p>
</div>
<div className="flex flex-col items-center space-y-3 space-x-4 text-center md:space-y-0 lg:flex-row lg:items-start lg:text-left">
<div className="flex flex-col items-center space-x-4 space-y-3 text-center md:space-y-0 lg:flex-row lg:items-start lg:text-left">
<a href="https://opencollective.com/flybywire/" target="_blank" rel="noreferrer">
<Button className="w-40 hover:text-teal-light-contrast bg-teal-light-contrast hover:bg-white border-2 border-teal-light-contrast">
<Button className="w-40 border-2 border-teal-light-contrast bg-teal-light-contrast hover:bg-white hover:text-teal-light-contrast">
Donate
</Button>
</a>
<em className="self-center max-w-prose text-teal-100">
<em className="max-w-prose self-center text-teal-100">
*No profit is generated from donations. Donating does not guarantee access to additional content nor its exclusivity if such content is ever given.
</em>
</div>
Expand Down
8 changes: 4 additions & 4 deletions src/components/home/Installer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@ import Container from '../utils/Container';
export const installerRef = createRef<HTMLDivElement>();

export const Installer = forwardRef(() => (
<section ref={installerRef} className="overflow-hidden py-12 bg-blue-dark">
<section ref={installerRef} className="overflow-hidden bg-blue-dark py-12">
<Container className="flex flex-col items-center 3xl:flex-row 3xl:justify-center">
<div className="mb-4 text-center 2xl:mr-12 3xl:text-left">
<IconPackage className="p-2 mx-auto mb-4 bg-blue-light-contrast rounded-xl 3xl:mx-0" size={55} stroke={1.5} />
<IconPackage className="mx-auto mb-4 rounded-xl bg-blue-light-contrast p-2 3xl:mx-0" size={55} stroke={1.5} />
<h1 className="font-extrabold">
Custom-built Installer
</h1>
Expand All @@ -20,12 +20,12 @@ export const Installer = forwardRef(() => (
proper folder.
</p>
<a href="https://api.flybywiresim.com/installer">
<Button className="mt-8 w-40 hover:text-teal-light-contrast bg-teal-light-contrast hover:bg-white border-2 border-teal-light-contrast">
<Button className="mt-8 w-40 border-2 border-teal-light-contrast bg-teal-light-contrast hover:bg-white hover:text-teal-light-contrast">
Download
</Button>
</a>
</div>
<div className="-mb-[125px] w-11/12 xl:w-5/6 3xl:-mb-3 3xl:w-320">
<div className="mb-[-125px] w-11/12 xl:w-5/6 3xl:-mb-3 3xl:w-320">
<Image
src="/img/InstallerScreenshot.png"
alt="Installer"
Expand Down
4 changes: 2 additions & 2 deletions src/components/home/PartnerSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export const PartnerImage = (props: ImageProps) => (
);

export const Partner = (props: PropsWithChildren<PartnerProps>) => (
<span id={props.name} className={`flex justify-center items-center ${props.className}`}>
<span id={props.name} className={`flex items-center justify-center ${props.className}`}>
<a href={props.path} target="_blank" rel="noreferrer">
{props.children}
</a>
Expand All @@ -27,7 +27,7 @@ export const Partner = (props: PropsWithChildren<PartnerProps>) => (

export const PartnerSection = () => (
<section className="bg-blue-dark">
<Container className="grid grid-cols-1 gap-x-16 max-w-screen-2xl md:grid-cols-2 lg:grid-cols-4">
<Container className="grid max-w-screen-2xl grid-cols-1 gap-x-16 md:grid-cols-2 lg:grid-cols-4">
<Partner name="Flightsim.to" path="https://flightsim.to/">
<PartnerImage src="/img/partners/flightsimto.png" />
</Partner>
Expand Down
42 changes: 21 additions & 21 deletions src/components/projects/A32NX/Download.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,12 @@ export const Download = ({ expOnHold }: { expOnHold?: boolean }) => {

return (
<section id="download" className="relative bg-blue-dark-contrast">
<div className="py-14 px-10 m-auto w-full lg:w-11/12 2xl:w-4/6">
<div className="m-auto w-full px-10 py-14 lg:w-11/12 2xl:w-4/6">
<div className="flex flex-col lg:flex-row">
<div className="w-full lg:pr-12 lg:w-3/5">
<div className="w-1/2 text-left divide-y divide-gray-500 2xl:w-1/4">
<h2 className="text-base font-medium tracking-widest text-blue-200 uppercase">READY TO FLY?</h2>
<p className="pt-3 mt-3 text-5xl font-medium text-blue-light">
<div className="w-full lg:w-3/5 lg:pr-12">
<div className="w-1/2 divide-y divide-gray-500 text-left 2xl:w-1/4">
<h2 className="text-base font-medium uppercase tracking-widest text-blue-200">READY TO FLY?</h2>
<p className="mt-3 pt-3 text-5xl font-medium text-blue-light">
Download
</p>
</div>
Expand All @@ -26,59 +26,59 @@ export const Download = ({ expOnHold }: { expOnHold?: boolean }) => {
or you can download using standalone installations.
</p>

<ul className="pt-7 pl-5 -m-2 text-lg list-disc text-gray-200">
<li className="pl-2 ml-2">Integrates seamlessly into Microsoft Flight Simulator - no external programs required.</li>
<li className="pl-2 ml-2">Safe, trustworthy, and constantly updated to assure nothing is broken.</li>
<li className="pl-2 ml-2">One click install, neatly organized into one compact folder.</li>
<ul className="-m-2 list-disc pl-5 pt-7 text-lg text-gray-200">
<li className="ml-2 pl-2">Integrates seamlessly into Microsoft Flight Simulator - no external programs required.</li>
<li className="ml-2 pl-2">Safe, trustworthy, and constantly updated to assure nothing is broken.</li>
<li className="ml-2 pl-2">One click install, neatly organized into one compact folder.</li>
</ul>
</div>
<div className="flex flex-col w-full divide-y divide-gray-500 lg:w-2/5">
<div className="flex w-full flex-col divide-y divide-gray-500 lg:w-2/5">
{/* Installer */}
<div className="pt-16 pb-8 lg:pt-0">
<div className="pb-8 pt-16 lg:pt-0">
<span className="text-4xl text-blue-100">Installer</span>

<p className="mt-4 mb-6 max-w-prose">
<p className="mb-6 mt-4 max-w-prose">
Our easy-to-use installer is the easiest way to get started with our addons. Simply launch and install any addon you want, with only two clicks.
</p>

<a href="https://api.flybywiresim.com/installer">
<Button className="float-right w-40 font-bold bg-green-500 hover:bg-green-700">Download</Button>
<Button className="float-right w-40 bg-green-500 font-bold hover:bg-green-700">Download</Button>
</a>
</div>

{/* Direct Download */}
<div className="pt-7">
<span className="text-2xl text-blue-100">Direct Download</span>
<p className="mt-4 mb-6 max-w-prose">
<p className="mb-6 mt-4 max-w-prose">
If you prefer a direct download, the following links are available.
</p>

<div className="divide-y divide-gray-700">
<div className="flex flex-row justify-between items-center mb-5">
<div className="mb-5 flex flex-row items-center justify-between">
<span className="text-xl text-gray-300">Stable Release</span>
<a href={getDownloadLink(urls.stable)}>
<Button className="float-right w-40 font-bold bg-green-500 hover:bg-green-700">Download</Button>
<Button className="float-right w-40 bg-green-500 font-bold hover:bg-green-700">Download</Button>
</a>
</div>
<div className="flex flex-row justify-between items-center pt-5 mb-5">
<div className="mb-5 flex flex-row items-center justify-between pt-5">
<span className="text-xl text-gray-300">Development Build</span>
<a href={getDownloadLink(urls.dev)}>
<Button className="float-right w-40 font-bold bg-blue-light-contrast hover:bg-blue-medium">Download</Button>
<Button className="float-right w-40 bg-blue-light-contrast font-bold hover:bg-blue-medium">Download</Button>
</a>
</div>
<div>
<div className="flex flex-row justify-between items-center pt-5 mb-8">
<div className="mb-8 flex flex-row items-center justify-between pt-5">
<span className="text-xl text-gray-300">Experimental Build</span>
<a href={expOnHold ? undefined : getDownloadLink(urls.exp)}>
<Button
className={`float-right w-40 font-bold bg-blue-light-contrast ${expOnHold ? 'opacity-30 cursor-not-allowed' : 'hover:bg-blue-medium'}`}
className={`float-right w-40 bg-blue-light-contrast font-bold ${expOnHold ? 'cursor-not-allowed opacity-30' : 'hover:bg-blue-medium'}`}
>
Download
</Button>
</a>
</div>
{expOnHold && (
<span className="flex-wrap mb-8 text-gray-300">
<span className="mb-8 flex-wrap text-gray-300">
Our Experimental Version is temporarily
<a href="https://docs.flybywiresim.com/fbw-a32nx/support/exp/" className="text-blue-light">&#32;on hold&#32;</a>
and all of its features have been moved to the Development Version.
Expand Down
18 changes: 9 additions & 9 deletions src/components/projects/A32NX/ExtendedFeatures.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,13 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faCheck } from '@fortawesome/free-solid-svg-icons';

export const ExtendedFeatures = () => (
<section className="py-4 pb-20 mx-auto max-w-screen-2xl rounded-lg sm:px-6 lg:px-8 px-page">
<div className="grid
<section className="px-page mx-auto max-w-screen-2xl rounded-lg py-4 pb-20 sm:px-6 lg:px-8">
<div className="mx-auto
grid
max-w-max
grid-cols-1
md:grid-cols-2
xl:grid-cols-3
2xl:grid-cols-4
max-w-max mx-auto gap-x-16 gap-y-20"
gap-x-16
gap-y-20 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4"
>
<Feature key="EFB">
<FeatureTitle>
Expand Down Expand Up @@ -88,8 +88,8 @@ export const ExtendedFeatures = () => (
);

const Feature: FC = ({ children }) => (
<div className="flex flex-row max-w-prose md:w-96">
<FontAwesomeIcon className="mt-1 mr-5 mb-auto text-2xl text-green-500" size="1x" icon={faCheck} />
<div className="flex max-w-prose flex-row md:w-96">
<FontAwesomeIcon className="mb-auto mr-5 mt-1 text-2xl text-green-500" size="1x" icon={faCheck} />
<div className="space-y-3">
{children}
</div>
Expand All @@ -101,7 +101,7 @@ const FeatureTitle: FC = ({ children }) => (
);

const FeatureBody: FC<{ className?: string }> = ({ children, className }) => (
<p className={`text-lg text-left ${className}`}>
<p className={`text-left text-lg ${className}`}>
{children}
</p>
);
Loading

0 comments on commit 9569eac

Please sign in to comment.