Skip to content

Commit a6277f7

Browse files
committed
make the folder browser fixed height and scrollable
increase the width of the modal form for Loading data
1 parent 7b03796 commit a6277f7

File tree

2 files changed

+84
-119
lines changed

2 files changed

+84
-119
lines changed
Lines changed: 73 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,204 +1,164 @@
11
body {
2-
color: #2a2d2b;
3-
background-color: lightgrey;
2+
color: #2a2d2b;
3+
background-color: lightgrey;
44
}
5-
65
h1 {
7-
color: #2a2d2b;
8-
font-size: 50px;
6+
color: #2a2d2b;
7+
font-size: 50px;
98
}
109
h2 {
11-
color: #336699;
10+
color: #336699;
1211
}
1312
h3 {
14-
color: #2a2d2b;
13+
color: #2a2d2b;
1514
}
16-
1715
a:hover {
18-
font-weight: bold;
19-
text-decoration: underline;
16+
font-weight: bold;
17+
text-decoration: underline;
2018
}
21-
2219
ul {
2320
padding-left: 5px;
2421
}
25-
26-
div#header {
22+
div#header {
2723
background-color: #fff;
28-
padding: 15px 15px;
24+
padding: 15px 15px;
2925
color: #ffffff;
3026
}
31-
.btn, div#header .btn, div#content div#sidebar .btn, ul.dropdown-menu{
32-
font-family: "Lucida Grande","Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
33-
font-size: 24px;
34-
margin: 2px;
27+
.btn, div#header .btn, div#content div#sidebar .btn, ul.dropdown-menu {
28+
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
29+
font-size: 24px;
30+
margin: 2px;
3531
}
36-
3732
.btn, div#content .btn {
38-
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
39-
font-size: 18px;
33+
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
34+
font-size: 18px;
4035
}
41-
4236
div#header .alert {
43-
margin: 5px 0px;
44-
text-align: left;
37+
margin: 5px 0px;
38+
text-align: left;
4539
}
46-
4740
.alert {
48-
color: #fff;
41+
color: #fff;
4942
}
50-
5143
.alert-info, .alert-success, .brand-info, .btn-success {
52-
background-color: #4a9e43;
44+
background-color: #4a9e43;
5345
}
54-
5546
.alert-danger, .brand-danger {
56-
background-color: #ff2a00;
47+
background-color: #ff2a00;
5748
}
58-
5949
.brand-primary, .btn-primary {
60-
background-color: #336699;
50+
background-color: #336699;
6151
}
62-
6352
.btn {
64-
color: #fff;
53+
color: #fff;
6554
}
66-
6755
.btn-default {
6856
background-color: #444547;
6957
}
70-
7158
.btn-default:hover {
7259
background-color: #444547;
7360
border-color: #2a2d2b;
7461
color: #fff;
7562
}
76-
7763
.sycned {
78-
color: #4a9e43;
64+
color: #4a9e43;
7965
}
80-
8166
.unsycned {
82-
color: #ff2a00;
67+
color: #ff2a00;
8368
}
84-
8569
div#message {
86-
margin: 0px 5px;
70+
margin: 0px 5px;
8771
}
88-
8972
.divider {
90-
border: 10px solid #2a2d2b;
73+
border: 10px solid #2a2d2b;
9174
}
92-
9375
#content {
94-
min-height: 450px;
95-
padding: 0px;
96-
box-shadow: 0px 5px 5px #888888;
97-
background-color: #fff;
76+
min-height: 450px;
77+
padding: 0px;
78+
box-shadow: 0px 5px 5px #888888;
79+
background-color: #fff;
9880
}
99-
10081
#content .divider {
101-
border: 3px solid #2a2d2b;
102-
margin: 20px -50px;
82+
border: 3px solid #2a2d2b;
83+
margin: 20px -50px;
10384
}
104-
105-
#content h2, #content li>h3, #content li>h4 {
85+
#content h2, #content li>h3, #content li>h4 {
10686
display: inline-block;
10787
margin-right: 10px;
10888
}
109-
11089
#content .btn {
11190
vertical-align: baseline;
11291
}
113-
11492
#footer {
115-
font-size: 12px;
116-
text-align: center;
117-
margin: 10px 0px;
93+
font-size: 12px;
94+
text-align: center;
95+
margin: 10px 0px;
11896
}
119-
12097
ul.alert {
12198
padding-left: 30px;
12299
}
123-
124100
.spacing-top {
125101
margin-top: 10px;
126102
}
127-
128103
div#sitemenu {
129-
text-align: right;
130-
color: #ffffff;
104+
text-align: right;
105+
color: #ffffff;
131106
}
132-
133107
button#headerDropdownMenu {
134108
background-color: #404040;
135109
border: 0px;
136110
color: #ffffff;
137111
}
138-
139112
div#sidebar {
140-
background-color: #444547;
141-
min-height: 450px;
113+
background-color: #444547;
114+
min-height: 450px;
142115
}
143-
144116
div#sidebar h1, div#sidebar h2, div#sidebar h3, div#sidebar a {
145-
color: #fff;
117+
color: #fff;
146118
}
147-
148119
li>h1, li>h2, li>h3, li>h4 {
149120
margin-top: 5px;
150121
margin-bottom: 5px;
151122
}
152-
153123
div#center {
154-
background-color: #fff;
155-
min-height: 450px;
156-
padding: 30px 50px;
124+
background-color: #fff;
125+
min-height: 450px;
126+
padding: 30px 50px;
157127
}
158-
159128
div.button-group-center {
160-
text-align: center;
161-
margin: 30px;
129+
text-align: center;
130+
margin: 30px;
162131
}
163-
164132
div.button-group-right {
165-
float: right;
133+
float: right;
166134
}
167-
168135
.modal-footer {
169136
border-top: 0px;
170137
}
171-
172138
.fa {
173139
margin-right: 10px;
174140
font-size: 36px;
175141
}
176-
177142
li.folder, li.file {
178143
list-style: none;
179144
margin-left: 36px;
180145
}
181-
182146
.row-flex {
183-
display: -webkit-box;
184-
display: -webkit-flex;
185-
display: -ms-flexbox;
186-
display: flex;
147+
display: -webkit-box;
148+
display: -webkit-flex;
149+
display: -ms-flexbox;
150+
display: flex;
187151
}
188-
189152
ul.abn-tree {
190153
padding-left: 30px;
191154
}
192-
193155
ul.abn-tree li.abn-tree-row a {
194156
color: #2a2d2b;
195157
font-size: 18px;
196158
}
197-
198159
ul.nav.abn-tree i {
199160
font-size: 18px;
200161
}
201-
202162
.spinner {
203163
float: right;
204164
position: relative;
@@ -207,51 +167,53 @@ ul.nav.abn-tree i {
207167
z-index: 1000;
208168
color: #ff2a00;
209169
}
210-
211170
.spinner > .child {
212171
position: relative;
213172
left: 50%;
214173
float: right;
215174
z-index: 1000;
216175
}
217-
218176
.fa-spin {
219-
font-size: 80px;
220-
width: 0px;
221-
margin: 0px;
177+
font-size: 80px;
178+
width: 0px;
179+
margin: 0px;
222180
}
223-
224-
.nav, .pagination, .carousel, .panel-title a {
225-
cursor: pointer;
181+
.nav, .pagination, .carousel, .panel-title a {
182+
cursor: pointer;
226183
}
227-
228184
#progressBar {
229-
background-color: #444547;
230-
display: table;
185+
background-color: #444547;
186+
display: table;
231187
height: 450px;
232188
width: 100%;
233189
}
234-
235190
#progressBar > div {
236-
display: table-cell;
191+
display: table-cell;
237192
vertical-align: middle;
238193
}
239-
240194
#progressBar > div {
241-
margin-left: auto;
242-
margin-right: auto;
195+
margin-left: auto;
196+
margin-right: auto;
243197
width: 200px;
244198
}
245-
246199
.progress {
247200
height: 30px;
248201
}
249-
250202
.progress span {
251203
font-size: 25px;
252204
line-height: 20px;
253205
}
254-
255206
.progress-bar {
256207
padding: 3px;
257208
}
209+
210+
.modal-content {
211+
width: 600px;
212+
margin: 0 auto;
213+
}
214+
215+
.tree-scroller-cust1 {
216+
height: 200px;
217+
overflow-y: auto;
218+
border-color: #ddd;
219+
}

