Merge branch 'feature/ivette/toolbar-icons' into 'master'

[ivette] Fix toolbar styling and added new icons

See merge request frama-c/frama-c!4585

ivette/src/dome/renderer/controls/gallery.json

@@ -94,6 +94,18 @@
     "viewBox": "0 0 16 16",
     "path": "M14 0h-14v16h16v-14l-2-2zM8 2h2v4h-2v-4zM14 14h-12v-12h1v5h9v-5h1.172l0.828 0.828v11.172z"
   },
+  "UPLOAD": {
+    "section": "Tools",
+    "viewBox": "0 0 16 16",
+    "title": "Upload",
+    "path": "M7.5 11h-7.5v4h15v-4h-7.5zM14 13h-2v-1h2v1zM3.5 5l4-4 4 4h-2.5v5h-3v-5z"
+  },
+  "DOWNLOAD": {
+    "section": "Tools",
+    "title": "Download",
+    "viewBox": "0 0 16 16",
+    "path": "M11.5 7l-4 4-4-4h2.5v-6h3v6zM7.5 11h-7.5v4h15v-4h-7.5zM14 13h-2v-1h2v1z"
+  },
   "DUPLICATE": {
     "section": "Tools",
     "title": "Duplicate",
@@ -102,14 +114,14 @@
   },
   "LOCK": {
     "section": "Tools",
-    "title":"Lock",
-    "viewBox":"0 0 16 16",
+    "title": "Lock",
+    "viewBox": "0 0 16 16",
     "path": "M12.249 6.5h-0.25v-3c0-1.654-1.346-3-3-3h-2c-1.654 0-3 1.346-3 3v3h-0.25c-0.413 0-0.75 0.338-0.75 0.75v7.5c0 0.412 0.337 0.75 0.75 0.75h8.5c0.412 0 0.75-0.338 0.75-0.75v-7.5c0-0.412-0.338-0.75-0.75-0.75zM5.999 3.5c0-0.551 0.449-1 1-1h2c0.551 0 1 0.449 1 1v3h-4v-3z"
   },
   "EDIT": {
     "section": "Tools",
-    "title":"Edit",
-    "viewBox":"0 0 16 16",
+    "title": "Edit",
+    "viewBox": "0 0 16 16",
     "path": "M13.5 0c1.381 0 2.5 1.119 2.5 2.5 0 0.563-0.186 1.082-0.5 1.5l-1 1-3.5-3.5 1-1c0.418-0.314 0.937-0.5 1.5-0.5zM1 11.5l-1 4.5 4.5-1 9.25-9.25-3.5-3.5-9.25 9.25zM11.181 5.681l-7 7-0.862-0.862 7-7 0.862 0.862z"
   },
   "CHECK": {
@@ -193,10 +205,16 @@
   },
   "DISPLAY": {
     "section": "Desktop",
-    "viewBox": "0 0 24 24",
     "title": "Display",
+    "viewBox": "0 0 24 24",
     "path": "M21 15.984v-12h-18v12h18zM21 2.016q0.797 0 1.406 0.586t0.609 1.383v12q0 0.797-0.609 1.406t-1.406 0.609h-6.984v2.016h1.969v1.969h-7.969v-1.969h1.969v-2.016h-6.984q-0.797 0-1.406-0.609t-0.609-1.406v-12q0-0.797 0.609-1.383t1.406-0.586h18z"
   },
+  "TABLE": {
+    "section": "Desktop",
+    "title": "Table",
+    "viewBox": "0 0 16 16",
+    "path": "M0 1v14h16v-14h-16zM6 10v-3h4v3h-4zM10 11v3h-4v-3h4zM10 3v3h-4v-3h4zM5 3v3h-4v-3h4zM1 7h4v3h-4v-3zM11 7h4v3h-4v-3zM11 6v-3h4v3h-4zM1 11h4v3h-4v-3zM11 14v-3h4v3h-4z"
+  },
   "ITEMS.GRID": {
     "section": "Desktop",
     "viewBox": "0 0 16 16",
@@ -227,6 +245,30 @@
     "viewBox": "0 0 24 24",
     "path": "M19.661 5.089q0.375 0.375 0.643 1.018t0.268 1.179v15.429q0 0.536-0.375 0.911t-0.911 0.375h-18q-0.536 0-0.911-0.375t-0.375-0.911v-21.429q0-0.536 0.375-0.911t0.911-0.375h12q0.536 0 1.179 0.268t1.018 0.643zM13.714 1.821v5.036h5.036q-0.134-0.388-0.295-0.549l-4.192-4.192q-0.161-0.161-0.549-0.295zM18.857 22.286v-13.714h-5.571q-0.536 0-0.911-0.375t-0.375-0.911v-5.571h-10.286v20.571h17.143z"
   },
