diff --git a/index.html b/index.html index 0a1dccf7..03e45e0b 100644 --- a/index.html +++ b/index.html @@ -37,6 +37,49 @@ } })(window.location); + +
diff --git a/src/assets/image/channel_talk.svg b/src/assets/image/channel_talk.svg new file mode 100644 index 00000000..7ba6c248 --- /dev/null +++ b/src/assets/image/channel_talk.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/components/Floating/Floating.tsx b/src/components/Floating/Floating.tsx index b3547f16..6e39a663 100644 --- a/src/components/Floating/Floating.tsx +++ b/src/components/Floating/Floating.tsx @@ -3,24 +3,16 @@ import { linkPaths, iconPaths } from './const'; interface FloatingIconProps { icon: 'kakao' | 'insta' | 'youtube'; fill?: string; - size?: string; viewBox: string; path: 'kakaoLink' | 'instaLink' | 'youtubeLink'; } -const FloatingIcon = ({ icon, fill = '#ffffff', size = '34px', viewBox, path }: FloatingIconProps) => ( +const FloatingIcon = ({ icon, fill = '#ffffff', viewBox, path }: FloatingIconProps) => ( - + @@ -30,4 +22,4 @@ export const KakaoFloating = () => ; -export const YoutubeFloating = () => ; +export const YoutubeFloating = () => ; diff --git a/src/pages/main/containers/CounselBtn.tsx b/src/pages/main/containers/CounselBtn.tsx new file mode 100644 index 00000000..42de018e --- /dev/null +++ b/src/pages/main/containers/CounselBtn.tsx @@ -0,0 +1,22 @@ +import Channel from '@/assets/image/channel_talk.svg'; +import { InstaFloating, KakaoFloating, YoutubeFloating } from '@/components/Floating/Floating'; +import { Spacing } from '@/components/Spacing'; + +export function CounselBtn() { + return ( +
+
+ + + + + + + + +
+
+ ); +} diff --git a/src/pages/main/page.tsx b/src/pages/main/page.tsx index f64b9f59..ce2dbe6f 100644 --- a/src/pages/main/page.tsx +++ b/src/pages/main/page.tsx @@ -5,6 +5,7 @@ import PetitionSection from './containers/PetitionSection'; import { Spacing } from '@/components/Spacing'; import LostArticleSection from './containers/LostArticleSection'; import CampusMapSection from './containers/CampusMapSection'; +import { CounselBtn } from './containers/CounselBtn'; export function MainPage() { return ( @@ -12,6 +13,8 @@ export function MainPage() {
+ +