server
server copied to clipboard
Enhancement/hashtype autocomplete
Closes #752 . Adds Autocompletion for Hashtypes via Select2 JQuery Plugin.
Sadly, the Select2 Bootstrap Theme has not been updated since 5 years, so the styling is a bit outdated / different than the rest of the project, but it's ok imo.
There is actually a Bootstrap 5 theme for select2.
Test the code, seems to work. Noticed that the select2 suggestions bar does not scale and has same static width? See attached screenshot
Also noted from @s3inlc the select2 doesn't seem to be compatible with darkmode.
https://user-images.githubusercontent.com/18482238/177008178-383a7854-9202-4919-a647-ffb29775a0c0.mp4
Sorry, i accidently rendered this as an mp4 instead of a gif 😅 .
I added a few media breakpoints for the sizing of the select in head.template.html
to make this responsive.
I also changed some scss variables to integrate some form of dark mode (i only changed them so at least the single select
mode looks like a dark mode).
In case you wonder, here are the variables and values i changed in the select2-bootstrap5-theme project:
// src/_variables.scss
$s2bs5-color: #aaaaaa !default;
$s2bs5-placeholder-color: #aaaaaa !default;
$s2bs5-bg: #32383e !default;
$s2bs5-border-color: #1d2227 !default;
$s2bs5-box-shadow: #2c3035 !default;
$s2bs5-indicator: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23cecfd0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !default;
$s2bs5-focus-border-color: #1d2227 !default;
$s2bs5-focus-box-shadow: 0 0 0 .2rem rgba(58, 63, 68, .25) !default;
I will commit a changelog entry and if you are good with the results I think this can be merged :).
Thanks, looks good, but have to test it a bit more; expecting to add it with the release we are currently working on.
I tested it a bit more, looks good to us, so I'll merge it. Thanks for the contribution and updates.