Skip to content

Commit f4309d9

Browse files
JH-Lee-cloudlabJH-Lee-cloudlab
authored
Merge pull request #2 from NamutechCloudrnd/feature/UI
Feature/UI
2 parents 27e4bfe + e71e0bd commit f4309d9

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+448
-166
lines changed

‎web/css/styles.css‎

Lines changed: 68 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -650,7 +650,7 @@ progress {
650650
padding-right: calc(var(--bs-gutter-x) * 0.5);
651651
padding-left: calc(var(--bs-gutter-x) * 0.5);
652652
margin-right: auto;
653-
margin-left: auto;
653+
margin-left: auto;
654654
}
655655

656656
@media (min-width: 576px) {
@@ -2875,12 +2875,12 @@ textarea.form-control-lg {
28752875
--bs-btn-bg: #066FD1;
28762876
--bs-btn-border-color: #066FD1;
28772877
--bs-btn-hover-color: #fff;
2878-
--bs-btn-hover-bg: #B97400;
2879-
--bs-btn-hover-border-color: #985F00;
2878+
--bs-btn-hover-bg: #066FD1;
2879+
--bs-btn-hover-border-color: #066FD1;
28802880
--bs-btn-focus-shadow-rgb: 49, 132, 253;
28812881
--bs-btn-active-color: #fff;
2882-
--bs-btn-active-bg: #985F00;
2883-
--bs-btn-active-border-color: #B97400;
2882+
--bs-btn-active-bg: #066FD1;
2883+
--bs-btn-active-border-color: #066FD1;
28842884
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
28852885
--bs-btn-disabled-color: #fff;
28862886
--bs-btn-disabled-bg: #066FD1;
@@ -3282,6 +3282,7 @@ textarea.form-control-lg {
32823282
background-clip: padding-box;
32833283
border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
32843284
border-radius: var(--bs-dropdown-border-radius);
3285+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 드롭섀도우 추가 */
32853286
}
32863287
.dropdown-menu[data-bs-popper] {
32873288
top: 100%;
@@ -3305,6 +3306,64 @@ textarea.form-control-lg {
33053306
left: auto;
33063307
}
33073308

3309+
.dropdown-submenu {
3310+
position: relative;
3311+
}
3312+
.dropdown-submenu .dropdown-menu {
3313+
top: 0;
3314+
left: 100%;
3315+
margin-left: 0.1rem;
3316+
display: none;
3317+
}
3318+
.dropdown-submenu:hover > .dropdown-menu {
3319+
display: block;
3320+
}
3321+
/* 3depth에 마우스 오버 시 4depth 표시 */
3322+
.dropdown-submenu .dropdown-submenu:hover > .dropdown-menu {
3323+
display: block;
3324+
}
3325+
3326+
.active-depth1 {
3327+
border-bottom: 2px solid #007bff !important;
3328+
}
3329+
3330+
/* 2depth 이상의 dropdown-toggle 화살표를 오른쪽 방향으로 변경 */
3331+
.dropdown-submenu .dropdown-toggle::after {
3332+
border: none;
3333+
content: '\25B6'; /* 오른쪽 방향 삼각형 유니코드 */
3334+
font-size: 0.5rem;
3335+
vertical-align: middle;
3336+
margin-left: 0.5rem;
3337+
}
3338+
/* 1depth의 dropdown-toggle 화살표는 기본 아래 방향 유지 */
3339+
.navbar-nav > .nav-item > .dropdown-toggle::after {
3340+
content: '';
3341+
border: solid black;
3342+
border-width: 0 2px 2px 0;
3343+
display: inline-block;
3344+
padding: 3px;
3345+
transform: rotate(45deg);
3346+
vertical-align: middle;
3347+
margin-bottom: 8px;
3348+
}
3349+
3350+
/* 1depth 메뉴 간격과 구분선 */
3351+
.navbar-nav .nav-item {
3352+
margin-right: 2rem; /* 간격 */
3353+
position: relative;
3354+
}
3355+
3356+
/* 2depth 이상 메뉴 간격과 구분선 */
3357+
.dropdown-menu .dropdown-item {
3358+
margin-bottom: 0.5rem; /* 세로 간격 */
3359+
position: relative;
3360+
}
3361+
3362+
/* 마지막 메뉴 항목의 하단 마진 제거 */
3363+
.dropdown-menu .dropdown-item:last-child {
3364+
margin-bottom: 0;
3365+
}
3366+
33083367
@media (min-width: 576px) {
33093368
.dropdown-menu-sm-start {
33103369
--bs-position: start;
@@ -4496,7 +4555,7 @@ textarea.form-control-lg {
44964555
--bs-breadcrumb-border-radius: ;
44974556
--bs-breadcrumb-divider-color: #6c757d;
44984557
--bs-breadcrumb-item-padding-x: 0.5rem;
4499-
--bs-breadcrumb-item-active-color: #6c757d;
4558+
--bs-breadcrumb-item-active-color: #066FD1;
45004559
display: flex;
45014560
flex-wrap: wrap;
45024561
padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
@@ -10866,6 +10925,7 @@ body {
1086610925

1086710926
#layoutSidenav {
1086810927
display: flex;
10928+
background-color: #efefef;
1086910929
}
1087010930
#layoutSidenav #layoutSidenav_nav {
1087110931
flex-basis: 225px;
@@ -10922,6 +10982,8 @@ body {
1092210982
}
1092310983
.sb-nav-fixed .sb-topnav {
1092410984
z-index: 1039;
10985+
border-bottom: 1px solid #cccccc;
10986+
background-color: #ffffff;
1092510987
}
1092610988
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav {
1092710989
width: 225px;

‎web/templates/back-backup.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
<h1 class="mt-4">백업</h1>
2-
<ol class="breadcrumb mb-4">
3-
<li class="breadcrumb-item">백업</li>
1+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
2+
<li class="breadcrumb-item">Data Migrations</li>
43
<li class="breadcrumb-item active">Back Up</li>
54
</ol>
5+
<h1 class="mb-4">Back Up</h1>
66

77
<div class="card mb-4 col-auto">
88
<div class="card-header">

‎web/templates/content.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<div id="layoutSidenav_content">
2-
<main class="w-75">
2+
<main>
3+
<!-- <main class="w-75"></main> -->
34
<div class="container-fluid px-4">
45
{{ if eq .Content "main" }}
56
{{ template "main.html" }}

‎web/templates/footer.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11

22
<!-- <div id="layoutSidenav_content"> -->
3-
<footer class="py-4 bg-light mt-auto">
3+
<!-- <footer class="py-4 bg-light mt-auto">
44
<div class="container-fluid px-4">
55
<div class="d-flex align-items-center justify-content-between small">
66
<div class="text-muted">Copyright 2023 Cloud-Barista Community</div>
@@ -11,7 +11,7 @@
1111
</div>
1212
</div>
1313
</div>
14-
</footer>
14+
</footer> -->
1515
<!-- </div> -->
1616
</div>
1717

‎web/templates/gen-data.html‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
<input class="form-check-input" type="checkbox" id="checkSQL" name="checkSQL">
1010
<!-- <label class="form-check-label" for="checkSQL">SQL</label> -->
1111
<div class="input-group mb-3">
12-
<span class="input-group-text bg-warning">SQL</span>
12+
<span class="input-group-text bg-secondary bg-opacity-50">SQL</span>
1313
<input type="number" class="form-control" id="sizeSQL" name="sizeSQL" value="10" min="1" style="width: 60px;">
1414
<span class="input-group-text bg-light">GB</span>
1515
</div>
@@ -18,7 +18,7 @@
1818
<input class="form-check-input" type="checkbox" id="checkCSV" name="checkCSV">
1919
<!-- <label class="form-check-label" for="checkCSV">CSV</label> -->
2020
<div class="input-group mb-3">
21-
<span class="input-group-text bg-success text-light">CSV</span>
21+
<span class="input-group-text bg-secondary bg-opacity-50">CSV</span>
2222
<input type="number" class="form-control" id="sizeCSV" name="sizeCSV" value="10" min="1" style="width: 60px;">
2323
<span class="input-group-text bg-light">GB</span>
2424
</div>
@@ -31,7 +31,7 @@
3131
<input class="form-check-input" type="checkbox" id="checkTXT" name="checkTXT">
3232
<!-- <label class="form-check-label" for="checkTXT">TXT</label> -->
3333
<div class="input-group mb-3">
34-
<span class="input-group-text data-txt text-light">TXT</span>
34+
<span class="input-group-text bg-secondary bg-opacity-50">TXT</span>
3535
<input type="number" class="form-control" id="sizeTXT" name="sizeTXT" value="10" min="1" style="width: 60px;">
3636
<span class="input-group-text bg-light">GB</span>
3737
</div>
@@ -40,7 +40,7 @@
4040
<input class="form-check-input" type="checkbox" id="checkPNG" name="checkPNG">
4141
<!-- <label class="form-check-label" for="checkPNG">PNG</label> -->
4242
<div class="input-group mb-3">
43-
<span class="input-group-text bg-danger text-light">PNG</span>
43+
<span class="input-group-text bg-secondary bg-opacity-50">PNG</span>
4444
<input type="number" class="form-control" id="sizePNG" name="sizePNG" value="10" min="1" style="width: 60px;">
4545
<span class="input-group-text bg-light">GB</span>
4646
</div>
@@ -49,7 +49,7 @@
4949
<input class="form-check-input" type="checkbox" id="checkGIF" name="checkGIF">
5050
<!-- <label class="form-check-label" for="checkGIF">GIF</label> -->
5151
<div class="input-group mb-3">
52-
<span class="input-group-text bg-info">GIF</span>
52+
<span class="input-group-text bg-secondary bg-opacity-50">GIF</span>
5353
<input type="number" class="form-control" id="sizeGIF" name="sizeGIF" value="10" min="1" style="width: 60px;">
5454
<span class="input-group-text bg-light">GB</span>
5555
</div>
@@ -58,7 +58,7 @@
5858
<input class="form-check-input" type="checkbox" id="checkZIP" name="checkZIP">
5959
<!-- <label class="form-check-label" for="checkZIP">ZIP</label> -->
6060
<div class="input-group mb-3">
61-
<span class="input-group-text bg-primary text-light">ZIP</span>
61+
<span class="input-group-text bg-secondary bg-opacity-50">ZIP</span>
6262
<input type="number" class="form-control" id="sizeZIP" name="sizeZIP" value="10" min="1" style="width: 60px;">
6363
<span class="input-group-text bg-light">GB</span>
6464
</div>
@@ -71,7 +71,7 @@
7171
<!-- <label class="form-check-label" for="checkJSON">JSON</label> -->
7272
<input class="form-check-input" type="checkbox" id="checkJSON" name="checkJSON">
7373
<div class="input-group mb-3">
74-
<span class="input-group-text bg-light">JSON</span>
74+
<span class="input-group-text bg-secondary bg-opacity-50">JSON</span>
7575
<input type="number" class="form-control" id="sizeJSON" name="sizeJSON" value="10" min="1" style="width: 60px;">
7676
<span class="input-group-text bg-light">GB</span>
7777
</div>
@@ -80,7 +80,7 @@
8080
<input class="form-check-input" type="checkbox" id="checkXML" name="checkXML">
8181
<!-- <label class="form-check-label" for="checkXML">XML</label> -->
8282
<div class="input-group mb-3">
83-
<span class="input-group-text">XML</span>
83+
<span class="input-group-text bg-secondary bg-opacity-50">XML</span>
8484
<input type="number" class="form-control" id="sizeXML" name="sizeXML" value="10" min="1" style="width: 60px;">
8585
<span class="input-group-text bg-light">GB</span>
8686
</div>
@@ -94,7 +94,7 @@
9494
<!-- <label class="form-check-label" for="checkJSON">JSON</label> -->
9595
<input class="form-check-input" type="checkbox" id="checkServerJSON" name="checkServerJSON">
9696
<div class="input-group mb-3">
97-
<span class="input-group-text bg-light">JSON</span>
97+
<span class="input-group-text bg-secondary bg-opacity-50">JSON</span>
9898
<input type="number" class="form-control" id="sizeServerJSON" name="sizeServerJSON" value="1" min="1" style="width: 60px;">
9999
<span class="input-group-text bg-light">Set</span>
100100
</div>
@@ -103,7 +103,7 @@
103103
<input class="form-check-input" type="checkbox" id="checkServerSQL" name="checkServerSQL">
104104
<!-- <label class="form-check-label" for="checkXML">XML</label> -->
105105
<div class="input-group mb-3">
106-
<span class="input-group-text bg-warning">SQL</span>
106+
<span class="input-group-text bg-secondary bg-opacity-50">SQL</span>
107107
<input type="number" class="form-control" id="sizeServerSQL" name="sizeServerSQL" value="1" min="1" style="width: 60px;">
108108
<span class="input-group-text bg-light">Set</span>
109109
</div>

‎web/templates/gen-dynamodb.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
{{ define "gen-dynamodb.html" }}
22

3-
<h1 class="mt-4">데이터 생성 DynamoDB</h1>
4-
<ol class="breadcrumb mb-4">
5-
<li class="breadcrumb-item">데이터 생성</li>
3+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
4+
<li class="breadcrumb-item">Data Migrations</li>
5+
<li class="breadcrumb-item">Generate</li>
6+
<li class="breadcrumb-item">No-SQL Database</li>
67
<li class="breadcrumb-item active">DynamoDB</li>
78
</ol>
9+
<h1 class="mb-4">데이터 생성 DynamoDB</h1>
810

911
<div class="card mb-4 col-auto">
1012
<div class="card-header">

‎web/templates/gen-firestore.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
{{ define "gen-firestore.html" }}
22

3-
<h1 class="mt-4">데이터 생성 Firestore</h1>
4-
<ol class="breadcrumb mb-4">
5-
<li class="breadcrumb-item">데이터 생성</li>
3+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
4+
<li class="breadcrumb-item">Data Migrations</li>
5+
<li class="breadcrumb-item">Generate</li>
6+
<li class="breadcrumb-item">No-SQL Database</li>
67
<li class="breadcrumb-item active">Firestore</li>
78
</ol>
9+
<h1 class="mb-4">데이터 생성 Firestore</h1>
810

911
<div class="card mb-4 col-auto">
1012
<div class="card-header">

‎web/templates/gen-gcp.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
{{ define "gen-gcp.html" }}
22

3-
<h1 class="mt-4">데이터 생성 GCP</h1>
4-
<ol class="breadcrumb mb-4">
5-
<li class="breadcrumb-item">데이터 생성</li>
3+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
4+
<li class="breadcrumb-item">Data Migrations</li>
5+
<li class="breadcrumb-item">Generate</li>
6+
<li class="breadcrumb-item">Object Storage</li>
67
<li class="breadcrumb-item active">GCP</li>
78
</ol>
9+
<h1 class="mb-4">데이터 생성 GCP</h1>
810

911
<div class="card mb-4 col-auto">
1012
<div class="card-header">

‎web/templates/gen-linux.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
{{ define "gen-linux.html" }}
22

3-
<h1 class="mt-4">데이터 생성 Linux</h1>
4-
<ol class="breadcrumb mb-4">
5-
<li class="breadcrumb-item">데이터 생성</li>
3+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
4+
<li class="breadcrumb-item">Data Migrations</li>
5+
<li class="breadcrumb-item">Generate</li>
6+
<li class="breadcrumb-item">On-Premise</li>
67
<li class="breadcrumb-item active">Linux</li>
78
</ol>
9+
<h1 class="mb-4">Generate Linux</h1>
810

911
<div class="card mb-4 col-auto">
1012
<div class="card-header">

‎web/templates/gen-mongodb.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
{{ define "gen-mongodb.html" }}
22

3-
<h1 class="mt-4">데이터 생성 MongoDB</h1>
4-
<ol class="breadcrumb mb-4">
5-
<li class="breadcrumb-item">데이터 생성</li>
3+
<ol class="breadcrumb mb-1" style="margin-top: 66px;">
4+
<li class="breadcrumb-item">Data Migrations</li>
5+
<li class="breadcrumb-item">Generate</li>
6+
<li class="breadcrumb-item">No-SQL Database</li>
67
<li class="breadcrumb-item active">MongoDB</li>
78
</ol>
9+
<h1 class="mb-4">데이터 생성 MongoDB</h1>
810

911
<div class="card mb-4 col-auto">
1012
<div class="card-header">

0 commit comments

Comments
 (0)