From 82c44c2a1cda4749a90bfb04c07a3bd67f64b9ae Mon Sep 17 00:00:00 2001 From: Jeongwoo Park <121204715+lurgi@users.noreply.github.com> Date: Thu, 19 Sep 2024 17:56:46 +0900 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=EC=9B=B9=20=EC=A0=91=EA=B7=BC?= =?UTF-8?q?=EC=84=B1=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- a11y/src/components/FlightBooking.css | 14 +++++++++++++- a11y/src/components/FlightBooking.tsx | 26 +++++++++++++++++++++----- package-lock.json | 6 ++++++ 3 files changed, 40 insertions(+), 6 deletions(-) create mode 100644 package-lock.json diff --git a/a11y/src/components/FlightBooking.css b/a11y/src/components/FlightBooking.css index d9d6083..5235c41 100644 --- a/a11y/src/components/FlightBooking.css +++ b/a11y/src/components/FlightBooking.css @@ -34,7 +34,7 @@ width: 30px; height: 30px; border-radius: 16px; - border: 1px solid #C0C0C0; + border: 1px solid #c0c0c0; background-color: #fff; cursor: pointer; display: flex; @@ -61,3 +61,15 @@ border-radius: 4px; cursor: pointer; } + +.visually-hidden { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; +} diff --git a/a11y/src/components/FlightBooking.tsx b/a11y/src/components/FlightBooking.tsx index 313cab3..0acc2da 100644 --- a/a11y/src/components/FlightBooking.tsx +++ b/a11y/src/components/FlightBooking.tsx @@ -6,13 +6,24 @@ const MAX_PASSENGERS = 3; const FlightBooking = () => { const [adultCount, setAdultCount] = useState(1); + const [message, setMessage] = useState(""); const incrementCount = () => { - setAdultCount((prev) => Math.min(MAX_PASSENGERS, prev + 1)); + setAdultCount((prev) => { + if (prev + 1 >= MAX_PASSENGERS) { + setMessage("최대 승객 수에 도달했습니다."); + } else { + setMessage(""); + } + return Math.min(MAX_PASSENGERS, prev + 1); + }); }; const decrementCount = () => { - setAdultCount((prev) => Math.max(1, prev - 1)); + setAdultCount((prev) => { + setMessage(""); + return Math.max(1, prev - 1); + }); }; return ( @@ -21,15 +32,20 @@ const FlightBooking = () => {
성인
- - {adultCount} -
+ {message && ( +
+ {message} +
+ )} ); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..6846ea4 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,6 @@ +{ + "name": "self-paced-enhance-usability", + "lockfileVersion": 3, + "requires": true, + "packages": {} +} From 91507052f71eec9f950b8b5a596b2e9c81bc19a5 Mon Sep 17 00:00:00 2001 From: Jeongwoo Park <121204715+lurgi@users.noreply.github.com> Date: Fri, 20 Sep 2024 16:19:58 +0900 Subject: [PATCH 2/5] =?UTF-8?q?feat:=20lang=20=EC=86=8D=EC=84=B1=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- a11y/index.html | 26 ++++++++++++-------------- 1 file changed, 12 insertions(+), 14 deletions(-) diff --git a/a11y/index.html b/a11y/index.html index 12fa3e7..d875527 100644 --- a/a11y/index.html +++ b/a11y/index.html @@ -1,16 +1,14 @@ - - - - - - - - Accessibility - - - -
- - + + + + + + + Accessibility + + +
+ + From 1433356c0d25e7eb70d14ff2ec9d3eb0d648b87f Mon Sep 17 00:00:00 2001 From: Jeongwoo Park <121204715+lurgi@users.noreply.github.com> Date: Fri, 20 Sep 2024 16:28:09 +0900 Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=ED=83=9C=EA=B7=B8=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- a11y/src/App.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/a11y/src/App.tsx b/a11y/src/App.tsx index a8159f9..1a7b3ef 100644 --- a/a11y/src/App.tsx +++ b/a11y/src/App.tsx @@ -5,12 +5,8 @@ import FlightBooking from "./components/FlightBooking"; function App() { return ( -
-
-
- -
-
+
+
); } From 234b40b9f1bd03f464ebb1d9a1e87a1448aef58a Mon Sep 17 00:00:00 2001 From: Jeongwoo Park <121204715+lurgi@users.noreply.github.com> Date: Fri, 20 Sep 2024 16:28:49 +0900 Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=ED=83=9C=EA=B7=B8=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- a11y/src/App.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/a11y/src/App.tsx b/a11y/src/App.tsx index 1a7b3ef..78519ed 100644 --- a/a11y/src/App.tsx +++ b/a11y/src/App.tsx @@ -5,9 +5,9 @@ import FlightBooking from "./components/FlightBooking"; function App() { return ( -
+
-
+ ); } From a12ef852ee719f54efc485bd3b0aa30dca79c1b6 Mon Sep 17 00:00:00 2001 From: Jeongwoo Park <121204715+lurgi@users.noreply.github.com> Date: Fri, 20 Sep 2024 16:54:06 +0900 Subject: [PATCH 5/5] =?UTF-8?q?feat:=20=EC=8B=9C=EB=A7=A8=ED=8B=B1=20?= =?UTF-8?q?=ED=83=9C=EA=B7=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- a11y/src/components/FlightBooking.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/a11y/src/components/FlightBooking.tsx b/a11y/src/components/FlightBooking.tsx index 0acc2da..353af52 100644 --- a/a11y/src/components/FlightBooking.tsx +++ b/a11y/src/components/FlightBooking.tsx @@ -27,7 +27,7 @@ const FlightBooking = () => { }; return ( -
+

항공권 예매

성인 @@ -47,7 +47,7 @@ const FlightBooking = () => {
)} -
+ ); };