Skip to content

Commit 2834fa1

Browse files
author
Miguel Solorio
committed
Update list filtering to use icon font
cc @joaomoreno
1 parent a153ad5 commit 2834fa1

11 files changed

Lines changed: 14 additions & 68 deletions

File tree

src/vs/base/browser/ui/list/list.css

Lines changed: 12 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -113,55 +113,28 @@
113113
}
114114

115115
.monaco-list-type-filter > .controls > * {
116+
border: none;
116117
box-sizing: border-box;
117-
width: 16px;
118-
height: 16px;
119-
margin: 0 0 0 2px;
120-
flex-shrink: 0;
121-
}
122-
123-
.monaco-list-type-filter > .controls > .filter {
124118
-webkit-appearance: none;
125119
-moz-appearance: none;
120+
background: none;
126121
width: 16px;
127122
height: 16px;
128-
background: url("media/no-filter-light.svg");
129-
background-position: 50% 50%;
130-
cursor: pointer;
131-
}
132-
133-
.monaco-list-type-filter > .controls > .filter:checked {
134-
background-image: url("media/filter-light.svg");
135-
}
136-
137-
.vs-dark .monaco-list-type-filter > .controls > .filter {
138-
background-image: url("media/no-filter-dark.svg");
139-
}
140-
141-
.vs-dark .monaco-list-type-filter > .controls > .filter:checked {
142-
background-image: url("media/filter-dark.svg");
143-
}
144-
145-
.hc-black .monaco-list-type-filter > .controls > .filter {
146-
background-image: url("media/no-filter-hc.svg");
147-
}
148-
149-
.hc-black .monaco-list-type-filter > .controls > .filter:checked {
150-
background-image: url("media/filter-hc.svg");
151-
}
152-
153-
.monaco-list-type-filter > .controls > .clear {
154-
border: none;
155-
background: url("media/close-light.svg");
123+
flex-shrink: 0;
124+
margin: 0;
125+
padding: 0;
126+
display: flex;
127+
align-items: center;
128+
justify-content: center;
156129
cursor: pointer;
157130
}
158131

159-
.vs-dark .monaco-list-type-filter > .controls > .clear {
160-
background-image: url("media/close-dark.svg");
132+
.monaco-list-type-filter > .controls > .filter:checked::before {
133+
content: "\eb83" !important; /* codicon-list-filter */
161134
}
162135

163-
.hc-black .monaco-list-type-filter > .controls > .clear {
164-
background-image: url("media/close-hc.svg");
136+
.monaco-list-type-filter > .controls > .filter {
137+
margin-left: 4px;
165138
}
166139

167140
.monaco-list-type-filter-message {

src/vs/base/browser/ui/list/media/close-dark.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/close-hc.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/close-light.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/filter-dark.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/filter-hc.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/filter-light.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/no-filter-dark.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/no-filter-hc.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/vs/base/browser/ui/list/media/no-filter-light.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

0 commit comments

Comments
 (0)