A focused Docker Compose management web application.
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: keybind indicator

Brooke b9019ef2 ea3a8f88

+29 -1
+16
packages/panel/src/lib/style.scss
··· 199 199 font-size: 14px; 200 200 color: var(--subtext0); 201 201 } 202 + 203 + .keybind { 204 + border: 1px solid var(--subtext0); 205 + background-color: transparent; 206 + display: inline-block; 207 + border-radius: 5px; 208 + padding: 2px 5px; 209 + 210 + height: fit-content; 211 + width: fit-content; 212 + 213 + font-family: "DejaVu Mono", monospace; 214 + text-transform: uppercase; 215 + color: var(--subtext0); 216 + font-size: 10px; 217 + }
+13 -1
packages/panel/src/routes/(authenticated)/projects/+page.svelte
··· 41 41 <div class="flexc gap-10 full projects" {...accordion.root}> 42 42 <div class="flexr center gap-10"> 43 43 <Fa icon={faMagnifyingGlass} size="lg" /> 44 - <input class="full" type="text" placeholder="Search projects..." bind:value={search} {@attach searchKeybind} /> 44 + <div class="full flex" style="align-items: center"> 45 + {#if search === ""} 46 + <div 47 + class="subtext flexr gap-10 center" 48 + style="position: absolute; padding-left: 10px; pointer-events: none;" 49 + > 50 + Search projects 51 + <div class="keybind">crtl + f</div> 52 + </div> 53 + {/if} 54 + 55 + <input class="full" type="text" bind:value={search} {@attach searchKeybind} /> 56 + </div> 45 57 </div> 46 58 47 59 {#each groups as [status, projects] (status)}