Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: move configurations to a meetup.config #4

Merged
merged 4 commits into from
Dec 21, 2024
Merged

chore: move configurations to a meetup.config #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8684351
chore: move configurations to a `meetup.config`
brionmario Dec 21, 2024
99ac434
chore: update lock file
brionmario Dec 21, 2024
93c0377
chore: fix height issues
brionmario Dec 21, 2024
99e6feb
chore: remove husky
brionmario Dec 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 35 additions & 1 deletion .eslintrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/**
* MIT License
*
* Copyright (c) 2024, Brion Mario
* Copyright (c) 2024, JavaScript Colombo
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
Expand All @@ -22,11 +22,45 @@
* SOFTWARE.
*/

const LICENSE_HEADER_DEFAULT_PATTERN = [
'*',
' * MIT License',
' *',
{
pattern: ' Copyright \\(c\\) \\d{4}, JavaScript Colombo',
template: ` * Copyright (c) ${new Date().getFullYear()}, JavaScript Colombo`,
},
' *',
' * Permission is hereby granted, free of charge, to any person obtaining a copy',
' * of this software and associated documentation files (the "Software"), to deal',
' * in the Software without restriction, including without limitation the rights',
' * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell',
' * copies of the Software, and to permit persons to whom the Software is',
' * furnished to do so, subject to the following conditions:',
' *',
' * The above copyright notice and this permission notice shall be included in all',
' * copies or substantial portions of the Software.',
' *',
' * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR',
' * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,',
' * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE',
' * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER',
' * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,',
' * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE',
' * SOFTWARE.',
' ',
];

module.exports = {
env: {
es6: true,
node: true,
},
extends: ['turbo', 'plugin:@brionmario/internal', 'plugin:@brionmario/prettier'],
plugins: ['@brionmario'],
rules: {
// Enforce JavaScript Colombo's license header.
// https://github.com/Stuk/eslint-plugin-header
'header/header': ['warn', 'block', LICENSE_HEADER_DEFAULT_PATTERN, 2],
},
};
1 change: 0 additions & 1 deletion .husky/commit-msg
View file
Open in desktop

This file was deleted.

Empty file removed .husky/pre-commit
View file
Open in desktop
Empty file.
4 changes: 0 additions & 4 deletions .husky/prepare-commit-msg
View file
Open in desktop

This file was deleted.

1 change: 1 addition & 0 deletions apps/www/.eslintrc.cjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ module.exports = {
'plugin:@brionmario/prettier',
'plugin:@brionmario/next',
'plugin:react/jsx-runtime',
'../../.eslintrc.js'
],
parserOptions: {
project: [path.resolve(__dirname, 'tsconfig.json')],
Expand Down
32 changes: 21 additions & 11 deletions apps/www/app/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,10 @@
import type {Metadata} from 'next';
import {ReactElement} from 'react';
import ThemeProvider from '@/components/ThemeProvider';
import './globals.scss';
import './custom.scss';
import {inter, spaceGrotesk} from './fonts';
import useMeetupConfig from '@/hooks/useMeetupConfig';
import './custom.scss';
import './globals.scss';

export const metadata: Metadata = {
title: 'JavaScript Colombo',
Expand All @@ -39,14 +40,23 @@ const RootLayout = ({
children,
}: Readonly<{
children: React.ReactNode;
}>): ReactElement => (
<html lang="en">
<body className={`${spaceGrotesk.className} ${inter.className}`}>
<ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
{children}
</ThemeProvider>
</body>
</html>
);
}>): ReactElement => {
const {config} = useMeetupConfig();

return (
<html lang="en">
<body className={`${spaceGrotesk.className} ${inter.className}`}>
<ThemeProvider
attribute="class"
defaultTheme={config.theme.defaultTheme}
enableSystem
disableTransitionOnChange
>
{children}
</ThemeProvider>
</body>
</html>
);
};

export default RootLayout;
4 changes: 2 additions & 2 deletions apps/www/app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,13 +50,13 @@ export default function Home(): ReactElement {
<div dir="ltr">
<NavBar items={[]} />
<div className="mx-auto flex">
<div className="overflow-x-hidden w-full">
<div className="overflow-x-hidden w-full" style={{height: 'calc(100vh - 89px)'}}>
<main className="relative">
<Hero />
<Footer />
</main>
</div>
</div>
<Footer />
</div>
);
}
131 changes: 69 additions & 62 deletions apps/www/components/FlipWords.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,15 +24,20 @@

'use client';

import React, {useCallback, useEffect, useRef, useState} from 'react';
import React, {PropsWithChildren, useCallback, useEffect, useRef, useState} from 'react';
import {AnimatePresence, motion, LayoutGroup} from 'framer-motion';
import {cn} from '@/lib/utils';

