mirror of
https://github.com/idanoo/autobrr
synced 2025-07-27 18:59:13 +00:00
feat(web): better tooltips and uniformity (#474)
* - fix: changed all {text,bg}-{teal,indigo}-* color properties to {text,bg}-{blue}-* so there is only one dominant primary color in the UI -- blue - enhancement: added `cursor: pointer` to the PageButton component (used in pagination) - enhancement: modified TitleCell to use the new Tooltip component and modified the width selectors to a more sane default value, now instead of scrolling one just has to tap the cell to see it's untruncated value - enhancement: modified the Tooltip component to use react-popper-tooltip (which in turn uses popper.js) which is a much better alternative, since it uses auto-positioning in case there's not enough space and some things aren't as broken as in the previous version (e.g. there was a problem with forcing the previous tooltip to use a specific width) - enhancement: added a useMedia hook selector from the react-use repository, which might come in handy in the future for better/easier decoupling of Desktop and Mobile UI/UX patterns via JS (versus CSS-only) - enhancement: made the mobile navbar more visible and clear. also fixed previous path === "/" bug which was fixed on desktop. - fix: fixed table headers/footers so they're rounded - enhancement: made pagination components more compact (buttons and show N result selector) * changed {ring, border}-indigo-* to ring-blue-* * build: add yarn.lock * fix: formatting warnings * fix: formatting warnings * fix: more formatting warnings * fix: more formatting
This commit is contained in:
parent
71d0424b61
commit
ac988f28f4
43 changed files with 531 additions and 318 deletions
|
@ -43,7 +43,7 @@ export const KeyField = ({ value }: KeyFieldProps) => {
|
|||
type={isVisible ? "text" : "password"}
|
||||
value={value}
|
||||
readOnly={true}
|
||||
className="focus:outline-none dark:focus:border-blue-500 focus:border-indigo-500 dark:focus:ring-blue-500 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
|
||||
className="focus:outline-none dark:focus:border-blue-500 focus:border-blue-500 dark:focus:ring-blue-500 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue