Design TWM - popOvers Deprecated

[Mehrabbruno]

@todo

#112
#115

• Design - popOvers_v0.0.1

  • @input 📦 WF 14: TWM specs in WF -Iteration 2- figma file` from tiling window/folder manager (= "folder editor/tool") concept & design -- 2 -- #101
  • @input 📦 twm ui/ux specification from tiling window manager (UI/UX) -- 3 #111
  • Application pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of applications and close button)
    • Application container (contains application logo, name & desc)
    • Search input (contains search icon, inputField and close icon when added text)
  • Permission pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of permissions and close button)
    • Permission container (contains checkboxes with labels)
    • Search input (contains search icon, inputField and close icon when added text -
  • Collapsed Tabs pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of collapsed tabs and close button)
    • Collapsed Tabs container
      • Singular tabs (contains application logo, title, and close button)
      • Multiple tabs (contains application logo, title, toggle icon, total no of children tabs and close button)
        • When clicked user gets a dropdown list of children tabs
    • Search input (contains search icon, inputField and close icon when added text)
  • Recent History Logs pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of tabs contained in history and close button)
    • History logs tab container (contains application logo, title, history/revision icon and close button)
    • Search input (contains search icon, inputField and close icon when added text)
  • Actions pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of actions and close button)
    • Actions container (contains action title)
    • Search input (contains search icon, inputField and close icon when added text)
  • File Explorer pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of file/folder and close button)
    • Files container
      • Files (contains application or icon, title, and close button)
      • Folder (contains folder icon, title, toggle icon, and close button)
        • When clicked user gets a dropdown list of children File & Folders
    • Search input (contains search icon, inputField and close icon when added text)
  • Bookmarked pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains bookmarked title, total number of bookmarked tabs and close button)
    • Bookmarks container (contains application logo, title, and remove button)
    • Search input (contains search icon, inputField and close icon when added text)
  • Collapsed Bookmarks pop-over (toggles on onClick)
    • pop-over header (fixed to the top and contains title, total number of collapsed bookmarks and close button)
    • Collapsed Bookmarks container
      • Bookmarks (contains Folder icon, title, toggle icon, and close button)
        • When clicked user gets a dropdown list of children tabs
    • Search input (contains search icon, inputField and close icon when added text)
  • @output 🏭 TWM iteration 15 Figma File from comment

• Deprecate popOvers_v0.0.1, create the successor component and list them below the Figma Canvas

  • @output 📦 popOvers_v0.0.1 (Deprecated) from comment
    • next Design - applicationPopover #116
    • next Design - permissionPopover #117
    • next Design - actionsPopover #118
    • next Design - historyLogsPopover #119
    • next Design - fileExplorePopover #120
    • next Design - collapsedTabsPopover #121
    • next Design - bookmarksPopover #122
    • next Design - collapsedBookmarksPopover #123

@info

This pop-over is designed for to be placed in component Design TWM - Tab Component