better grid styles to set myself up for better line icons.

This commit is contained in:
Saman Bemel-Benrud
2013-03-14 19:34:38 -04:00
parent a81b2f20ce
commit aa12a2c312
3 changed files with 36 additions and 19 deletions
+23 -7
View File
@@ -683,6 +683,15 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;}
padding-bottom: 0;
}
.tag-wrap .grid-button-wrap {
padding: 0;
height: 110px;
}
.tag-wrap .grid-button-wrap .grid-entry {
border-top: 0;
}
.preset-section.inspector-inner:last-of-type {
padding-bottom: 20px;
}
@@ -1005,7 +1014,6 @@ div.combobox {
border-bottom-right-radius: 4px;
}
.tag-row input.key {
border-left: 1px solid #ccc;
}
@@ -1053,12 +1061,19 @@ div.combobox {
/* Preset grid */
.preset-grid {
padding: 20px 10px 20px 20px;
}
.grid-button-wrap {
padding: 0 10px 10px 0;
height: 120px;
}
.grid-entry {
height: 110px;
width: 100%;
height: 100%;
position: relative;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-radius: 0;
border: 1px solid #ccc;
overflow: hidden;
}
@@ -1066,7 +1081,7 @@ div.combobox {
margin-bottom: 20px;
}
.preset-grid.filtered .grid-entry:first-child {
.preset-grid.filtered .grid-button-wrap:first-child .grid-entry {
background: #ececec;
}
@@ -1092,7 +1107,7 @@ div.combobox {
.preset-inspect {
position: relative;
background: white;
border-bottom: 1px solid #ccc;
padding-bottom: 20px;
}
.grid-entry .preset-icon-fill.area {
@@ -1114,6 +1129,7 @@ div.combobox {
.grid-entry .label {
font-weight: bold;
background: #f6f6f6;
text-align: center;
display: block;
position: absolute;
+8 -6
View File
@@ -20,7 +20,7 @@ iD.ui.PresetGrid = function(context) {
.attr('class', 'preset-grid-search-wrap inspector-inner');
var grid = selection.append('div')
.attr('class', 'preset-grid inspector-body fillL2 inspector-body-' + entity.geometry(context.graph()))
.attr('class', 'preset-grid inspector-body fillL inspector-body-' + entity.geometry(context.graph()))
.call(drawGrid, context.presets().defaults(entity, 12));
searchwrap.append('span').attr('class', 'icon search');
@@ -94,9 +94,11 @@ iD.ui.PresetGrid = function(context) {
.data(presets.collection.slice(0, 12), name);
var entered = entries.enter()
.append('button')
.attr('class', 'grid-entry col3')
.on('click', choose);
.append('div')
.attr('class','grid-button-wrap col3')
.append('button')
.attr('class', 'grid-entry')
.on('click', choose);
entered.append('div')
.attr('class', function(d) {
@@ -140,10 +142,10 @@ iD.ui.PresetGrid = function(context) {
if (this === entry) index = i;
});
var selector = '.grid-entry:nth-child(' + (Math.floor(index/4) * 4 + 5 ) + ')';
var selector = '.grid-button-wrap:nth-child(' + (Math.floor(index/4) * 4 + 5 ) + ')';
presetinspect = selection.insert('div', selector)
.attr('class', 'inspector-inner preset-inspect col12')
.attr('class', 'preset-inspect col12')
.datum(d);
presetinspect.append('h2').text(d.title || d.name);
+5 -6
View File
@@ -53,14 +53,13 @@ iD.ui.TagEditor = function(context) {
var headerwrap = editorwrap.append('div').attr('class','col12 head');
var typewrap = headerwrap.append('div')
.attr('class','col3 type');
var typebutton = typewrap.append('div')
.attr('class','col12 grid-entry fillL');
var typebutton = headerwrap.append('div')
.attr('class','grid-button-wrap col3')
.append('div')
.attr('class','col12 grid-entry fillL');
typebutton.append('div')
.attr('class', 'icon icon-pre-text' + (preset ? ' preset-' + (preset.icon || 'marker-stroked') : ''));
.attr('class', 'icon' + (preset ? ' preset-' + (preset.icon || 'marker-stroked') : ''));
typebutton.node().focus();