Merge pull request #567 from xxxjinn/main

feat(view): 레이아웃 수정
githru · Jul 31, 2024 · 7ae815e · 7ae815e
2 parents 2db9fb5 + c74a093
commit 7ae815e
Show file tree

Hide file tree

Showing 7 changed files with 10 additions and 7 deletions.
diff --git a/packages/view/src/App.scss b/packages/view/src/App.scss
@@ -32,8 +32,8 @@ body {
 }
 
 .middle-container {
-  display: flex;
-  justify-content: center;
+  display: grid;
+  grid-template-columns: 4fr 1fr;
   height: calc(100vh - 200px);
   margin-top: 20px;
 }
diff --git a/packages/view/src/components/Statistics/AuthorBarChart/AuthorBarChart.scss b/packages/view/src/components/Statistics/AuthorBarChart/AuthorBarChart.scss
@@ -4,13 +4,12 @@
   width: fit-content;
   display: flex;
   flex-direction: column;
-  align-items: flex-end;
+  align-items: flex-start;
 }
 
 .author-bar-chart__header {
   width: 100%;
   text-align: right;
-  padding-left: 40px;
 
   & .select-box {
     font-size: 10px;

diff --git a/packages/view/src/components/Statistics/AuthorBarChart/AuthorBarChart.tsx b/packages/view/src/components/Statistics/AuthorBarChart/AuthorBarChart.tsx
@@ -213,6 +213,7 @@ const AuthorBarChart = () => {
 
   return (
     <div className="author-bar-chart__container">
+      <p>Author Bar Chart</p>
       <div className="author-bar-chart__header">
         <select
           className="select-box"

diff --git a/packages/view/src/components/Statistics/FileIcicleSummary/FileIcicleSummary.scss b/packages/view/src/components/Statistics/FileIcicleSummary/FileIcicleSummary.scss
@@ -1,6 +1,7 @@
 @import "styles/_pallete";
 
 .file-icicle-summary {
+  width: 90%;
   text {
     fill: var(--primary-color);
     filter: invert(100) grayscale(100) contrast(100);

diff --git a/packages/view/src/components/Statistics/FileIcicleSummary/FileIcicleSummary.tsx b/packages/view/src/components/Statistics/FileIcicleSummary/FileIcicleSummary.tsx
@@ -137,6 +137,7 @@ const FileIcicleSummary = () => {
 
   return (
     <div className="file-icicle-summary">
+      <p>File Icicle Summary</p>
       <svg ref={$summary} />
     </div>
   );

diff --git a/packages/view/src/components/Statistics/Statistics.scss b/packages/view/src/components/Statistics/Statistics.scss
@@ -1,9 +1,10 @@
 .statistics {
   display: flex;
   flex-direction: column;
+  align-items: center;
   gap: 5vh;
-  padding: 0 20px 20px;
-  width: 300px;
+  padding: 20px;
+  width: 350px;
   overflow-y: scroll;
 }
 

diff --git a/packages/view/src/components/VerticalClusterList/Summary/Summary.scss b/packages/view/src/components/VerticalClusterList/Summary/Summary.scss
@@ -9,7 +9,7 @@
   width: 100%;
 
   .cluster-summary__cluster {
-    padding: 5px 0;
+    padding: 5px;
     .toggle-contents-button {
       padding: 5px 15px;
       border: none;