Cleaner note icon rendering

Before: We drew 2 fontawesome comment icons, on on top of the other
After: Moved icon into iD spritesheet and gave it an actual `stroke` property that can be styled
This commit is contained in:
Bryan Housel
2018-07-16 13:17:17 -04:00
parent 33de399bac
commit 70f87632c7
7 changed files with 29 additions and 35 deletions
+6 -9
View File
@@ -3,7 +3,7 @@
.layer-notes {
pointer-events: none;
}
.layer-notes .note .note-shadow {
.layer-notes .note * {
pointer-events: none;
}
.layer-notes .note .note-fill {
@@ -19,29 +19,26 @@
.note-header-icon .note-fill,
.layer-notes .note .note-fill {
color: #ff3300;
stroke: #333;
}
.note-header-icon.closed .note-fill,
.layer-notes .note.closed .note-fill {
color: #55dd00;
stroke: #333;
}
.layer-notes .note.hovered .note-fill {
color: #eebb00;
stroke: #333;
}
.layer-notes .note.selected .note-fill {
color: #ffee00;
stroke: #333;
}
/* slight adjustments to preset icon for note icons */
.note-header-icon .preset-icon-28 {
top: 18px;
}
.note-header-icon .preset-icon-24 {
top: 20px;
}
.note-header-icon .preset-icon-24 .icon.note-fill {
width: 25px;
height: 23px;
}
/* OSM Note UI */
.note-header {
@@ -149,4 +146,4 @@
.note-report {
float: right;
}
}