Browse Source

created/added clearIcon

telamonian 5 years ago
parent
commit
04688daf19

+ 5 - 5
packages/logconsole-extension/src/index.tsx

@@ -37,7 +37,7 @@ import { IStatusBar } from '@jupyterlab/statusbar';
 
 import {
   addIcon,
-  closeIcon,
+  clearIcon,
   HTMLSelect,
   listIcon
 } from '@jupyterlab/ui-components';
@@ -225,7 +225,7 @@ function activateLogConsole(
     execute: () => {
       logConsolePanel?.logger?.clear();
     },
-    icon: closeIcon,
+    icon: clearIcon,
     isEnabled: () => !!logConsolePanel && logConsolePanel.source !== null,
     label: 'Clear Log'
   });
@@ -235,14 +235,14 @@ function activateLogConsole(
   }
 
   app.commands.addCommand(CommandIDs.setLevel, {
-    label: args => `Set Log Level to ${toTitleCase(args.level as string)}`,
+    // TODO: find good icon class
     execute: (args: { level: LogLevel }) => {
       if (logConsolePanel?.logger) {
         logConsolePanel.logger.level = args.level;
       }
     },
-    isEnabled: () => !!logConsolePanel && logConsolePanel.source !== null
-    // TODO: find good icon class
+    isEnabled: () => !!logConsolePanel && logConsolePanel.source !== null,
+    label: args => `Set Log Level to ${toTitleCase(args.level as string)}`
   });
 
   app.contextMenu.addItem({

+ 2 - 0
packages/ui-components/src/icon/iconimports.ts

@@ -22,6 +22,7 @@ import caseSensitiveSvgstr from '../../style/icons/search/case-sensitive.svg';
 import checkSvgstr from '../../style/icons/toolbar/check.svg';
 import circleEmptySvgstr from '../../style/icons/toolbar/circle-empty.svg';
 import circleSvgstr from '../../style/icons/toolbar/circle.svg';
+import clearSvgstr from '../../style/icons/toolbar/clear.svg';
 import closeSvgstr from '../../style/icons/toolbar/close.svg';
 import consoleSvgstr from '../../style/icons/filetype/console.svg';
 import copySvgstr from '../../style/icons/toolbar/copy.svg';
@@ -88,6 +89,7 @@ export const caseSensitiveIcon = new LabIcon({ name: 'ui-components:case-sensiti
 export const checkIcon = new LabIcon({ name: 'ui-components:check', svgstr: checkSvgstr });
 export const circleEmptyIcon = new LabIcon({ name: 'ui-components:circle-empty', svgstr: circleEmptySvgstr });
 export const circleIcon = new LabIcon({ name: 'ui-components:circle', svgstr: circleSvgstr });
+export const clearIcon = new LabIcon({ name: 'ui-components:clear', svgstr: clearSvgstr });
 export const closeIcon = new LabIcon({ name: 'ui-components:close', svgstr: closeSvgstr });
 export const consoleIcon = new LabIcon({ name: 'ui-components:console', svgstr: consoleSvgstr });
 export const copyIcon = new LabIcon({ name: 'ui-components:copy', svgstr: copySvgstr });

+ 4 - 0
packages/ui-components/style/deprecated.css

@@ -26,6 +26,7 @@
   --jp-icon-check: url('icons/toolbar/check.svg');
   --jp-icon-circle-empty: url('icons/toolbar/circle-empty.svg');
   --jp-icon-circle: url('icons/toolbar/circle.svg');
+  --jp-icon-clear: url('icons/toolbar/clear.svg');
   --jp-icon-close: url('icons/toolbar/close.svg');
   --jp-icon-console: url('icons/filetype/console.svg');
   --jp-icon-copy: url('icons/toolbar/copy.svg');
@@ -122,6 +123,9 @@
 .jp-CircleIcon {
   background-image: var(--jp-icon-circle);
 }
+.jp-ClearIcon {
+  background-image: var(--jp-icon-clear);
+}
 .jp-CloseIcon {
   background-image: var(--jp-icon-close);
 }

+ 11 - 0
packages/ui-components/style/icons/toolbar/clear.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <mask id="donutHole">
+    <rect height="24" width="24" fill="white" />
+    <circle cx="12" cy="12" r="8" fill="black"/>
+  </mask>
+
+  <g class="jp-icon3" fill="#616161">
+    <rect height="18" width="2" x="11" y="3" transform="rotate(315, 12, 12)"/>
+    <circle cx="12" cy="12" r="10" mask="url(#donutHole)"/>
+  </g>
+</svg>