info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-09-02 22:02:39 +02:00
Code Issues Releases Wiki Activity

Update announcement banner

Browse Source
This commit is contained in:
Kamran Ahmed
2024-08-21 17:02:13 +01:00
parent 37f2b75e07
commit f06ccc5c37
1 changed files with 5 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/FeatureAnnouncement.tsx
View File

@@ -1,6 +1,6 @@
import { useState } from 'react'; import { useState } from 'react';
import { Modal } from './Modal.tsx'; import { Modal } from './Modal.tsx';
import { PartyPopper } from 'lucide-react'; import {PartyPopper, Play, PlayCircle} from 'lucide-react';
import { isMobileScreen } from '../lib/is-mobile.ts'; import { isMobileScreen } from '../lib/is-mobile.ts';
type FeatureAnnouncementProps = {}; type FeatureAnnouncementProps = {};
@@ -41,13 +41,11 @@ export function FeatureAnnouncement(props: FeatureAnnouncementProps) {
paddingBottom: '56.25%', paddingBottom: '56.25%',
height: 0, height: 0,
overflow: 'hidden', overflow: 'hidden',
width: '300%',
left: '-100%',
}} }}
> >
{/*https://www.youtube.com/embed/?playsinline=1&disablekb=1&&iv_load_policy=3&cc_load_policy=0&controls=0&rel=0&autoplay=1&mute=1&origin=https%3A%2F%2Fytch.xyz&widgetid=1*/} {/*https://www.youtube.com/embed/?playsinline=1&disablekb=1&&iv_load_policy=3&cc_load_policy=0&controls=0&rel=0&autoplay=1&mute=1&origin=https%3A%2F%2Fytch.xyz&widgetid=1*/}
<iframe <iframe
src="https://www.youtube.com/embed/9lS3slfJ0x0?start=31&autoplay=1&disablekb=1&rel=0&cc_load_policy=0&controls=0&rel=0&autoplay=1&origin=https%3A%2F%2Froadmap.sh&widgetid=1&showinfo=0" src="https://www.youtube.com/embed/9lS3slfJ0x0?start=31&autoplay=1&disablekb=1&rel=0&cc_load_policy=0&rel=0&autoplay=1&origin=https%3A%2F%2Froadmap.sh&widgetid=1&showinfo=0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen allowFullScreen
style={{ style={{
@@ -68,19 +66,12 @@ export function FeatureAnnouncement(props: FeatureAnnouncementProps) {
<button <button
className="rounded-md border border-dashed border-purple-600 px-3 py-1.5 text-purple-400 transition-colors hover:border-purple-400 hover:text-purple-200" className="rounded-md border border-dashed border-purple-600 px-3 py-1.5 text-purple-400 transition-colors hover:border-purple-400 hover:text-purple-200"
onClick={() => { onClick={() => {
if (isMobileScreen()) {
window.open(
'https://www.youtube.com/watch?v=9lS3slfJ0x0',
'_blank',
);
return;
}
setIsPlaying(true); setIsPlaying(true);
}} }}
> >
<span className="relative -top-[1px] mr-1 text-xs font-semibold uppercase text-white"> <span className="relative sm:-top-[1px] mr-1 text-xs font-semibold uppercase text-white">
New <PlayCircle className="inline-block h-4 w-4 relative -top-[2px] mr-1" />
Watch
</span>{' '} </span>{' '}
<span className={'hidden sm:inline'}> <span className={'hidden sm:inline'}>
Practice your skills with projects Practice your skills with projects