93 lines
7.6 KiB
HTML
93 lines
7.6 KiB
HTML
<!doctype html>
|
|
<html lang="en"><head><script src="/livereload.js?mindelay=10&v=2&port=1313&path=livereload" data-no-instant defer></script>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<link rel="shortcut icon" href="http://localhost:1313/favicon.ico">
|
|
<link id="stylesheet" rel="stylesheet" href="/css/light.css">
|
|
|
|
<link rel="canonical" href="http://localhost:1313/upgrade-your-qtile-setup-with-a-cute-dropdown-terminal/" />
|
|
<title>Upgrade your qtile setup with a cute dropdown terminal</title>
|
|
</head>
|
|
<body><header id="banner">
|
|
<nav class="navbar">
|
|
<div class="nav-left">
|
|
|
|
<a href="http://localhost:1313/" class="home">~ 🏠</a>
|
|
|
|
<a
|
|
href="/info/"
|
|
title="--help"
|
|
>--help</a
|
|
>
|
|
</div>
|
|
<div class="nav-right">
|
|
|
|
<button id="toggle-button" class="toggle-button" onclick="toggleTheme()">🌚</button>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
<main id="content">
|
|
<article>
|
|
<header id="post-header">
|
|
<h3>Upgrade your qtile setup with a cute dropdown terminal</h3>
|
|
<div>
|
|
<time>September 23, 2022</time>
|
|
</div>
|
|
</header><p>I didn’t know you could do this until recently, very fun and playful little feature. How you want to do it will depend slightly on how you have your groups set up but I start with importing the relevant libraries and defining an empty list.</p>
|
|
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="kn">from</span> <span class="nn">libqtile.config</span> <span class="kn">import</span> <span class="n">Dropdown</span><span class="p">,</span> <span class="n">Scratchpad</span>
|
|
</span></span><span class="line"><span class="cl">
|
|
</span></span><span class="line"><span class="cl"><span class="n">groups</span> <span class="o">=</span> <span class="p">[]</span>
|
|
</span></span></code></pre></div><p>I’m then able to append all the groups I want to this list. For the dropdown terminal you need the ScratchPad group which to quote the <a href="https://docs.qtile.org/en/latest/manual/config/groups.html">qtile docs</a> is a “special - by default invisible - group which acts as a container for DropDown configurations”. My configuration looks like this:</p>
|
|
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="n">groups</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">ScratchPad</span><span class="p">(</span> <span class="s2">"scratchpad"</span><span class="p">,</span> <span class="p">[</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">DropDown</span><span class="p">(</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="s2">"term"</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">kitty</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">opacity</span> <span class="o">=</span> <span class="mf">0.9</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">),</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">),</span>
|
|
</span></span><span class="line"><span class="cl"><span class="p">)</span>
|
|
</span></span></code></pre></div><p>This gives you a terminal (kitty in this case) with a little tranparency. By default, it will pop up with this size:</p>
|
|
<p><img src="/image/dropdown.webp" alt="alt"></p>
|
|
<p>Though this can easily be altered with the x, y, height, and width keys:</p>
|
|
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="n">groups</span><span class="o">.</span><span class="n">append</span><span class="p">(</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">ScratchPad</span><span class="p">(</span><span class="s2">"scratchpad"</span><span class="p">,</span> <span class="p">[</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">DropDown</span><span class="p">(</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="s2">"term"</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">kitty</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">opacity</span> <span class="o">=</span> <span class="mf">0.9</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">x</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">y</span> <span class="o">=</span> <span class="mi">0</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">width</span> <span class="o">=</span> <span class="mf">0.3</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">height</span> <span class="o">=</span> <span class="mf">0.5</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">),</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">])</span>
|
|
</span></span><span class="line"><span class="cl"><span class="p">)</span>
|
|
</span></span></code></pre></div><p>This gives us a little boxy guy in the top left corner:</p>
|
|
<p><img src="/image/dropdown2.webp" alt="alt"></p>
|
|
<p>We also have the option to set keybindings to toggle the appearance of the window. I’ve got this in my config.py now:</p>
|
|
<div class="highlight"><pre tabindex="0" class="chroma"><code class="language-python" data-lang="python"><span class="line"><span class="cl"><span class="n">keys</span> <span class="o">=</span> <span class="p">[</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">Key</span><span class="p">([</span><span class="n">m</span><span class="p">,</span> <span class="s2">"shift"</span><span class="p">],</span> <span class="s2">"Return"</span><span class="p">,</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">lazy</span><span class="o">.</span><span class="n">group</span><span class="p">[</span><span class="s2">"scratchpad"</span><span class="p">]</span><span class="o">.</span><span class="n">dropdown_toggle</span><span class="p">(</span><span class="s2">"terminal"</span><span class="p">),</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="n">desc</span><span class="o">=</span><span class="s1">'dropdown term'</span>
|
|
</span></span><span class="line"><span class="cl"> <span class="p">),</span>
|
|
</span></span><span class="line"><span class="cl"><span class="p">]</span>
|
|
</span></span></code></pre></div><p>Anyway, hope this was useful, happy configurating :)</p>
|
|
</article>
|
|
</main>
|
|
|
|
<footer id="footer">
|
|
<p>-----------------</p>
|
|
<small>
|
|
made with <a href="https://gohugo.io">hugo</a> and my bastardised version of
|
|
<a href="https://github.com/LukasJoswiak/etch">this nice theme</a>
|
|
</small>
|
|
|
|
<script src="/js/search.js"></script>
|
|
<script src="/js/toggle.js"></script>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|