const FlipWords = ({words, duration = 3000, className}: {className?: string; duration?: number; words: string[]}) => {
export interface FlipWordsProps {
className?: string;
duration?: number;
words: string[];
}

const FlipWords = ({words, duration = 3000, className, children}: PropsWithChildren<FlipWordsProps>) => {
const [currentWord, setCurrentWord] = useState(words[0]);
const [isAnimating, setIsAnimating] = useState<boolean>(false);

// thanks for the fix Julian - https://github.com/Julian-AT
const startAnimation = useCallback(() => {
const word = words[words.indexOf(currentWord) + 1] || words[0];
setCurrentWord(word);
Expand All @@ -47,67 +52,69 @@ const FlipWords = ({words, duration = 3000, className}: {className?: string; dur
}, [isAnimating, duration, startAnimation]);

return (
<AnimatePresence
onExitComplete={() => {
setIsAnimating(false);
}}
>
<motion.div
initial={{
opacity: 0,
y: 10,
}}
animate={{
opacity: 1,
y: 0,
}}
transition={{
type: 'spring',
stiffness: 100,
damping: 10,
}}
exit={{
opacity: 0,
y: -40,
x: 40,
filter: 'blur(8px)',
scale: 2,
position: 'absolute',
<>
<AnimatePresence
onExitComplete={() => {
setIsAnimating(false);
}}
className={cn('z-10 inline-block relative text-left px-2', className)}
key={currentWord}
>
{/* edit suggested by Sajal: https://x.com/DewanganSajal */}
{currentWord.split(' ').map((word, wordIndex) => (
<motion.span
key={word + wordIndex}
initial={{opacity: 0, y: 10, filter: 'blur(8px)'}}
animate={{opacity: 1, y: 0, filter: 'blur(0px)'}}
transition={{
delay: wordIndex * 0.3,
duration: 0.3,
}}
className="inline-block whitespace-nowrap"
>
{word.split('').map((letter, letterIndex) => (
<motion.span
key={word + letterIndex}
initial={{opacity: 0, y: 10, filter: 'blur(8px)'}}
animate={{opacity: 1, y: 0, filter: 'blur(0px)'}}
transition={{
delay: wordIndex * 0.3 + letterIndex * 0.05,
duration: 0.2,
}}
className="inline-block"
>
{letter}
</motion.span>
))}
<span className="inline-block">&nbsp;</span>
</motion.span>
))}
</motion.div>
</AnimatePresence>
<motion.div
initial={{
opacity: 0,
y: 10,
}}
animate={{
opacity: 1,
y: 0,
}}
transition={{
type: 'spring',
stiffness: 100,
damping: 10,
}}
exit={{
opacity: 0,
y: -40,
x: 40,
filter: 'blur(8px)',
scale: 2,
position: 'absolute',
}}
className={cn('z-10 inline-block relative text-left px-2', className)}
key={currentWord}
>
{currentWord.split(' ').map((word, wordIndex) => (
<motion.span
key={word + wordIndex}
initial={{opacity: 0, y: 10, filter: 'blur(8px)'}}
animate={{opacity: 1, y: 0, filter: 'blur(0px)'}}
transition={{
delay: wordIndex * 0.3,
duration: 0.3,
}}
className="inline-block whitespace-nowrap"
>
{word.split('').map((letter, letterIndex) => (
<motion.span
key={word + letterIndex}
initial={{opacity: 0, y: 10, filter: 'blur(8px)'}}
animate={{opacity: 1, y: 0, filter: 'blur(0px)'}}
transition={{
delay: wordIndex * 0.3 + letterIndex * 0.05,
duration: 0.2,
}}
className="inline-block"
>
{letter}
</motion.span>
))}
<span className="inline-block">&nbsp;</span>
</motion.span>
))}
</motion.div>
{children}
</AnimatePresence>
</>
);
};

Expand Down
58 changes: 32 additions & 26 deletions apps/www/components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,39 +27,45 @@ import {cn} from '@/lib/utils';
import {TestableComponent} from '@/types/dom';
import {ExternalLink, GithubIcon, Heart} from 'lucide-react';
import WSO2 from '@/icons/WSO2';
import useMeetupConfig from '@/hooks/useMeetupConfig';

export type FooterProps = HTMLAttributes<HTMLDivElement> & TestableComponent;

const Footer: ForwardRefExoticComponent<FooterProps & RefAttributes<HTMLDivElement>> = forwardRef<
HTMLDivElement,
FooterProps
>(({className, ...rest}: FooterProps, ref: ForwardedRef<HTMLDivElement>) => (
<footer className={cn('footer', className)} ref={ref} {...rest}>
<div className="container mx-auto py-4">
<p className="text-center text-sm text-gray-600 dark:text-gray-400">
&copy; {new Date().getFullYear()} JavaScript Colombo. All rights reserved.
</p>
<div className="mt-4 text-center">
<p className="text-sm text-gray-600 dark:text-gray-400 flex items-center justify-center gap-1">
<Heart width={16} height={16} stroke="#c96198" />
<span>Sponsored by</span>
<a href="https://wso2.com" className="text-blue-500 hover:underline">
<WSO2 height={20} width={40} />
</a>
>(({className, ...rest}: FooterProps, ref: ForwardedRef<HTMLDivElement>) => {
const {config} = useMeetupConfig();

return (
<footer className={cn('footer', className)} ref={ref} {...rest}>
<div className="container mx-auto py-4">
<p className="text-center text-sm text-gray-600 dark:text-gray-400">
&copy; {new Date().getFullYear()} JavaScript Colombo. All rights reserved.
</p>
<div className="mt-4 text-center">
<p className="text-sm text-gray-600 dark:text-gray-400 flex items-center justify-center gap-1">
<Heart width={16} height={16} stroke="#c96198" />
<span>Sponsored by</span>
<a href={config.sponsor.mainSponsor.website} className="text-blue-500 hover:underline" target="_blank">
{config.sponsor.mainSponsor.name}
</a>
</p>
</div>
<div className="mt-4 text-center">
<a
href={config.links.source.github.url}
target={config.links.source.github.target}
className="text-sm text-gray-600 dark:text-gray-400 flex items-center justify-center gap-1 hover:underline"
>
<GithubIcon width={16} height={16} />
<span>Source Code</span>
<ExternalLink width={16} height={16} />
</a>
</div>
</div>
<div className="mt-4 text-center">
<a
href="https://github.com/javascript-colombo/javascriptcolombo.com"
className="text-sm text-gray-600 dark:text-gray-400 flex items-center justify-center gap-1 hover:underline"
>
<GithubIcon width={16} height={16} />
<span>Source Code</span>
<ExternalLink width={16} height={16} />
</a>
</div>
</div>
</footer>
));
</footer>
);
});

export default Footer;
Loading
Loading