Adjust tags list to use screen size relative units

2a971a517ceaa0292147e7218955b250ed523806

Cohee <18619528+Cohee1207@users.noreply.github.com>

Parents: fdc51a1211f0574f5088ad51af3292ef6d8a1692
2 files changed, +7 -7Showing whitespace changes
public/css/tags.css+1 -5
@@ -158,12 +158,8 @@
158 flex-wrap: wrap;158 flex-wrap: wrap;
159 align-items: flex-start;159 align-items: flex-start;
160 margin-top: 5px;160 margin-top: 5px;
161 margin-bottom: 10px;161 max-height: 40dvh;
162 /* not 100% due to margins */
163 max-height: 90%;
164 /* scroll the list if needed */
165 overflow-y: auto;162 overflow-y: auto;
166
167}163}
168164
169.rm_tag_filter .tag {165.rm_tag_filter .tag {
public/style.css+6 -2
@@ -295,6 +295,11 @@ table.responsiveTable {
295 outline: 1px solid var(--interactable-outline-color);295 outline: 1px solid var(--interactable-outline-color);
296}296}
297297
298/* Prevent the outline from being cut off by hiding the overflow */
299.tag.interactable:focus-visible {
300 outline-offset: -1px;
301}
302
298/* The specific input controls can always have a faint outline, even on mouse interaction, to give a better hint */303/* The specific input controls can always have a faint outline, even on mouse interaction, to give a better hint */
299select:focus-visible,304select:focus-visible,
300input:focus-visible,305input:focus-visible,
@@ -3094,8 +3099,6 @@ select option:not(:checked) {
30943099
3095#charListFixedTop {3100#charListFixedTop {
3096 padding: 5px;3101 padding: 5px;
3097 /*prevent huge taglist from taking up the whole panel */
3098 overflow-y: hidden;
3099}3102}
31003103
3101#form_character_search_form {3104#form_character_search_form {
@@ -3122,6 +3125,7 @@ select option:not(:checked) {
31223125
3123#character_search_bar {3126#character_search_bar {
3124 flex: 1;3127 flex: 1;
3128 margin-bottom: 0;
3125}3129}
31263130
3127#rm_button_search {3131#rm_button_search {