diff --git a/ivette/src/frama-c/index.tsx b/ivette/src/frama-c/index.tsx index 33a5b74233eba561b64edf5bbdc5cf9aeea2496b..4e1db38c729e012431667c3997fe795b5ff4d1d9 100644 --- a/ivette/src/frama-c/index.tsx +++ b/ivette/src/frama-c/index.tsx @@ -50,6 +50,8 @@ Menu.init(); Ivette.registerSidebar({ id: 'fc.kernel.globals', label: 'AST', + icon: 'DUPLICATE', + title: 'Global Declarations (AST)', children: <Globals /> }); diff --git a/ivette/src/frama-c/kernel/Globals.tsx b/ivette/src/frama-c/kernel/Globals.tsx index 1a6b90c4e2461462afe312c947c1975e27f733ba..cee66e33d4c3062a2e6c4e3fe1f19d2a6f28d053 100644 --- a/ivette/src/frama-c/kernel/Globals.tsx +++ b/ivette/src/frama-c/kernel/Globals.tsx @@ -122,7 +122,7 @@ function List(props: ListProps): JSX.Element { let contents; - if (count <= 0) { + if (count <= 0 && total > 0) { contents = <div className='dome-xSideBarSection-content'> <label className='globals-info'> diff --git a/ivette/src/ivette/index.tsx b/ivette/src/ivette/index.tsx index 07a86f9247f8f773ef367f7945042850cbfacd8d..7eefab232b3beaee2f6d3608d2f004bf6599c299 100644 --- a/ivette/src/ivette/index.tsx +++ b/ivette/src/ivette/index.tsx @@ -202,7 +202,7 @@ export function TitleBar(props: TitleBarProps): JSX.Element | null { /* -------------------------------------------------------------------------- */ export interface SidebarProps extends ContentProps { - iconPath?: string; + icon?: string; } export interface ToolProps { diff --git a/ivette/src/ivette/laboratory.tsx b/ivette/src/ivette/laboratory.tsx index 01cbdaacb3077c2301ad50422f738cc9b0523788..ff26adc019275bd62339f2240297aaac49b8de38 100644 --- a/ivette/src/ivette/laboratory.tsx +++ b/ivette/src/ivette/laboratory.tsx @@ -1239,9 +1239,10 @@ function ViewBar(): JSX.Element { } Ivette.registerSidebar({ - id: "ivette.views", - label: "Views", - title: "View Selector", + id: 'ivette.views', + label: 'Views', + icon: 'DISPLAY', + title: 'Views & Components Selector', children: <ViewBar />, }); diff --git a/ivette/src/renderer/Sidebar.tsx b/ivette/src/renderer/Sidebar.tsx index facd523435a83b25c090d2c4e9b220a20787ab16..b9c6b5d71b47a17618d93fb2044c229b3b9727ae 100644 --- a/ivette/src/renderer/Sidebar.tsx +++ b/ivette/src/renderer/Sidebar.tsx @@ -26,6 +26,7 @@ import React from 'react'; import * as Dome from 'dome'; +import { Icon } from 'dome/controls/icons'; import { SideBar } from 'dome/frame/sidebars'; import { Catch } from 'dome/errors'; import { classes } from 'dome/misc/utils'; @@ -42,16 +43,17 @@ interface SelectorProps extends SidebarProps { } function Selector(props: SelectorProps): JSX.Element { - const { id, iconPath, selected, setSelected, label, title } = props; + const { id, icon, selected, setSelected, label } = props; const className = classes( 'sidebar-selector', 'dome-color-frame', selected === id && 'sidebar-selector-selected', ); const onClick = React.useCallback(() => setSelected(id), [setSelected, id]); + const title = props.title ?? `${label} Sidebar`; const component = - iconPath - ? <img className="sidebar-selector-icon" src={iconPath} alt={label} /> + icon + ? <Icon size={20} className="sidebar-selector-icon" id={icon}/> : <label className="sidebar-selector-label">{label}</label>; return ( <div className={className} title={title} onClick={onClick}> diff --git a/ivette/src/renderer/style.css b/ivette/src/renderer/style.css index b513f411522e1ac79f11412f4a94bb26a0f192a2..45bf4b36ca7ab6efc186b6f0f62173c7216652af 100644 --- a/ivette/src/renderer/style.css +++ b/ivette/src/renderer/style.css @@ -19,20 +19,20 @@ } .sidebar-selector { + margin: 0px; + min-height: 40px; min-width: 35px; text-align: center; + border-left: solid 3px transparent; } .sidebar-selector-icon { - margin-top: 5px; - margin-left: 25%; - margin-right: 25%; - width: 25px; - height: 25px; + position: relative; + top: 6px; } -.sidebar-selector-icon:hover { - background-color: var(--background-profound-hover); +.sidebar-selector-label { + padding-top: 6px; } .sidebar-selector-label { @@ -43,11 +43,12 @@ } .sidebar-selector:hover { - background-color: var(--background-profound-hover); + background-color: var(--default-button-hover); } .sidebar-selector-selected { background-color: var(--background-profound); + border-color: var(--selected-button-img); } .component-info {