Posts

Showing posts with the label Footer

1 Line CSS Positioning Blazor Style

Image
I found a really good YouTube video  from Google Chrome Developer channel that I am piggybacking off of for this post.  I found the content very interesting and I wanted to see what it would take to first port it s Blazzor application, then how to implement the layouts in a Blazor component library where I can use them in any project.   Please note, even though I am a fan of Bootstrap and other CSS frameworks, I have been on a push lately to write my own CSS.  These layouts are pure HTML and CSS. I won't cover the details of the 10 different layouts and the 1 kay line that makes them work, I do highly recommend you watch the video, it is very educational on CSS layouts. To demonstrate the 10 layouts, I have created a razor page to display the layout.  You can review the source code provided for the details 10 Layouts: 1. Center - All child content is centered within the parent container                     ...

Convert Bootstrap Template to Blazor - Part 3

Image
Convert Bootstrap template to Blazor => Part 3 This is part 3 in my 7-part series on how to move a free Bootstrap Template and make a Blazor application out of it.  You can read about the other post here: 1. Part 1 – Create project and Copy over assets 2. Part 2 - Navigation Since we are building a Blazor application and everything cool in Blazor is a component, we need to create some components.  It might seem like over kill, but I will be building header and footer components in this post. Header This is the Header: You should notice there are a couple of variable items in this section: 1. Avatar 2. Name 3. Summary I want to make this section configurable.  In order to do this we can either pass in parameters into the component or we can have some type of a configuration service.  I prefer the configuration service, it allows us to take the application in a few different areas with minimal work.  Configuration Service...