luci-base: replace filebrowser icons with SVG variants

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

diff --git a/modules/luci-base/htdocs/luci-static/resources/cbi/file.svg b/modules/luci-base/htdocs/luci-static/resources/cbi/file.svg
new file mode 100644 (file)
index 0000000..9feedcf
--- /dev/null
+++ b/modules/luci-base/htdocs/luci-static/resources/cbi/file.svg
@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
+       <defs>
+               <radialGradient id="a" cx="0" cy="1" r="1">
+                       <stop offset="0" stop-color="#89b"/>
+                       <stop offset="1" stop-color="#def"/>
+               </radialGradient>
+       </defs>
+       <g stroke="#000" stroke-width="2">
+               <path d="M9 2h23l2 1 9 9 1 2v31l-2 1H9l-1-1V4l1-2z" fill="url(#a)"/>
+               <path d="M32 2v11l1 1h11" fill="url(#a)"/>
+       </g>
+</svg>

diff --git a/modules/luci-base/htdocs/luci-static/resources/cbi/folder.svg b/modules/luci-base/htdocs/luci-static/resources/cbi/folder.svg
new file mode 100644 (file)
index 0000000..9a5beca
--- /dev/null
+++ b/modules/luci-base/htdocs/luci-static/resources/cbi/folder.svg
@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
+  <defs>
+    <radialGradient id="a" cx="0" cy="0" r="1">
+      <stop offset="0" stop-color="#ddf"/>
+      <stop offset="1" stop-color="#46b"/>
+    </radialGradient>
+  </defs>
+  <g stroke="#024" stroke-width="2">
+    <path d="M44 14l1 2v25l-1 1H4l-1-1V18v0l1-6 1-2h17l2 2v1l1 1z" fill="url(#a)"/>
+    <path d="M3 18h21l1-1v-3" fill="none"/>
+  </g>
+</svg>

diff --git a/modules/luci-base/htdocs/luci-static/resources/cbi/link.svg b/modules/luci-base/htdocs/luci-static/resources/cbi/link.svg
new file mode 100644 (file)
index 0000000..3f556fb
--- /dev/null
+++ b/modules/luci-base/htdocs/luci-static/resources/cbi/link.svg
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
+       <defs>
+               <radialGradient id="a" cx="0" cy="1" r="1">
+                       <stop offset="0" stop-color="#89b"/>
+                       <stop offset="1" stop-color="#def"/>
+               </radialGradient>
+       </defs>
+       <g stroke="#000" stroke-width="2">
+               <path d="M9 2h23l2 1 9 9 1 2v31l-2 1H9l-1-1V4l1-2z" fill="url(#a)"/>
+               <path d="M32 2v11l1 1h11" fill="url(#a)"/>
+       </g>
+       <path d="M13 33h13v6l12-10-12-11v7H13z" fill="#035"/>
+</svg>

diff --git a/modules/luci-base/htdocs/luci-static/resources/ui.js b/modules/luci-base/htdocs/luci-static/resources/ui.js
index 822b572a3d8df998a8429c1001aa2ee62be1082e..1f9a436f1387fbe9d2059afb214e055048969d94 100644 (file)
--- a/modules/luci-base/htdocs/luci-static/resources/ui.js
+++ b/modules/luci-base/htdocs/luci-static/resources/ui.js
@@ -2611,21 +2611,24 @@ var UIFileUpload = UIElement.extend(/** @lends LuCI.ui.FileUpload.prototype */ {
                switch (type) {
                case 'symlink':
                        return E('img', {
-                               'src': L.resource('cbi/link.gif'),
+                               'src': L.resource('cbi/link.svg'),
+                               'width': 16,
                                'title': _('Symbolic link'),
                                'class': 'middle'
                        });
 
                case 'directory':
                        return E('img', {
-                               'src': L.resource('cbi/folder.gif'),
+                               'src': L.resource('cbi/folder.svg'),
+                               'width': 16,
                                'title': _('Directory'),
                                'class': 'middle'
                        });
 
                default:
                        return E('img', {
-                               'src': L.resource('cbi/file.gif'),
+                               'src': L.resource('cbi/file.svg'),
+                               'width': 16,
                                'title': _('File'),
                                'class': 'middle'
                        });