Skip to content

Commit 33dbdef

Browse files
durumi99durumi99
authored
Merge pull request #295 from FunD-StockProject/develop
V3.12 배포
2 parents a76c8c1 + 27d7d00 commit 33dbdef

File tree

9 files changed

+161
-9
lines changed

9 files changed

+161
-9
lines changed

‎src/components/Event/Disquiet.Style.ts‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
import { keyframes } from '@emotion/react';
2+
import styled from '@emotion/styled';
3+
import { media, theme } from '@styles/themes';
4+
5+
const shiny = keyframes({
6+
['0%, 45%']: {
7+
right: 250,
8+
},
9+
['55%, 100%']: {
10+
right: -70,
11+
},
12+
});
13+
14+
const elevator = keyframes({
15+
['0%']: {
16+
transform: 'translateY(200%)',
17+
},
18+
['5%, 95%']: {
19+
transform: 'translateY(0%)',
20+
},
21+
['100%']: {
22+
transform: 'translateY(-200%)',
23+
},
24+
});
25+
26+
export const DisquietViewStyled = styled.div({
27+
position: 'absolute',
28+
top: 0,
29+
right: 300,
30+
height: '100%',
31+
width: '30%',
32+
background:
33+
'linear-gradient(100deg, transparent 30%, rgba(255, 208, 67, 0.8) 40%, rgba(112, 179, 255, 0.6) 50%, transparent 60%)',
34+
filter: 'brightness(1.5) opacity(0.5) blur(2px)',
35+
mixBlendMode: 'color-dodge',
36+
animation: shiny + ' 12s ease-in-out 1s infinite',
37+
});
38+
39+
export const DisquietViewContainer = styled.div({
40+
fontWeight: '500',
41+
cursor: 'pointer',
42+
43+
overflow: 'hidden',
44+
position: 'absolute',
45+
boxShadow: '5px 4px 3px rgba(0, 0, 0, 0.5)',
46+
47+
top: '0',
48+
right: '0',
49+
margin: '24px 60px',
50+
51+
background: theme.colors.grayscale80,
52+
display: 'flex',
53+
alignItems: 'center',
54+
borderRadius: '18px',
55+
boxSizing: 'border-box',
56+
padding: '18px',
57+
gap: '18px',
58+
whiteSpace: 'nowrap',
59+
['>svg']: {
60+
height: '48px',
61+
width: '48px',
62+
animation: elevator + ' 8s ease-in-out 0s infinite',
63+
filter: 'drop-shadow(5px 7px 0px rgba(0, 0, 0, 0.1));',
64+
},
65+
66+
[media[0]]: {
67+
position: 'relative',
68+
margin: '0',
69+
borderRadius: '12px',
70+
padding: '12px',
71+
gap: '12px',
72+
['>svg']: {
73+
height: '32px',
74+
width: '32px',
75+
},
76+
},
77+
});
78+
79+
export const DisquietViewTitleContainer = styled.div({
80+
display: 'flex',
81+
flexDirection: 'column',
82+
alignItems: 'start',
83+
gap: '12px',
84+
fontSize: '24px',
85+
lineHeight: '1',
86+
87+
['svg']: {
88+
height: '15px',
89+
width: 'auto',
90+
},
91+
92+
[media[0]]: {
93+
gap: '8px',
94+
fontSize: '15px',
95+
['svg']: {
96+
height: '11px',
97+
width: '48px',
98+
},
99+
},
100+
});

‎src/components/Event/Disquiet.svg‎

Lines changed: 18 additions & 0 deletions
Loading

‎src/components/Event/Disquiet.tsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { DisquietViewContainer, DisquietViewStyled, DisquietViewTitleContainer } from './Disquiet.Style';
2+
import DisquietSVG from './Disquiet.svg?react';
3+
import UpCircleSVG from './UpCircle.svg?react';
4+
5+
const DisquietVote = () => {
6+
return (
7+
<DisquietViewContainer
8+
onClick={() => {
9+
window.open('https://disquiet.io/product/%EC%9D%B8%EA%B0%84%EC%A7%80%ED%91%9C');
10+
}}
11+
>
12+
<DisquietViewTitleContainer>
13+
<DisquietSVG />
14+
디스콰이엇 투표 중
15+
</DisquietViewTitleContainer>
16+
<UpCircleSVG />
17+
<DisquietViewStyled />
18+
</DisquietViewContainer>
19+
);
20+
};
21+
22+
export default DisquietVote;

‎src/components/Event/UpCircle.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎src/index.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,8 @@
3030
-ms-text-size-adjust: 100%; /* IE */
3131
-moz-text-size-adjust: 100%; /* 파이어폭스 */
3232
-o-text-size-adjust: 100%; /* 오페라 구버전 */
33+
34+
overflow-x: hidden;
3335
}
3436

