Skip to content

Commit 74994d1

Browse files
marcgurneyThomas Rueckstiess
authored andcommitted
sidebar style tweaks
1 parent 2bb907e commit 74994d1

File tree

2 files changed

+46
-16
lines changed

2 files changed

+46
-16
lines changed

src/sidebar/instance-properties.jade

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,6 @@ div.instance-properties
99
|  DBs
1010
span.num-collections
1111
strong(data-hook='num-collections')
12-
|  Colls.
12+
|  Collections
1313
button.refresh-collections
1414
i.fa.fa-repeat

styles/sidebar.less

Lines changed: 45 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
.instance-properties {
1919
position: absolute;
2020
top: 78px;
21-
left: 30px;
21+
left: 10px;
2222

2323
.hostname {
2424
display: block;
@@ -29,13 +29,16 @@
2929
}
3030
.version {
3131
display: block;
32-
font-size: 14px;
32+
font-size: 13px;
33+
line-height: 14px;
3334
font-weight: normal;
3435
color: @gray5;
3536
}
3637
.db-stats {
3738
color: @gray5;
38-
margin-top: 6px;
39+
margin-top: 8px;
40+
font-style: 13px;
41+
line-height: 13px;
3942

4043
.num-databases,
4144
.num-collections {
@@ -45,14 +48,22 @@
4548
margin-right: 10px;
4649
}
4750
strong {
48-
color: @pw;
51+
color: @gray7;
4952
font-weight: bold;
5053
}
5154
button.refresh-collections {
5255
background: none;
5356
border: none;
54-
color: @pw;
55-
font-size: 14px;
57+
color: @gray7;
58+
font-size: 13px;
59+
border-radius: 2px;
60+
padding: 4px 5px;
61+
transition: all 150ms ease;
62+
63+
&:hover {
64+
background: @slate0;
65+
color: @pw;
66+
}
5667
}
5768
}
5869
}
@@ -61,26 +72,45 @@
6172
position: absolute;
6273
top: 156px;
6374
width: 100%;
64-
padding-bottom: 12px;
75+
// padding-bottom: 12px;
6576
box-shadow: 0 2px 0 rgba(0,0,0,0.2);
6677

6778
i.search {
6879
.octicon;
6980
position: absolute;
7081
margin-top: 9px;
7182
margin-left: 10px;
72-
color: @gray5;
83+
color: @gray7;
7384
}
85+
// input {
86+
// padding: 0;
87+
// margin-left: 30px;
88+
// margin-top: 7px;
89+
// height: auto;
90+
// background: @slate1;
91+
// color: @pw;
92+
// width: 174px;
93+
// border: none;
94+
// border-bottom: 1px solid lighten(@slate1, 5%);
95+
// }
96+
// input[type=search] {
97+
// border-radius: 18px;
98+
// }
7499
input {
75-
padding: 0;
76-
margin-left: 30px;
77-
margin-top: 7px;
100+
padding: 7px 5px 5px 30px;
78101
height: auto;
79-
background: @slate1;
102+
background: lighten(@slate1, 5%);
80103
color: @pw;
81-
width: 174px;
104+
width: 100%;
82105
border: none;
83-
border-bottom: 1px solid lighten(@slate1, 5%);
106+
transition: all 150ms ease;
107+
108+
&:focus {
109+
background: lighten(@slate1, 8%);
110+
}
111+
}
112+
input::-webkit-input-placeholder {
113+
color: @gray5;
84114
}
85115
// input[type=search] {
86116
// border-radius: 18px;
@@ -93,7 +123,7 @@
93123
.list-group {
94124
line-height: 24px;
95125
position: absolute;
96-
top: 196px;
126+
top: 189px;
97127
bottom: 0px;
98128
overflow-y: auto;
99129
width: 100%;

0 commit comments

Comments
 (0)