forked from MapComplete/MapComplete
		
	UI: fix icon alignment
This commit is contained in:
		
							parent
							
								
									fd16e165c4
								
							
						
					
					
						commit
						953bdaeaa5
					
				
					 3 changed files with 6 additions and 5 deletions
				
			
		|  | @ -40,6 +40,8 @@ | ||||||
| .mapping-icon-small { | .mapping-icon-small { | ||||||
|     /* A mapping icon type */ |     /* A mapping icon type */ | ||||||
|     width: 1.5rem; |     width: 1.5rem; | ||||||
|  |     height: fit-content; | ||||||
|  | 
 | ||||||
|     max-height: 1.5rem; |     max-height: 1.5rem; | ||||||
|     margin-right: 0.5rem; |     margin-right: 0.5rem; | ||||||
| } | } | ||||||
|  | @ -47,19 +49,19 @@ | ||||||
| .mapping-icon-medium { | .mapping-icon-medium { | ||||||
|     /* A mapping icon type */ |     /* A mapping icon type */ | ||||||
|     width: 3rem; |     width: 3rem; | ||||||
|  |     height: fit-content; | ||||||
|     max-height: 3rem; |     max-height: 3rem; | ||||||
|     margin-right: 1rem; |     margin-right: 1rem | ||||||
|     margin-left: 0.5rem; |  | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| .mapping-icon-large { | .mapping-icon-large { | ||||||
|     /* A mapping icon type */ |     /* A mapping icon type */ | ||||||
|     width: 6rem; |     width: 6rem; | ||||||
|  |     height: fit-content; | ||||||
|     max-height: 5rem; |     max-height: 5rem; | ||||||
|     margin-top: 0.5rem; |     margin-top: 0.5rem; | ||||||
|     margin-bottom: 0.5rem; |     margin-bottom: 0.5rem; | ||||||
|     margin-right: 1.5rem; |     margin-right: 1.5rem; | ||||||
|     margin-left: 0.5rem; |  | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
|  | @ -40,7 +40,7 @@ | ||||||
| {#if iconsParsed !== undefined && iconsParsed.length > 0} | {#if iconsParsed !== undefined && iconsParsed.length > 0} | ||||||
|   <div class={twMerge("relative", size)}> |   <div class={twMerge("relative", size)}> | ||||||
|     {#each iconsParsed as icon} |     {#each iconsParsed as icon} | ||||||
|       <div class="absolute top-0 left-0 h-full w-full"> |       <div class="absolute top-0 left-0 h-full w-full flex items-center"> | ||||||
|         <Icon icon={icon.icon} color={icon.color} {clss} /> |         <Icon icon={icon.icon} color={icon.color} {clss} /> | ||||||
|       </div> |       </div> | ||||||
|     {/each} |     {/each} | ||||||
|  |  | ||||||
|  | @ -6,7 +6,6 @@ | ||||||
|   import { UIEventSource } from "../../../Logic/UIEventSource" |   import { UIEventSource } from "../../../Logic/UIEventSource" | ||||||
|   import LayerConfig from "../../../Models/ThemeConfig/LayerConfig" |   import LayerConfig from "../../../Models/ThemeConfig/LayerConfig" | ||||||
|   import { twJoin } from "tailwind-merge" |   import { twJoin } from "tailwind-merge" | ||||||
|   import Icon from "../../Map/Icon.svelte" |  | ||||||
|   import Marker from "../../Map/Marker.svelte" |   import Marker from "../../Map/Marker.svelte" | ||||||
| 
 | 
 | ||||||
|   export let selectedElement: Feature |   export let selectedElement: Feature | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue