DrawerContainer - Clipping fix
This commit is contained in:
		
							parent
							
								
									b01b4e42df
								
							
						
					
					
						commit
						9f1214fd9f
					
				| @ -152,7 +152,7 @@ public partial class Drawer : UIComponent, IDisposable, INavigationEventReceiver | |||||||
| 	#region Styling properties | 	#region Styling properties | ||||||
| 
 | 
 | ||||||
| 	//old | 	//old | ||||||
| 	private CssBuilder CompiledClassList | 	public CssBuilder CompiledClassList | ||||||
| 	{ | 	{ | ||||||
| 		get | 		get | ||||||
| 		{ | 		{ | ||||||
|  | |||||||
| @ -24,10 +24,12 @@ public partial class DrawerContainer : UIComponent | |||||||
| 
 | 
 | ||||||
| 	private string GetDrawerClass(Drawer drawer) | 	private string GetDrawerClass(Drawer drawer) | ||||||
| 	{ | 	{ | ||||||
|  | 		 | ||||||
| 		if (drawer == null) | 		if (drawer == null) | ||||||
| 			return string.Empty; | 			return string.Empty; | ||||||
|  | 	   else return drawer.CompiledClassList.Build(); | ||||||
| 
 | 
 | ||||||
| 		var className = $"drawer-{(drawer.Open ? "open" : "close")}-{drawer.Variant.ToDescription()}"; | 		/*var className = $"drawer-{(drawer.Open ? "open" : "close")}-{drawer.Variant.ToDescription()}"; | ||||||
| 		if (drawer.Variant is DrawerVariant.Responsive or DrawerVariant.Mini) | 		if (drawer.Variant is DrawerVariant.Responsive or DrawerVariant.Mini) | ||||||
| 		{ | 		{ | ||||||
| 			className += $"-{drawer.Breakpoint.ToDescription()}"; | 			className += $"-{drawer.Breakpoint.ToDescription()}"; | ||||||
| @ -36,7 +38,7 @@ public partial class DrawerContainer : UIComponent | |||||||
| 
 | 
 | ||||||
| 		className += $"drawer-{drawer.GetPosition()}-clipped-{drawer.ClipMode.ToDescription()}"; | 		className += $"drawer-{drawer.GetPosition()}-clipped-{drawer.ClipMode.ToDescription()}"; | ||||||
| 
 | 
 | ||||||
| 		return className; | 		return className;*/ | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 	private Drawer FindLeftDrawer() | 	private Drawer FindLeftDrawer() | ||||||
|  | |||||||
| @ -1,4 +1,4 @@ | |||||||
| @namespace Connected.Components | @namespace Connected.Components | ||||||
| @inherits UIComponent | @inherits UIComponent | ||||||
| 
 | 
 | ||||||
| <img @attributes="CustomAttributes" src="@Src" alt="@Alt" class="@Classname" width="@Width" height="@Height"> | <img @attributes="CustomAttributes" src="@Src" alt="@Alt" class="@CompiledClassList.Build()" width="@Width" height="@Height"> | ||||||
| @ -11,68 +11,71 @@ namespace Connected.Components; | |||||||
| 
 | 
 | ||||||
| public partial class Image : UIComponent | public partial class Image : UIComponent | ||||||
| { | { | ||||||
|    protected string Classname => | 
 | ||||||
|       new CssBuilder("image") | 	private CssBuilder CompiledClassList | ||||||
|          .AddClass("fluid", Fluid) | 	{ | ||||||
|          .AddClass($"object-{ObjectFit.ToDescription()}") | 		get | ||||||
|          .AddClass($"object-{ObjectPosition.ToDescription()}") | 		{ | ||||||
|          .AddClass($"elevation-{Elevation}", Elevation > 0) | 			return new CssBuilder("image") | ||||||
|          .AddClass(AdditionalClassList) | 			.AddClass("fluid", Fluid) | ||||||
|          .Build(); | 			.AddClass($"object-{ObjectFit.ToDescription()}") | ||||||
|  | 			.AddClass($"object-{ObjectPosition.ToDescription()}") | ||||||
|  | 			.AddClass($"elevation-{Elevation}", Elevation > 0) | ||||||
|  | 			.AddClass(ClassList); | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Applies the fluid class so the image scales with the parent width. |    /// Applies the fluid class so the image scales with the parent width. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Behavior)] |  | ||||||
|    public bool Fluid { get; set; } |    public bool Fluid { get; set; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Specifies the path to the image. |    /// Specifies the path to the image. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Behavior)] |  | ||||||
|    public string Src { get; set; } |    public string Src { get; set; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Specifies an alternate text for the image. |    /// Specifies an alternate text for the image. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Behavior)] |  | ||||||
|    public string Alt { get; set; } |    public string Alt { get; set; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Specifies the height of the image in px. |    /// Specifies the height of the image in px. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Appearance)] |  | ||||||
|    public int? Height { get; set; } |    public int? Height { get; set; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Specifies the width of the image in px. |    /// Specifies the width of the image in px. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Appearance)] |  | ||||||
|    public int? Width { get; set; } |    public int? Width { get; set; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// The higher the number, the heavier the drop-shadow. |    /// The higher the number, the heavier the drop-shadow. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Appearance)] |  | ||||||
|    public int Elevation { set; get; } |    public int Elevation { set; get; } | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Controls how the image should be resized. |    /// Controls how the image should be resized. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Appearance)] |  | ||||||
|    public ObjectFit ObjectFit { set; get; } = ObjectFit.Fill; |    public ObjectFit ObjectFit { set; get; } = ObjectFit.Fill; | ||||||
| 
 | 
 | ||||||
|    /// <summary> |    /// <summary> | ||||||
|    /// Controls how the image should positioned within its container. |    /// Controls how the image should positioned within its container. | ||||||
|    /// </summary> |    /// </summary> | ||||||
|    [Parameter] |    [Parameter] | ||||||
|    [Category(CategoryTypes.Image.Appearance)] |  | ||||||
|    public Position ObjectPosition { set; get; } = Position.Center; |    public Position ObjectPosition { set; get; } = Position.Center; | ||||||
|  | 
 | ||||||
|  | 	/// <summary> | ||||||
|  | 	/// A space separated list of class names, added on top of the default class list. | ||||||
|  | 	/// </summary> | ||||||
|  | 	[Parameter] | ||||||
|  | 	public string? ClassList { get; set; } | ||||||
| } | } | ||||||
|  | |||||||
| @ -12,6 +12,7 @@ public partial class MainContent | |||||||
| 				 .AddClass(ClassList); | 				 .AddClass(ClassList); | ||||||
| 		} | 		} | ||||||
| 	} | 	} | ||||||
|  | 
 | ||||||
| 	[Parameter] | 	[Parameter] | ||||||
| 	public RenderFragment ChildContent { get; set; } | 	public RenderFragment ChildContent { get; set; } | ||||||
| 
 | 
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user
	 stm
						stm