From 46db2702d62e36cd28ac395d7b34a11aa0158e80 Mon Sep 17 00:00:00 2001 From: je355 Date: Tue, 13 Feb 2024 16:12:14 +0900 Subject: [PATCH 1/8] =?UTF-8?q?`=E2=99=BB=20::`=20MajorLine=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Portfolio/portfolioMain.tsx | 62 +------------ .../src/constants/MajorLine/Major.style.ts | 70 ++++++++++++++ SOPOLAST/src/constants/MajorLine/Major.tsx | 93 +++++++++++++++++++ 3 files changed, 165 insertions(+), 60 deletions(-) create mode 100644 SOPOLAST/src/constants/MajorLine/Major.style.ts create mode 100644 SOPOLAST/src/constants/MajorLine/Major.tsx diff --git a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx index 1ccd95d..ad2d0ef 100644 --- a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx +++ b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx @@ -5,6 +5,7 @@ import b1nd from "../../Assets/image/b1nd.png"; import Sidename from "src/constants/Sidebar/Side/side"; import "./protfolio.css"; import Head from "../../constants/head/Head/head" +import MajorLine from "../../constants/MajorLine/Major" import * as S from "../Portfolio/portfolioMain.style" @@ -38,66 +39,7 @@ export default function Portfolio() { - - <> - - - - - - - - | - - majorClick('프론트엔드')} - > - 프론트엔드 - - - majorClick('백엔드')} - > - 백엔드 - - - majorClick('안드로이드')} - > - 안드로이드 - - - majorClick('iOS')} - > - iOS - - - majorClick('임베디드')} - > - 임베디드 - - - majorClick('AI')} - > - AI - - - majorClick('정보보안')} - > - 정보보안 - - - majorClick('디자인')} - > - 디자인 - - - + diff --git a/SOPOLAST/src/constants/MajorLine/Major.style.ts b/SOPOLAST/src/constants/MajorLine/Major.style.ts new file mode 100644 index 0000000..92002ee --- /dev/null +++ b/SOPOLAST/src/constants/MajorLine/Major.style.ts @@ -0,0 +1,70 @@ +import styled from "styled-components" + +export const StackLine = styled.div` + position: absolute; + width: 100%; + height: 100px; + bottom: 0px; + left: 200px; + display: inline-block; +` + +export const GradeSelect = styled.select` + width: 80px; + height: 40px; + color: #000; + border: none; + font-size: 30px; + font-weight: 600; + font-family: Inter; + margin-top: 20px; + display: inline; +` + +export const GradeGreen = styled.div` + color: green; + font-size: 30px; + position: relative; + display: inline; +` + +export const MajorSelect = styled.div` + display: inline; + color: #A7A7A7; + font-family: Inter; + font-size: 20px; + font-style: normal; + font-weight: 600; + line-height: normal; + position: relative; + +` + + +export const MajorButton = styled.button` + border: none; + background-color: none; + padding: 13px; + display: inline; + color: #A7A7A7; + font-family: Inter; + font-size: 20px; + font-style: normal; + font-weight: 600; + line-height: normal; + position: relative; + background: none; + cursor: pointer; +` + +export const MajorButtonHover = styled(MajorButton)` + &:hover { + color: #1A9A18 !important; + } +` + +export const MajorButtonClicked = styled(MajorButton)` + &:active { + color: #1A9A18 !important; + } +` \ No newline at end of file diff --git a/SOPOLAST/src/constants/MajorLine/Major.tsx b/SOPOLAST/src/constants/MajorLine/Major.tsx new file mode 100644 index 0000000..1f0876c --- /dev/null +++ b/SOPOLAST/src/constants/MajorLine/Major.tsx @@ -0,0 +1,93 @@ +import React from 'react' +import { useNavigate } from "react-router-dom"; + +import * as S from "src/constants/MajorLine/Major.style" + +export default function Major() { + const majorClick = (major) => { + console.log(`Clicked on ${major}`); + }; + + const majorbutton: HTMLElement | null = document.getElementById('majorbutton'); + + if (majorbutton) { + majorbutton.addEventListener('click', function() { + if (majorbutton.classList.contains('clicked')) { + majorbutton.classList.remove('clicked'); + } else { + majorbutton.classList.add('clicked'); + } + }); + } + + const navigate = useNavigate(); + return ( +
+
+ + + + <> + + + + + + + + | + + majorClick('프론트엔드')} + > + 프론트엔드 + + + majorClick('백엔드')} + > + 백엔드 + + + majorClick('안드로이드')} + > + 안드로이드 + + + majorClick('iOS')} + > + iOS + + + majorClick('임베디드')} + > + 임베디드 + + + majorClick('AI')} + > + AI + + + majorClick('정보보안')} + > + 정보보안 + + + majorClick('디자인')} + > + 디자인 + + + +
+
+ ); + } + \ No newline at end of file From 14d590d93ed590d3686034129e96cef923c78293 Mon Sep 17 00:00:00 2001 From: je355 Date: Tue, 13 Feb 2024 17:01:28 +0900 Subject: [PATCH 2/8] =?UTF-8?q?`=E2=99=BB=20::`=20sopo..?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Portfolio/portfolioMain.tsx | 2 - .../src/constants/MajorLine/Major.style.ts | 28 ++- SOPOLAST/src/constants/MajorLine/Major.tsx | 173 +++++++++--------- 3 files changed, 95 insertions(+), 108 deletions(-) diff --git a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx index ad2d0ef..83fdf9b 100644 --- a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx +++ b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx @@ -1,7 +1,5 @@ import React from "react"; import { useNavigate } from "react-router-dom"; -import cnsLogo from "../../Assets/image/cnsLogo.png"; -import b1nd from "../../Assets/image/b1nd.png"; import Sidename from "src/constants/Sidebar/Side/side"; import "./protfolio.css"; import Head from "../../constants/head/Head/head" diff --git a/SOPOLAST/src/constants/MajorLine/Major.style.ts b/SOPOLAST/src/constants/MajorLine/Major.style.ts index 92002ee..f688ef0 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.style.ts +++ b/SOPOLAST/src/constants/MajorLine/Major.style.ts @@ -1,4 +1,4 @@ -import styled from "styled-components" +import styled from 'styled-components'; export const StackLine = styled.div` position: absolute; @@ -7,7 +7,7 @@ export const StackLine = styled.div` bottom: 0px; left: 200px; display: inline-block; -` +`; export const GradeSelect = styled.select` width: 80px; @@ -19,14 +19,14 @@ export const GradeSelect = styled.select` font-family: Inter; margin-top: 20px; display: inline; -` +`; export const GradeGreen = styled.div` color: green; font-size: 30px; position: relative; display: inline; -` +`; export const MajorSelect = styled.div` display: inline; @@ -37,16 +37,14 @@ export const MajorSelect = styled.div` font-weight: 600; line-height: normal; position: relative; - -` +`; - -export const MajorButton = styled.button` +export const MajorButton = styled.button<{clicked: boolean }>` border: none; background-color: none; padding: 13px; - display: inline; - color: #A7A7A7; + display: inline; + color: ${({ clicked }) => (clicked ? '#1A9A18' : '#A7A7A7')}; font-family: Inter; font-size: 20px; font-style: normal; @@ -55,16 +53,12 @@ export const MajorButton = styled.button` position: relative; background: none; cursor: pointer; -` -export const MajorButtonHover = styled(MajorButton)` &:hover { - color: #1A9A18 !important; + color: #1A9A18; } -` -export const MajorButtonClicked = styled(MajorButton)` &:active { - color: #1A9A18 !important; + color: ${({ clicked }) => (clicked ? '#1A9A18' : '#A7A7A7')}; } -` \ No newline at end of file +`; diff --git a/SOPOLAST/src/constants/MajorLine/Major.tsx b/SOPOLAST/src/constants/MajorLine/Major.tsx index 1f0876c..df3d2b9 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.tsx +++ b/SOPOLAST/src/constants/MajorLine/Major.tsx @@ -1,93 +1,88 @@ -import React from 'react' -import { useNavigate } from "react-router-dom"; - -import * as S from "src/constants/MajorLine/Major.style" +import React, { useState } from 'react'; +import { useNavigate } from 'react-router-dom'; +import * as S from 'src/constants/MajorLine/Major.style'; export default function Major() { - const majorClick = (major) => { - console.log(`Clicked on ${major}`); - }; - - const majorbutton: HTMLElement | null = document.getElementById('majorbutton'); - - if (majorbutton) { - majorbutton.addEventListener('click', function() { - if (majorbutton.classList.contains('clicked')) { - majorbutton.classList.remove('clicked'); - } else { - majorbutton.classList.add('clicked'); - } - }); - } - - const navigate = useNavigate(); - return ( -
-
+ const [isClicked, setIsClicked] = useState(false); // 버튼 클릭 상태를 관리합니다. + const navigate = useNavigate(); + + const majorClick = (major) => { + console.log(`Clicked on ${major}`); + setIsClicked(!isClicked); // 버튼 클릭 시 상태를 변경하여 클래스 추가/제거를 토글합니다. + }; + + return ( +
+
+ {/* 스타일을 적용한 요소들을 렌더링합니다. */} + + + + + + + + | + + + majorClick('프론트엔드')} + clicked={isClicked} + > + 프론트엔드 + + + majorClick('백엔드')} + clicked={isClicked} + > + 백엔드 + + + majorClick('안드로이드')} + clicked={isClicked} + > + 안드로이드 + + + majorClick('iOS')} + clicked={isClicked} + > + iOS + + + majorClick('임베디드')} + clicked={isClicked} + > + 임베디드 + + + majorClick('AI')} + clicked={isClicked} + > + AI + + + majorClick('정보보안')} + clicked={isClicked} + > + 정보보안 + - - - <> - - - - - - - - | - - majorClick('프론트엔드')} - > - 프론트엔드 - - - majorClick('백엔드')} - > - 백엔드 - - - majorClick('안드로이드')} - > - 안드로이드 - - - majorClick('iOS')} - > - iOS - - - majorClick('임베디드')} - > - 임베디드 - - - majorClick('AI')} - > - AI - - - majorClick('정보보안')} - > - 정보보안 - - - majorClick('디자인')} - > - 디자인 - - - -
+ majorClick('디자인')} + clicked={isClicked} + > + 디자인 + + +
- ); - } - \ No newline at end of file +
+ ); +} \ No newline at end of file From d26b40c6d1c26b4dd175bc03d0b63ed98ebc0f11 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=ED=95=B4=EC=A4=80?= <127281057+ftery0@users.noreply.github.com> Date: Tue, 13 Feb 2024 19:43:05 +0900 Subject: [PATCH 3/8] =?UTF-8?q?Major=20=ED=81=B4=EB=A6=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/constants/MajorLine/Major.style.ts | 102 +++++++++--------- SOPOLAST/src/constants/MajorLine/Major.tsx | 48 ++++----- 2 files changed, 76 insertions(+), 74 deletions(-) diff --git a/SOPOLAST/src/constants/MajorLine/Major.style.ts b/SOPOLAST/src/constants/MajorLine/Major.style.ts index f688ef0..1afe2db 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.style.ts +++ b/SOPOLAST/src/constants/MajorLine/Major.style.ts @@ -1,64 +1,68 @@ -import styled from 'styled-components'; +import styled, { css } from "styled-components"; +interface HeaderLiProps { + active: boolean; +} export const StackLine = styled.div` - position: absolute; - width: 100%; - height: 100px; - bottom: 0px; - left: 200px; - display: inline-block; + position: absolute; + width: 100%; + height: 100px; + bottom: 0px; + left: 200px; + display: inline-block; `; export const GradeSelect = styled.select` - width: 80px; - height: 40px; - color: #000; - border: none; - font-size: 30px; - font-weight: 600; - font-family: Inter; - margin-top: 20px; - display: inline; + width: 80px; + height: 40px; + color: #000; + border: none; + font-size: 30px; + font-weight: 600; + font-family: Inter; + margin-top: 20px; + display: inline; `; export const GradeGreen = styled.div` - color: green; - font-size: 30px; - position: relative; - display: inline; + color: green; + font-size: 30px; + position: relative; + display: inline; `; export const MajorSelect = styled.div` - display: inline; - color: #A7A7A7; - font-family: Inter; - font-size: 20px; - font-style: normal; - font-weight: 600; - line-height: normal; - position: relative; + display: inline; + color: #a7a7a7; + font-family: Inter; + font-size: 20px; + font-style: normal; + font-weight: 600; + line-height: normal; + position: relative; `; -export const MajorButton = styled.button<{clicked: boolean }>` - border: none; - background-color: none; - padding: 13px; - display: inline; - color: ${({ clicked }) => (clicked ? '#1A9A18' : '#A7A7A7')}; - font-family: Inter; - font-size: 20px; - font-style: normal; - font-weight: 600; - line-height: normal; - position: relative; - background: none; - cursor: pointer; +export const MajorButton = styled.button` + border: none; + background-color: none; + color: #A7A7A7; + padding: 13px; + display: inline; + font-family: Inter; + font-size: 20px; + font-style: normal; + font-weight: 600; + line-height: normal; + position: relative; + background: none; + cursor: pointer; - &:hover { - color: #1A9A18; - } - - &:active { - color: ${({ clicked }) => (clicked ? '#1A9A18' : '#A7A7A7')}; - } + &:hover { + color: #1a9a18; + } + ${(props) => + props.active && + css` + color: #1a9a18; + `} `; diff --git a/SOPOLAST/src/constants/MajorLine/Major.tsx b/SOPOLAST/src/constants/MajorLine/Major.tsx index df3d2b9..dd5a53f 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.tsx +++ b/SOPOLAST/src/constants/MajorLine/Major.tsx @@ -1,14 +1,12 @@ -import React, { useState } from 'react'; -import { useNavigate } from 'react-router-dom'; -import * as S from 'src/constants/MajorLine/Major.style'; +import React, { useState } from "react"; +import { useNavigate } from "react-router-dom"; +import * as S from "src/constants/MajorLine/Major.style"; export default function Major() { - const [isClicked, setIsClicked] = useState(false); // 버튼 클릭 상태를 관리합니다. - const navigate = useNavigate(); + const [activeIndex, setActiveIndex] = useState(null); - const majorClick = (major) => { - console.log(`Clicked on ${major}`); - setIsClicked(!isClicked); // 버튼 클릭 시 상태를 변경하여 클래스 추가/제거를 토글합니다. + const handleClick = (index:string) => { + setActiveIndex(index); }; return ( @@ -26,57 +24,57 @@ export default function Major() { majorClick('프론트엔드')} - clicked={isClicked} + active={activeIndex === "프론트엔드"} + onClick={() => handleClick("프론트엔드")} > 프론트엔드 majorClick('백엔드')} - clicked={isClicked} + active={activeIndex === "백엔드"} + onClick={() => handleClick("백엔드")} > 백엔드 majorClick('안드로이드')} - clicked={isClicked} + active={activeIndex === "안드로이드"} + onClick={() => handleClick("안드로이드")} > 안드로이드 majorClick('iOS')} - clicked={isClicked} + active={activeIndex === "Ios"} + onClick={() => handleClick("Ios")} > iOS majorClick('임베디드')} - clicked={isClicked} + active={activeIndex === "임베디드"} + onClick={() => handleClick("임베디드")} > 임베디드 majorClick('AI')} - clicked={isClicked} + active={activeIndex === "AI"} + onClick={() => handleClick("AI")} > AI majorClick('정보보안')} - clicked={isClicked} + active={activeIndex === "정보보안"} + onClick={() => handleClick("정보보안")} > 정보보안 majorClick('디자인')} - clicked={isClicked} + active={activeIndex === "디자인"} + onClick={() => handleClick("디자인")} > 디자인 @@ -85,4 +83,4 @@ export default function Major() {
); -} \ No newline at end of file +} From e82ffd6dfef240ab76355113ccfeb5bc8a9e9da2 Mon Sep 17 00:00:00 2001 From: je355 Date: Tue, 13 Feb 2024 22:49:17 +0900 Subject: [PATCH 4/8] =?UTF-8?q?=E2=9A=A1=20::=20portfolioMajorline?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- SOPOLAST/package.json | 2 +- SOPOLAST/src/constants/MajorLine/Major.tsx | 29 +++++++++++++++++----- 2 files changed, 24 insertions(+), 7 deletions(-) diff --git a/SOPOLAST/package.json b/SOPOLAST/package.json index c6f81c0..93b1702 100644 --- a/SOPOLAST/package.json +++ b/SOPOLAST/package.json @@ -52,7 +52,7 @@ "@types/react": "^18.2.48", "@types/react-dom": "^18.2.18", "@types/styled-components": "^5.1.34", - "axios": "^1.6.5", + "axios": "^1.6.7", "browser": "^0.2.6", "cli": "^1.0.1", "css-loader": "^6.9.0", diff --git a/SOPOLAST/src/constants/MajorLine/Major.tsx b/SOPOLAST/src/constants/MajorLine/Major.tsx index dd5a53f..46a73bf 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.tsx +++ b/SOPOLAST/src/constants/MajorLine/Major.tsx @@ -1,9 +1,25 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import * as S from "src/constants/MajorLine/Major.style"; +import axios from "axios"; export default function Major() { const [activeIndex, setActiveIndex] = useState(null); + const [grades, setGrades] = useState([]); + const navigate = useNavigate(); + + useEffect(() => { + const fetchData = async () => { + try { + const response = await axios.get("히히api자리지롱"); + setGrades(response.data); + } catch (error) { + console.error("Error fetching data:", error); + } + }; + + fetchData(); + }, []); const handleClick = (index:string) => { setActiveIndex(index); @@ -12,12 +28,13 @@ export default function Major() { return (
- {/* 스타일을 적용한 요소들을 렌더링합니다. */} - - - - + + {grades.map((grade) => ( + + ))} | From 504f5b983303f9d96c0c524325348e14a5dbee80 Mon Sep 17 00:00:00 2001 From: je355 Date: Thu, 15 Feb 2024 10:49:31 +0900 Subject: [PATCH 5/8] =?UTF-8?q?=E2=9A=A1=20::=20api?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- SOPOLAST/src/constants/MajorLine/Major.tsx | 46 ++++++++++++++++------ 1 file changed, 33 insertions(+), 13 deletions(-) diff --git a/SOPOLAST/src/constants/MajorLine/Major.tsx b/SOPOLAST/src/constants/MajorLine/Major.tsx index 46a73bf..d3f8e92 100644 --- a/SOPOLAST/src/constants/MajorLine/Major.tsx +++ b/SOPOLAST/src/constants/MajorLine/Major.tsx @@ -6,6 +6,7 @@ import axios from "axios"; export default function Major() { const [activeIndex, setActiveIndex] = useState(null); const [grades, setGrades] = useState([]); + const [selectedMajorInfo, setSelectedMajorInfo] = useState(null); const navigate = useNavigate(); useEffect(() => { @@ -21,24 +22,43 @@ export default function Major() { fetchData(); }, []); - const handleClick = (index:string) => { - setActiveIndex(index); + const handleClick = async (grade: string) => { + setActiveIndex(grade); + try { + const response = await axios.get(`히히api자리/${grade}`); + setSelectedMajorInfo(response.data); + } catch (error) { + console.error("Error fetching major info:", error); + } }; + + return ( +
+
+ + + {grades.map((grade) => ( + + ))} + + - return ( -
-
- - + | + + {grades.map((grade) => ( - + ))} - - - | - + + Date: Thu, 15 Feb 2024 19:45:05 +0900 Subject: [PATCH 6/8] =?UTF-8?q?=E2=9A=A1=20::=20api?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Portfolio/portfolioMain.tsx | 86 +++++++------------ 1 file changed, 31 insertions(+), 55 deletions(-) diff --git a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx index 83fdf9b..ddb10b5 100644 --- a/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx +++ b/SOPOLAST/src/Components/Portfolio/portfolioMain.tsx @@ -1,30 +1,35 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import Sidename from "src/constants/Sidebar/Side/side"; import "./protfolio.css"; import Head from "../../constants/head/Head/head" import MajorLine from "../../constants/MajorLine/Major" +import axios from "axios"; import * as S from "../Portfolio/portfolioMain.style" export default function Portfolio() { - const majorClick = (major) => { - console.log(`Clicked on ${major}`); - }; - - const majorbutton: HTMLElement | null = document.getElementById('majorbutton'); + const [users, setUsers] = useState([]); + const [activeUser, setActiveUser] = useState(null); + const navigate = useNavigate(); - if (majorbutton) { - majorbutton.addEventListener('click', function() { - if (majorbutton.classList.contains('clicked')) { - majorbutton.classList.remove('clicked'); - } else { - majorbutton.classList.add('clicked'); + useEffect(() => { + const fetchUsers = async () => { + try { + const response = await axios.get("히ㅣㅎ api"); + setUsers(response.data); + } catch (error) { + console.error("Error fetching users:", error); } - }); - } + }; + + fetchUsers(); + }, []); + + const handleNameCardClick = (user) => { + setActiveUser(user); + }; - const navigate = useNavigate(); return (
@@ -42,48 +47,19 @@ export default function Portfolio() { - { - navigate("/52562893"); - }} - > - 배채희 - DGSW 8th - Mail - chaeeehui@gmail.com - - - { - navigate("/12362153"); - }} - > - 박규민 - DGSW 8th - Mail - kyumin7487@gmail.com - - - - 전우진 - DGSW 8th - Mail - woojin@gmail.com - - - - 이윤선 - DGSW 8th - Mail - younssun@gmail.com - - - - 이예진 - DGSW 8th - Mail - yejin@gmail.com - + {users.map((user) => ( + handleNameCardClick(user)} + > + {user.name} + {user.grade} + {user.mail} + + ))}
); } - -// export default portfolio(); From b8ef0a7b8e69f27556612a6064464024e7139c6b Mon Sep 17 00:00:00 2001 From: je355 Date: Fri, 16 Feb 2024 20:09:20 +0900 Subject: [PATCH 7/8] =?UTF-8?q?=E2=9A=A1=20::=20package.json=20axios?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- SOPOLAST/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/SOPOLAST/package.json b/SOPOLAST/package.json index 93b1702..c6f81c0 100644 --- a/SOPOLAST/package.json +++ b/SOPOLAST/package.json @@ -52,7 +52,7 @@ "@types/react": "^18.2.48", "@types/react-dom": "^18.2.18", "@types/styled-components": "^5.1.34", - "axios": "^1.6.7", + "axios": "^1.6.5", "browser": "^0.2.6", "cli": "^1.0.1", "css-loader": "^6.9.0", From bad57815db32179f42c5c9ca28e4157719d639ac Mon Sep 17 00:00:00 2001 From: je355 Date: Wed, 21 Feb 2024 20:03:27 +0900 Subject: [PATCH 8/8] =?UTF-8?q?=F0=9F=93=91=20::=20css=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/Components/Portfolio/protfolio.css | 398 ------------------ 1 file changed, 398 deletions(-) delete mode 100644 SOPOLAST/src/Components/Portfolio/protfolio.css diff --git a/SOPOLAST/src/Components/Portfolio/protfolio.css b/SOPOLAST/src/Components/Portfolio/protfolio.css deleted file mode 100644 index 02c4d70..0000000 --- a/SOPOLAST/src/Components/Portfolio/protfolio.css +++ /dev/null @@ -1,398 +0,0 @@ - .proBox_{ - position: relative; - - display: inline-block; - - width: 320px; - height: 640px; - flex-shrink: 0; - border-radius: 10px; - background: #F5F5F6; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - margin-left: 40px; - margin-top: 200px; - - color: #000; - font-family: Inter; - font-size: 25px; - font-style: normal; - font-weight: 800; - line-height: normal; - - overflow: hidden; - } - - .proBox_ > .proName{ - position: absolute; - - width: 70.318px; - height: 28.444px; - flex-shrink: 0; - margin: 46.46px 0 0 28.54px; - } - - .proHr{ - - border: #A7A7A7 solid 0.9px; - width: 320px;; - - margin-top: 30.34px; - margin-left: -28.4px; - } - - .proBio{ - margin-top: 30px; - - font-size: 17px; - font-style: normal; - font-weight: 700; - white-space: nowrap; - } - - .proBio > .firstBio{ - font-size: 18px; - font-weight: 800; - } - - .secondBio{ - margin-top: 10px; - } - - .skillTitle{ - margin-top: 20px; - font-size: 20px; - font-weight: 800; - } - - .awardTitle{ - margin-top: 20px; - font-size: 20px; - font-weight: 800; - } - - .bioInfo{ - margin-top: 20px; - } - - .bioInfo > .oddBio{ - margin-top: 10px; - } - - .imgBio{ - width: 20px; - height: 20px; - - vertical-align: middle; - } - - .perBio{ - font-weight: 600; - font-size: 15px; - - vertical-align: middle; - - margin-left: 10px; - } - - .searchBox{ - display: flex; - position: absolute; - left: 300px; - top: 100px; - width: 840px; - height: 150px; - flex-shrink: 0; - - /* border-radius: 50px; - border: 1px solid #178915; - background: #FFF; */ - } - .search{ - position: absolute; - display: inline-block; - top: 10px; - left: 180px; - width: 840px; - height: 50px; - flex-shrink: 0; - border-radius: 50px; - border: 1px solid #1A9A18; - background: #FFF; - } - .search_icon{ - position: absolute; - cursor: pointer; - background-color: #FFF; - top: 9px; - left: 790px; - width: 25px; - height: 25px; - flex-shrink: 0; - border: 1px solid #1A9A18; - border-radius: 50%; - } - .searcg_icon_line{ - position: absolute; - cursor: pointer; - top: 35px; - left: 809px; - background-color: #1A9A18; - transform: rotate( 50deg ); - width: 13px; - height: 1px; - flex-shrink: 0; - stroke-width: 1px; - stroke: #1A9A18; - } - .search_box{ - position: relative; - outline: none; - font-size: 20px; - left: 20px; - top: 4px; - border: none; - width: 750px; - height: 40px; - } - - .searchBox > .searchFito{ - margin-left: 797px; - margin-top: 11.5px; - } - - .gradeSelect{ - width: 80px; - height: 40px; - color: #000; - border: none; - - font-size: 30px; - font-weight: 600; - font-family: Inter; - - margin-top: 20px; - - display: inline; - - } - .gradeSelet::-ms-expand { - display: none; -} - - .gradegreen{ - color: green; - font-size: 30px; - - position: relative; - display: inline; - } - .stackLine{ - position: absolute; - width: 100%; - height: 100px; - bottom: 0px; - left: 200px; - display: inline-block; - } - .majorSelect{ - display: inline; - color: #A7A7A7; - font-family: Inter; - font-size: 20px; - font-style: normal; - font-weight: 600; - line-height: normal; - position: relative; - - } - - .majorbutton{ - border: none; - background-color: none; - - padding: 13px; - - display: inline; - color: #A7A7A7; - font-family: Inter; - font-size: 20px; - font-style: normal; - font-weight: 600; - line-height: normal; - position: relative; - - background: none; - } - - .majorbutton:hover, - .majorbutton.clicked { - color: #1A9A18 !important; - cursor: pointer; - - background-color: none; - } - - /* .majorSelect > .frontEnd{ - display: inline-block; - color: #1A9A18; - margin-top: 27px; - - } - .majorSelect > .frontEnd:active{ - cursor: pointer; - color: #178915; - } - .elseMajor{ - display: inline-block; - margin-left: 25px; - } - .elseMajor:active{ - cursor: pointer; - color: #178915; - } */ - - - .mo{ - position: absolute; - left: 460px; - top: 200px; - width: 900px; - height: 1000px; - - } - - .mo>.namecardBox:hover{ - cursor: pointer; - } - .mo>.namecardBox{ - width: 840px; - height: 130px; - flex-shrink: 0; - border-radius: 10px; - background: #FFF; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - - position: absolute; - margin-left: 22px; - margin-top: 30px; - - display: inline-block; - } - - .nameName{ - color: #000; - font-family: Inter; - font-size: 25px; - font-style: normal; - font-weight: 800; - line-height: normal; - - position: absolute; - - margin-top: 22px; - margin-left: 33px; - } - - .nameGrade{ - color: #8C8C8C; - font-family: Inter; - font-size: 20px; - font-style: normal; - font-weight: 700; - line-height: normal; - - position: absolute; - - margin-top: 55px; - margin-left: 33px; - } - - .nameMail{ - color: #8C8C8C; - font-family: Inter; - font-size: 15px; - font-style: normal; - font-weight: 500; - line-height: normal; - - position: absolute; - - margin-top: 99px; - margin-left: 33px; - } - - .cnsLogo{ - width: 73px; - height: 40px; - flex-shrink: 0; - margin-top: 10px; - margin-left: 747px; - } - - .mo>.namecardBox2{ - width: 840px; - height: 130px; - flex-shrink: 0; - border-radius: 10px; - background: #FFF; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - - position: absolute; - margin-left: 22px; - margin-top: 180px; - cursor: pointer; - display: inline-block; - } - - - .b1ndLogo{ - width: 70px; - height: 70px; - margin-top: 10px; - margin-left: 760px; - } - - .mo>.namecardBox3{ - width: 840px; - height: 130px; - flex-shrink: 0; - border-radius: 10px; - background: #FFF; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - - position: absolute; - margin-left: 22px; - margin-top: 330px; - - display: inline-block; - } - - .mo>.namecardBox4{ - width: 840px; - height: 130px; - flex-shrink: 0; - border-radius: 10px; - background: #FFF; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - - position: absolute; - margin-left: 22px; - margin-top: 480px; - - display: inline-block; - } - - .mo>.namecardBox5{ - width: 840px; - height: 130px; - flex-shrink: 0; - border-radius: 10px; - background: #FFF; - box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); - - position: absolute; - margin-left: 22px; - margin-top: 640px; - - display: inline-block; - } \ No newline at end of file