diff --git a/css/app.css b/css/app.css
index b16cfe7cc..359f3b25e 100644
--- a/css/app.css
+++ b/css/app.css
@@ -28,6 +28,14 @@ h3 {
line-height:30px;
}
+h4 {
+ font-size: 12px;
+ font-weight: normal;
+ font-style: italic;
+ line-height: 20px;
+ padding-bottom: 10px;
+}
+
:focus {
outline-color: transparent;
outline-style: none;
@@ -56,17 +64,14 @@ a:hover {
input[type=text] {
background-color: white;
- width:150px;
- line-height:20px;
- height:20px;
+ height:30px;
border:1px solid #ccc;
- padding: 5px;
+ padding:4px 10px;
margin:0;
- box-shadow: inset 0 0 3px 0 rgba(0,0,0,.25);;
}
input[type=text]:focus {
- border-color:#aaa;
+ background-color: #ececec;
}
/* tables */
@@ -174,7 +179,7 @@ button.Browse {
button.minor {
height: 20px;
width: 20px;
- margin: 0;
+ margin: 5px;
}
.buttons-joined {
@@ -362,6 +367,10 @@ button.Browse .label {
padding: 10px;
}
+.inspector-inner.head {
+ border-bottom: 1px solid #ccc;
+}
+
.inspector-inner button {
position: absolute;
top: 0;
@@ -390,26 +399,30 @@ button.Browse .label {
}
.input-wrap {
- position: absolute;
- left: 0px;
- right: 80px;
+ position: relative;
+ margin-top: -1px;
}
.tag-row input {
width: 50%;
- margin:0;
- height: 30px;
- padding:4px;
- border:1px solid #ccc;
border-right: 0;
- border-top: 0;
- background:#fff;
}
+.tag-row input.key {
+ font-weight: bold;
+}
+
+.tag-row:first-child input {
+ border-top: 1px solid #ccc;
+}
.tag-row input.value {
border-right: 1px solid #ccc;
}
+.inspector-buttons {
+ border-top: 1px solid #ccc;
+}
+
/* Map Controls */
.map-control {
@@ -454,7 +467,7 @@ button.Browse .label {
}
.opacity-options-wrapper {
- padding: 10px;
+ padding: 10px 10px 0 10px;
}
.opacity-options {
@@ -462,7 +475,9 @@ button.Browse .label {
background: url(../img/background-pattern-opacity.png) 0 0 repeat;
height:20px;
width:62px;
- float: right;
+ position: absolute;
+ right: 10px;
+ top: 10px;
}
.opacity-options li {
@@ -568,17 +583,30 @@ img.tile {
margin-left:10px;
}
+/* typeahead dropdowns
+------------------------------------------------------- */
+
div.typeahead {
- background:#fff;
- width:148px;
- border:1px solid #ccc;
+ width:200px;
+ z-index: 9999;
+ box-shadow: 0 5px 10px 0 rgba(0,0,0,.2);
+ margin-top: -1px;
}
div.typeahead a {
+ height: 30px;
+ border:1px solid #ccc;
+ border-top: 0;
+ background-color: #fff;
padding:1px 4px;
display:block;
}
+div.typeahead a:first-child {
+ border-top: 1px solid #ccc;
+}
+
+
/* Modals
------------------------------------------------------- */
diff --git a/img/source/design.svg b/img/source/design.svg
index 401817c2d..8206480f0 100644
--- a/img/source/design.svg
+++ b/img/source/design.svg
@@ -391,10 +391,10 @@
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="1"
- inkscape:cx="245.71977"
- inkscape:cy="806.33291"
+ inkscape:cx="890.32523"
+ inkscape:cy="742.11499"
inkscape:document-units="px"
- inkscape:current-layer="layer1"
+ inkscape:current-layer="layer13"
showgrid="false"
inkscape:window-width="1543"
inkscape:window-height="834"
@@ -538,7 +538,7 @@
image/svg+xml
-
+
@@ -589,7 +589,7 @@
id="g48109-9">
+ style="display:inline">
+
Layers")
- .append('ul')
+
+ opa.append('h4').text('Layers')
+
+ opa.append('ul')
.attr('class', 'opacity-options')
.selectAll('div.opacity')
.data(opacities)
@@ -76,6 +78,7 @@ iD.layerswitcher = function(map) {
.style('opacity', function(d) {
return d;
});
+
// Make sure there is an active selection by default
d3.select('.opacity-options li').classed('selected', true);