3537
/* html,

‎src/layout/Header/Header.Style.ts‎

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,30 +14,37 @@ const HeaderContents = styled.div({
1414
boxSizing: 'border-box',
1515
margin: '0 auto',
1616
height: '100%',
17-
gap: '32px',
18-
19-
[media[0]]: {
20-
gap: '18px',
21-
},
2217
});
2318

2419
const HeaderLogo = styled.div({
20+
width: '100%',
2521
margin: '0 auto',
26-
padding: '32px',
22+
padding: '64px',
23+
display: 'flex',
24+
alignItems: 'center',
25+
boxSizing: 'border-box',
2726

2827
[media[0]]: {
2928
padding: '24px',
3029
},
3130

32-
['svg']: {
31+
['> svg']: {
3332
cursor: 'pointer',
3433
width: 'auto',
3534
height: '48px',
35+
margin: '0 auto',
3636

3737
[media[0]]: {
3838
height: '24px',
3939
},
4040
},
41+
42+
['iframe']: {
43+
background: 'transparent',
44+
['div']: {
45+
background: 'red',
46+
},
47+
},
4148
});
4249

4350
export { HeaderContainer, HeaderContents, HeaderLogo };

‎src/layout/Header/Header.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { useNavigate } from 'react-router-dom';
2+
import DisquietVote from '@components/Event/Disquiet';
23
import SearchBar from '@components/SearchBar/SearchBar';
34
import LogoSVG from '@assets/logo_white.svg?react';
45
import { HeaderContainer, HeaderContents, HeaderLogo } from './Header.Style';
@@ -12,6 +13,7 @@ const Header = () => {
1213
<HeaderContents>
1314
<HeaderLogo onClick={() => navigate('/')}>
1415
<LogoSVG />
16+
<DisquietVote />
1517
</HeaderLogo>
1618
<SearchBar />
1719
</HeaderContents>

‎tsconfig.app.tsbuildinfo‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
{"root":["./src/app.tsx","./src/main.tsx","./src/queryclient.ts","./src/vite-env.d.ts","./src/components/cardlist/cardlist.tsx","./src/components/cardlist/stockcard/stockcard.style.ts","./src/components/cardlist/stockcard/stockcard.tsx","./src/components/common/common.props.ts","./src/components/common/common.type.ts","./src/components/common/common.tsx","./src/components/common/contentsitem.style.ts","./src/components/common/errorcomponent.tsx","./src/components/common/loadingcomponent.tsx","./src/components/home/indexscore/indexscore.style.ts","./src/components/home/indexscore/indexscore.tsx","./src/components/home/keywords/keywords.style.tsx","./src/components/home/keywords/keywords.tsx","./src/components/home/stocktable/stocktable.style.ts","./src/components/home/stocktable/stocktable.tsx","./src/components/pwausage/common.style.ts","./src/components/pwausage/android/android.style.tsx","./src/components/pwausage/android/android.tsx","./src/components/pwausage/ios/ios.style.ts","./src/components/pwausage/ios/ios.tsx","./src/components/popup/commonpopup.style.ts","./src/components/popup/commonpopup.tsx","./src/components/popup/antivoicepopup/antvoicepopup.style.ts","./src/components/popup/antivoicepopup/antvoicepopup.tsx","./src/components/popup/descentpopup/descentpopup.tsx","./src/components/popup/fearpopup/fearpopup.tsx","./src/components/popup/hotpopup/hotpopup.tsx","./src/components/popup/keywordpopup/keywordpopup.tsx","./src/components/popup/pwainfopopup/pwainfopopup.tsx","./src/components/popup/pwainfopopup/pwainfopopup.style.ts","./src/components/popup/risingpopup/risingpopup.tsx","./src/components/popup/zipyopopup/zipyopopup.style.ts","./src/components/popup/zipyopopup/zipyopopup.tsx","./src/components/search/searchtitle/searchtitle.style.ts","./src/components/search/searchtitle/searchtitle.tsx","./src/components/search/stockchart/stockchart.style.ts","./src/components/search/stockchart/stockchart.tsx","./src/components/search/stockwordcloud/stockwordcloud.style.ts","./src/components/search/stockwordcloud/stockwordcloud.tsx","./src/components/searchbar/searchbar.style.ts","./src/components/searchbar/searchbar.tsx","./src/components/slideview/slideview.style.ts","./src/components/slideview/slideview.tsx","./src/components/stockslotmachine/stockslotmachine.tsx","./src/components/stockslotmachine/stockslotmachine.style.ts","./src/components/text/text.props.ts","./src/components/text/text.ts","./src/constants/stockscore.ts","./src/controllers/api.type.ts","./src/controllers/api.ts","./src/controllers/mock.ts","./src/controllers/query.ts","./src/hooks/usecanvas.ts","./src/hooks/useismobile.ts","./src/hooks/usequery.tsx","./src/hooks/useworker.ts","./src/layout/footer/footer.style.ts","./src/layout/footer/footer.tsx","./src/layout/header/header.style.ts","./src/layout/header/header.tsx","./src/layout/mainlayout/mainlayout.props.ts","./src/layout/mainlayout/mainlayout.style.ts","./src/layout/mainlayout/mainlayout.tsx","./src/pages/home/home.style.ts","./src/pages/home/home.tsx","./src/pages/search/search.style.ts","./src/pages/search/search.tsx","./src/pages/usage/usage.style.ts","./src/pages/usage/usage.tsx","./src/router/index.tsx","./src/styles/keyframes.ts","./src/styles/themes.ts","./src/ts/constants.ts","./src/ts/enums.ts","./src/ts/interfaces.ts","./src/ts/types.ts","./src/utils/canvas.ts","./src/utils/date.ts","./src/utils/delta.ts","./src/utils/detector.ts","./src/utils/localstorage.ts","./src/utils/scoreconvert.ts","./src/utils/chunkarray.ts","./src/utils/getframerate.ts","./src/utils/wasm/wordcloudwasm.ts","./src/utils/wasm/wordcloud.wasm.d.ts","./src/utils/worker/generatewordcloud.ts"],"version":"5.7.2"}
1+
{"root":["./src/app.tsx","./src/main.tsx","./src/queryclient.ts","./src/vite-env.d.ts","./src/components/cardlist/cardlist.tsx","./src/components/cardlist/stockcard/stockcard.style.ts","./src/components/cardlist/stockcard/stockcard.tsx","./src/components/common/common.props.ts","./src/components/common/common.type.ts","./src/components/common/common.tsx","./src/components/common/contentsitem.style.ts","./src/components/common/errorcomponent.tsx","./src/components/common/loadingcomponent.tsx","./src/components/event/disquiet.style.ts","./src/components/event/disquiet.tsx","./src/components/home/indexscore/indexscore.style.ts","./src/components/home/indexscore/indexscore.tsx","./src/components/home/keywords/keywords.style.tsx","./src/components/home/keywords/keywords.tsx","./src/components/home/stocktable/stocktable.style.ts","./src/components/home/stocktable/stocktable.tsx","./src/components/pwausage/common.style.ts","./src/components/pwausage/android/android.style.tsx","./src/components/pwausage/android/android.tsx","./src/components/pwausage/ios/ios.style.ts","./src/components/pwausage/ios/ios.tsx","./src/components/popup/commonpopup.style.ts","./src/components/popup/commonpopup.tsx","./src/components/popup/antivoicepopup/antvoicepopup.style.ts","./src/components/popup/antivoicepopup/antvoicepopup.tsx","./src/components/popup/descentpopup/descentpopup.tsx","./src/components/popup/fearpopup/fearpopup.tsx","./src/components/popup/hotpopup/hotpopup.tsx","./src/components/popup/keywordpopup/keywordpopup.tsx","./src/components/popup/pwainfopopup/pwainfopopup.tsx","./src/components/popup/pwainfopopup/pwainfopopup.style.ts","./src/components/popup/risingpopup/risingpopup.tsx","./src/components/popup/zipyopopup/zipyopopup.style.ts","./src/components/popup/zipyopopup/zipyopopup.tsx","./src/components/search/searchtitle/searchtitle.style.ts","./src/components/search/searchtitle/searchtitle.tsx","./src/components/search/stockchart/stockchart.style.ts","./src/components/search/stockchart/stockchart.tsx","./src/components/search/stockwordcloud/stockwordcloud.style.ts","./src/components/search/stockwordcloud/stockwordcloud.tsx","./src/components/searchbar/searchbar.style.ts","./src/components/searchbar/searchbar.tsx","./src/components/slideview/slideview.style.ts","./src/components/slideview/slideview.tsx","./src/components/stockslotmachine/stockslotmachine.tsx","./src/components/stockslotmachine/stockslotmachine.style.ts","./src/components/text/text.props.ts","./src/components/text/text.ts","./src/constants/stockscore.ts","./src/controllers/api.type.ts","./src/controllers/api.ts","./src/controllers/mock.ts","./src/controllers/query.ts","./src/hooks/usecanvas.ts","./src/hooks/useismobile.ts","./src/hooks/usequery.tsx","./src/hooks/useworker.ts","./src/layout/footer/footer.style.ts","./src/layout/footer/footer.tsx","./src/layout/header/header.style.ts","./src/layout/header/header.tsx","./src/layout/mainlayout/mainlayout.props.ts","./src/layout/mainlayout/mainlayout.style.ts","./src/layout/mainlayout/mainlayout.tsx","./src/pages/home/home.style.ts","./src/pages/home/home.tsx","./src/pages/search/search.style.ts","./src/pages/search/search.tsx","./src/pages/usage/usage.style.ts","./src/pages/usage/usage.tsx","./src/router/index.tsx","./src/styles/keyframes.ts","./src/styles/themes.ts","./src/ts/constants.ts","./src/ts/enums.ts","./src/ts/interfaces.ts","./src/ts/types.ts","./src/utils/canvas.ts","./src/utils/date.ts","./src/utils/delta.ts","./src/utils/detector.ts","./src/utils/localstorage.ts","./src/utils/scoreconvert.ts","./src/utils/chunkarray.ts","./src/utils/getframerate.ts","./src/utils/wasm/wordcloudwasm.ts","./src/utils/wasm/wordcloud.wasm.d.ts","./src/utils/worker/generatewordcloud.ts"],"version":"5.7.2"}

0 commit comments

Comments
 (0)