+  "LIGHT": {
+    "section": "Desktop",
+    "title": "Light",
+    "viewBox": "0 0 16 16",
+    "path": "M8 13c0.552 0 1 0.448 1 1v1c0 0.552-0.448 1-1 1s-1-0.448-1-1v-1c0-0.552 0.448-1 1-1zM8 3c-0.552 0-1-0.448-1-1v-1c0-0.552 0.448-1 1-1s1 0.448 1 1v1c0 0.552-0.448 1-1 1zM15 7c0.552 0 1 0.448 1 1s-0.448 1-1 1h-1c-0.552 0-1-0.448-1-1s0.448-1 1-1h1zM3 8c0 0.552-0.448 1-1 1h-1c-0.552 0-1-0.448-1-1s0.448-1 1-1h1c0.552 0 1 0.448 1 1zM12.95 11.536l0.707 0.707c0.39 0.39 0.39 1.024 0 1.414s-1.024 0.39-1.414 0l-0.707-0.707c-0.39-0.39-0.39-1.024 0-1.414s1.024-0.39 1.414 0zM3.050 4.464l-0.707-0.707c-0.391-0.391-0.391-1.024 0-1.414s1.024-0.391 1.414 0l0.707 0.707c0.391 0.391 0.391 1.024 0 1.414s-1.024 0.391-1.414 0zM12.95 4.464c-0.39 0.391-1.024 0.391-1.414 0s-0.39-1.024 0-1.414l0.707-0.707c0.39-0.391 1.024-0.391 1.414 0s0.39 1.024 0 1.414l-0.707 0.707zM3.050 11.536c0.39-0.39 1.024-0.39 1.414 0s0.391 1.024 0 1.414l-0.707 0.707c-0.391 0.39-1.024 0.39-1.414 0s-0.391-1.024 0-1.414l0.707-0.707z M8 4c-2.209 0-4 1.791-4 4s1.791 4 4 4c2.209 0 4-1.791 4-4s-1.791-4-4-4zM8 10.5c-1.381 0-2.5-1.119-2.5-2.5s1.119-2.5 2.5-2.5 2.5 1.119 2.5 2.5-1.119 2.5-2.5 2.5z"
+  },
+  "THEME": {
+    "section": "Desktop",
+    "title": "Theme",
+    "viewBox": "0 0 16 16",
+    "path": "M8 4c-2.209 0-4 1.791-4 4s1.791 4 4 4 4-1.791 4-4-1.791-4-4-4zM8 10.5v-5c1.379 0 2.5 1.122 2.5 2.5s-1.121 2.5-2.5 2.5zM8 13c0.552 0 1 0.448 1 1v1c0 0.552-0.448 1-1 1s-1-0.448-1-1v-1c0-0.552 0.448-1 1-1zM8 3c-0.552 0-1-0.448-1-1v-1c0-0.552 0.448-1 1-1s1 0.448 1 1v1c0 0.552-0.448 1-1 1zM15 7c0.552 0 1 0.448 1 1s-0.448 1-1 1h-1c-0.552 0-1-0.448-1-1s0.448-1 1-1h1zM3 8c0 0.552-0.448 1-1 1h-1c-0.552 0-1-0.448-1-1s0.448-1 1-1h1c0.552 0 1 0.448 1 1zM12.95 11.536l0.707 0.707c0.39 0.39 0.39 1.024 0 1.414s-1.024 0.39-1.414 0l-0.707-0.707c-0.39-0.39-0.39-1.024 0-1.414s1.024-0.39 1.414 0zM3.050 4.464l-0.707-0.707c-0.391-0.391-0.391-1.024 0-1.414s1.024-0.391 1.414 0l0.707 0.707c0.391 0.391 0.391 1.024 0 1.414s-1.024 0.391-1.414 0zM12.95 4.464c-0.39 0.391-1.024 0.391-1.414 0s-0.39-1.024 0-1.414l0.707-0.707c0.39-0.391 1.024-0.391 1.414 0s0.39 1.024 0 1.414l-0.707 0.707zM3.050 11.536c0.39-0.39 1.024-0.39 1.414 0s0.391 1.024 0 1.414l-0.707 0.707c-0.391 0.39-1.024 0.39-1.414 0s-0.391-1.024 0-1.414l0.707-0.707z"
+  },
+  "CHECKBOX.ON": {
+    "section": "Buttons",
+    "title": "Checked box",
+    "viewBox": "0 0 16 16",
+    "path": "M14 0h-12c-1.1 0-2 0.9-2 2v12c0 1.1 0.9 2 2 2h12c1.1 0 2-0.9 2-2v-12c0-1.1-0.9-2-2-2zM7 12.414l-3.707-3.707 1.414-1.414 2.293 2.293 4.793-4.793 1.414 1.414-6.207 6.207z"
+  },
+  "CHECKBOX.OFF": {
+    "section": "Buttons",
+    "title": "Unchecked box",
+    "viewBox": "0 0 16 16",
+    "path": "M14 0h-12c-1.1 0-2 0.9-2 2v12c0 1.1 0.9 2 2 2h12c1.1 0 2-0.9 2-2v-12c0-1.1-0.9-2-2-2zM14 14h-12v-12h12v12z"
+  },
   "CIRC.PLUS": {
     "section": "Buttons",
     "title": "Add",

ivette/src/dome/renderer/dark.css

@@ -42,7 +42,7 @@
     --default-button-color: #3c495b;
     --default-led-img: radial-gradient(circle at center, #5f92b9, #4189bf);
     --default-button-img: linear-gradient(to bottom, #3c495b 0%, #455164 100%);
-    --default-button-hover: #364355;
+    --default-button-hover: #154240;
     --default-button-active: #303d4f;
 
     --primary-button-color: #146bbf;
@@ -72,8 +72,8 @@
     --cancel-button-hover: #0e2638;
     --cancel-button-active: #041c2e;
 
-    --selected-button-img: #355174;
-    --selected-button-hover: #456184;
+    --selected-button-img: #336cb3;
+    --selected-button-hover: #116cdc;
 
     --activated-button-color: #348bdf;
     --activated-button-hover: #b53d9e;

ivette/src/dome/renderer/frame/style.css

@@ -290,7 +290,7 @@
     flex: 0 0 auto ;
     height: 21px ;
     margin: 6px 5px 6px 5px ;
-    padding: 0px 4px 2px 4px ;
+    padding: 2px 5px 2px 5px ;
     box-shadow: 0 1px 1px rgba(0, 0, 0, .06);
     border: 1px solid transparent;
     border-radius: 4px;

ivette/src/dome/renderer/frame/toolbars.tsx

@@ -192,7 +192,7 @@ export function Button<A = undefined>(
       onContextMenu={onContextMenu && ((evt) => onContextMenu(value, evt))}
       title={props.title}
     >
-      {props.icon && <SVG id={props.icon} />}
+      {props.icon && <SVG offset={-1} id={props.icon} />}
       {props.label && <label>{props.label}</label>}
       {props.children}
     </button>