From a7658bb3981d2a1ccab8da561fc5de147b914e4c Mon Sep 17 00:00:00 2001
From: xxxjinn <tlsguswls319@naver.com>
Date: Mon, 9 Sep 2024 14:15:16 +0900
Subject: [PATCH] refactor: apply BEM naming in FilteredAuthors component

---
 .../FilteredAuthors/FilteredAuthors.scss        | 17 ++++++++++++++---
 .../FilteredAuthors/FilteredAuthors.tsx         |  6 +++---
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/packages/view/src/components/FilteredAuthors/FilteredAuthors.scss b/packages/view/src/components/FilteredAuthors/FilteredAuthors.scss
index 75e1686f..10b3bec8 100644
--- a/packages/view/src/components/FilteredAuthors/FilteredAuthors.scss
+++ b/packages/view/src/components/FilteredAuthors/FilteredAuthors.scss
@@ -1,8 +1,19 @@
 @import "styles/app";
 
-.selected__author {
+.filtered-authors {
   display: flex;
   align-items: center;
-  flex-wrap: wrap;
-  gap: 5px;
+  column-gap: 10px;
+
+  .filtered-authors__label {
+    font-size: $font-size-title;
+    font-weight: $font-weight-semibold;
+  }
+
+  .filtered-authors__author {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 5px;
+  }
 }
diff --git a/packages/view/src/components/FilteredAuthors/FilteredAuthors.tsx b/packages/view/src/components/FilteredAuthors/FilteredAuthors.tsx
index 632c0e90..0f8d5c4a 100644
--- a/packages/view/src/components/FilteredAuthors/FilteredAuthors.tsx
+++ b/packages/view/src/components/FilteredAuthors/FilteredAuthors.tsx
@@ -14,9 +14,9 @@ const FilteredAuthors = () => {
   const addedAuthors = new Set();
 
   return (
-    <div className="selected">
-      <p>Authors:</p>
-      <div className="selected__author">
+    <div className="filtered-authors">
+      <p className="filtered-authors__label">Authors:</p>
+      <div className="filtered-authors__author">
         {authSrcMap &&
           selectedClusters.map((selectedCluster) => {
             return selectedCluster.summary.authorNames.map((authorArray: string[]) => {