quick-start/src/main/resources/static/top/modal/loadDataModal.html

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,17 @@ <h4 class="modal-title" id="myModalLabel">Load Data</h4>
99
<form ng-submit="ok()">
1010
<div class="form-group">
1111
<label for="inputPath">Path</label>
12-
13-
<input class="form-control" name="inputPath" type="text" ng-model="inputPath" placeHolder="Enter Path" required="required" ng-keyup="searchPath($event.keyCode)">
14-
15-
<treecontrol class="tree-classic" tree-model="dataForTheTree"
16-
options="treeOptions" on-node-toggle="onNodeToggle(node,expanded)"
17-
on-selection="onSelection(node,selected)">
18-
{{node.folder}}
19-
</treecontrol>
12+
<input class="form-control" name="inputPath" type="text" ng-model="inputPath"
13+
placeHolder="Enter Path" required="required"
14+
ng-keyup="searchPath($event.keyCode)">
15+
<div class="panel panel-primary tree-scroller-cust1">
16+
<div class="panel-body">
17+
<treecontrol class="tree-classic" tree-model="dataForTheTree"
18+
options="treeOptions" on-node-toggle="onNodeToggle(node,expanded)" on-selection="onSelection(node,selected)">
19+
{{node.folder}}
20+
</treecontrol>
21+
</div>
22+
</div>
2023

2124
</div>
2225
<div class="form-group">

0 commit comments

Comments
 (0)