SketchyBar/features.html
2022-08-12 18:41:29 +02:00

26 lines
No EOL
11 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en" dir="ltr" class="docs-wrapper docs-doc-page docs-version-current plugin-docs plugin-id-default docs-doc-id-features">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="generator" content="Docusaurus v2.0.0-beta.18">
<title data-rh="true">Features | SketchyBar</title><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:url" content="https://felixkratz.github.io//SketchyBar/features"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="docusaurus_version" content="current"><meta data-rh="true" name="docusaurus_tag" content="docs-default-current"><meta data-rh="true" name="docsearch:version" content="current"><meta data-rh="true" name="docsearch:docusaurus_tag" content="docs-default-current"><meta data-rh="true" property="og:title" content="Features | SketchyBar"><meta data-rh="true" name="description" content="Features"><meta data-rh="true" property="og:description" content="Features"><link data-rh="true" rel="icon" href="/SketchyBar/img/favicon.ico"><link data-rh="true" rel="canonical" href="https://felixkratz.github.io//SketchyBar/features"><link data-rh="true" rel="alternate" href="https://felixkratz.github.io//SketchyBar/features" hreflang="en"><link data-rh="true" rel="alternate" href="https://felixkratz.github.io//SketchyBar/features" hreflang="x-default"><link rel="stylesheet" href="/SketchyBar/assets/css/styles.d31a9c85.css">
<link rel="preload" href="/SketchyBar/assets/js/runtime~main.e0ac3382.js" as="script">
<link rel="preload" href="/SketchyBar/assets/js/main.57bc4bb7.js" as="script">
</head>
<body class="navigation-with-keyboard">
<script>!function(){function e(e){document.documentElement.setAttribute("data-theme",e)}var t=function(){var e=null;try{e=localStorage.getItem("theme")}catch(e){}return e}();null!==t?e(t):window.matchMedia("(prefers-color-scheme: dark)").matches?e("dark"):(window.matchMedia("(prefers-color-scheme: light)").matches,e("light"))}()</script><div id="__docusaurus">
<div role="region"><a href="#" class="skipToContent_ZgBM">Skip to main content</a></div><nav class="navbar navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Navigation bar toggle" class="navbar__toggle clean-btn" type="button" tabindex="0"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/SketchyBar/"><div class="navbar__logo"><img src="/SketchyBar/img/logo.svg" alt="SketchyBar Logo" class="themedImage_W2Cr themedImage--light_TfLj"><img src="/SketchyBar/img/logo.svg" alt="SketchyBar Logo" class="themedImage_W2Cr themedImage--dark_oUvU"></div><b class="navbar__title">SketchyBar</b></a></div><div class="navbar__items navbar__items--right"><a aria-current="page" class="navbar__item navbar__link navbar__link--active" href="/SketchyBar/features">Features</a><a class="navbar__item navbar__link" href="/SketchyBar/setup">Setup &amp; Installation</a><a class="navbar__item navbar__link" href="/SketchyBar/config/bar">Configuration</a><a href="https://github.com/FelixKratz/SketchyBar" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link"></a><div class="toggle_S7eR colorModeToggle_vKtC"><button class="clean-btn toggleButton_rCf9 toggleButtonDisabled_Pu9x" type="button" disabled="" title="Switch between dark and light mode (currently light mode)" aria-label="Switch between dark and light mode (currently light mode)"><svg viewBox="0 0 24 24" width="24" height="24" class="lightToggleIcon_v35p"><path fill="currentColor" d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"></path></svg><svg viewBox="0 0 24 24" width="24" height="24" class="darkToggleIcon_nQuB"><path fill="currentColor" d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"></path></svg></button></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div class="main-wrapper"><div class="docPage_P2Lg"><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_RiI4" type="button"></button><aside class="theme-doc-sidebar-container docSidebarContainer_rKC_"><div class="sidebar_RiAD"><nav class="menu thin-scrollbar menu_izAj"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link menu__link--active" aria-current="page" href="/SketchyBar/features">Features</a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/SketchyBar/setup">Setup</a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" href="/SketchyBar/config/bar">Configuration</a></div></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/SketchyBar/credits">Credits</a></li></ul></nav></div></aside><main class="docMainContainer_TCnq"><div class="container padding-top--md padding-bottom--lg"><div class="row"><div class="col docItemCol_DM6M"><div class="docItemContainer_vinB"><article><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Xlws" aria-label="breadcrumbs"><ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList"><li class="breadcrumbs__item"><a class="breadcrumbs__link" href="/SketchyBar/">🏠</a></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active"><span class="breadcrumbs__link" itemprop="item name">Features</span><meta itemprop="position" content="1"></li></ul></nav><div class="tocCollapsible_jdIR theme-doc-toc-mobile tocMobile_TmEX"><button type="button" class="clean-btn tocCollapsibleButton_Fzxq">On this page</button></div><div class="theme-doc-markdown markdown"><header><h1>Features</h1></header><h2 class="anchor anchorWithStickyNavbar_mojV" id="features">Features<a class="hash-link" href="#features" title="Direct link to heading"></a></h2><ul><li>Performance friendly</li><li>Fully scriptable</li><li>Fully configurable (Fonts, Backgrounds, Colors, Icons, etc.)</li><li>Supports drawing native macOS menu bar applications (aliases)</li><li>Powerful event and scripting system</li><li>Animation System</li><li>Popup Menus</li><li>Mouse Support</li><li>Support for graphs</li><li>Per display and per space individualization</li></ul><p>The configuration of the bar takes place in a configuration file where almost everything can be configured.
Basically, the bar itself is a rectangle that can hold arbitrarily many <em>items</em>, which can be configured to do awesome stuff.
An <em>item</em> will occupy a space in the bar and can be equipped to show an <em>icon</em> and a <em>label</em>. The <em>icon</em> and <em>label</em> can be changed through
<em>scripts</em> that can be attached to the <em>item</em>. It is also possible to <em>subscribe</em> an <em>item</em> to certain <em>events</em> for their <em>script</em> execution action,
which makes very powerful items possible.
Furthermore, an <em>item</em> can be assigned to mission control spaces or displays, such that they only show on a certain space or display, which makes multi-desktop configuration
of the bar possible and opens the possibility to create individualized bar configuration on a per display and per space level.
These simple ingredients make <em>items</em> almost endlessly customizable and can be used to display arbitrary information and perform useful actions.</p><p>Some special features can not be accomplished with a simple <em>item</em>, this is where the <em>components</em> come into play. They basically are <em>items</em> with
extra steps. They contain all the properties a regular item does, but they can do specialized tasks a simple item can not. For example, there
is a <em>graph</em> component, which can be used to display graphs in the bar.</p><p>For more details on how the configuration works, see the configuration section.</p><h2 class="anchor anchorWithStickyNavbar_mojV" id="examples">Examples<a class="hash-link" href="#examples" title="Direct link to heading"></a></h2><p><img loading="lazy" alt="examples" src="/SketchyBar/assets/images/examples-e91544141827cce7e424ef77f613cea2.png" width="3840" height="2148" class="img_E7b_"></p></div></article><nav class="pagination-nav docusaurus-mt-lg" aria-label="Docs pages navigation"><div class="pagination-nav__item"></div><div class="pagination-nav__item pagination-nav__item--next"><a class="pagination-nav__link" href="/SketchyBar/setup"><div class="pagination-nav__sublabel">Next</div><div class="pagination-nav__label">Setup</div></a></div></nav></div></div><div class="col col--3"><div class="tableOfContents_cNA8 thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#features" class="table-of-contents__link toc-highlight">Features</a></li><li><a href="#examples" class="table-of-contents__link toc-highlight">Examples</a></li></ul></div></div></div></div></main></div></div></div>
<script src="/SketchyBar/assets/js/runtime~main.e0ac3382.js"></script>
<script src="/SketchyBar/assets/js/main.57bc4bb7.js"></script>
</body>
</html>