EvotecIT / PSWriteHTML

PSWriteHTML is PowerShell Module to generate beautiful HTML reports, pages, emails without any knowledge of HTML, CSS or JavaScript. To get started basics PowerShell knowledge is required.
MIT License
855 stars 108 forks source link

New-NavTopMenu and Navlink #411

Closed amolsp777 closed 1 year ago

amolsp777 commented 1 year ago

Hello, I was testing some code and found that this New-NavTopMenu used and found that these Menus are very impressive and useful. I was trying if I click on Sub-menu link and give some URL link, can that open in same page with continuing Top Menu as header, without leaving the page?

Sample code

$time = (get-date)
    $CompanyLogo = "P:\InfraWeb\Home_files\image002.png"
    New-HTML -TitleText 'Report' -ShowHTML -Online -FilePath $SavePath {   
        New-HTMLNavTop -Logo $CompanyLogo -MenuColorBackground LightGray -MenuColor Black -HomeColorBackground Chardonnay -HomeLinkHome  {

            New-NavTopMenu -Name 'Domains' -IconRegular building -IconColor black {
            New-NavLink -IconRegular file-image -IconColor blue -Href 'https://infraweb.abc.com/VMInventory/' -Name 'VM Inventory' 
                New-NavLink -IconSolid users -Name 'Groups' -InternalPageID 'Groups'
                New-NavLink -IconSolid users -Name 'Groups_Empty' -InternalPageID 'Groups_Empty'    
                New-NavLink -IconMaterial folder -Name 'OU' -InternalPageID 'OU'
                New-NavLink -IconSolid scroll -Name 'Group Policy' -InternalPageID 'GPO'
                New-NavLink -IconSolid print -Name 'Printers' -InternalPageID 'Printers' 
            }
            New-NavTopMenu -Name 'Objects' -IconSolid sitemap {
                New-NavLink -IconSolid user-tie -Name 'Users' -InternalPageID 'Users'
                New-NavLink -IconSolid laptop -Name 'Computers' -InternalPageID 'Computers'
            }

        }    

    }

Here if I click on Vm Inventory sub-menu it will redirect to that page but if there a way to open the target page with same menus so I can navigate to other menus/tabs?

PrzemyslawKlys commented 1 year ago

There are 2 ways to do it:

  1. Is to use InternalPageID along with New-HTMLPage. This means you don't use Href, but the module automatically tracks this for you and links to a different page will be done automatically creating necessary navigation in the new page
  2. If you want to use Href directly the thing is the page you're linking to has 0 awarness about that you have some menu. What you can do is create html page with the same menu as above, inside the html page put a frame on it and link the href to that href. The problem is putting stuff into frame has drawbacks if pages have protection against linking or the pages have security against showing content from different domains.

If you are in control you can work around things. I use either New-HTMLPage or New-HTMLFrame all the time.

amolsp777 commented 1 year ago

I tried to use New-HTMLPage but had no luck. Maybe I am not using the correct syntaxes.

PrzemyslawKlys commented 1 year ago

I think it's a bug. I'll fix it.

PrzemyslawKlys commented 1 year ago

Actually no bug.

$DataTable1 = @(
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.42 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.72 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.22 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 2.73 }
)

New-HTML -TitleText 'Testing Navigation' {
    New-HTMLNavTop -Logo 'https://evotec.xyz/wp-content/uploads/2021/04/Logo-evotec-bb.png' -LogoLinkHome {
        New-NavTopMenu -Name 'Domains' -IconRegular address-book {
            New-NavLink -IconMaterial airplane -Name 'This is internal link 1' -InternalPageID 'Page 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link to evotec' -IconColor Pink -NameColor Red
            New-NavLink -Name 'This is link 3' -IconBrands apple-pay {
                New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                New-NavLink -IconSolid address-book -Name 'This is link 6' {
                    New-NavLink -Name 'This is link 3' -IconBrands confluence {
                        New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                        New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 6'
                    }
                }
            }
        }
        New-NavTopMenu -Name 'Domain Controllers' -IconSolid ambulance {
            New-NavLink -IconMaterial airplane -Name 'This is link 1 (internal)' -InternalPageID 'Page 2'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 3'
        }
        New-NavTopMenu -Name 'Office 365' {
            New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 4'
        }
    } #-MenuColor Black -MenuColorBackground Pink -HomeColorBackground Black -HomeColor Red
    New-HTMLHeader {
        New-HTMLText -Text 'In header - main page'
    }
    New-HTMLTab -Name 'Test 21' {
        New-HTMLText -Text "This is first page - tab 1" -Color Red -FontSize 40px -Alignment center

    }
    New-HTMLTab -Name 'Test 22' {
        New-HTMLText -Text "This is first page - tab 2" -Color Red -FontSize 40px -Alignment center
    }
    New-HTMLFooter {
        New-HTMLText -Text 'In footer - main page'
    }

    New-HTMLPage -Name 'Page 1' {
        New-HTMLHeader {
            New-HTMLText -Text 'In header'
        }
        New-HTMLTab -Name 'Test 1' {
            New-HTMLSection -HeaderText 'Test 0' {
                New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
            }
            New-HTMLSection -HeaderText 'Test 1' {
                New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
            }
        }
        New-HTMLTab -Name 'Test 2' {

        }
        New-HTMLFooter {
            New-HTMLText -Text 'In footer'
        }
    }
    New-HTMLPage -Name 'Page 2' {
        New-HTMLSection -HeaderText 'Test2' {
            New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
        }
    }
} -ShowHTML -Online -FilePath $PSScriptRoot\Example41-Navigation03.html
amolsp777 commented 1 year ago

Thanks for sharing this Example. Now what is I need to load the HTML page which is output of Dashimo. I want to load the exported HTML output in the Page 1 content body, so by that it will not leave the make Menu page.

I tried replacing

New-HTMLPage -Name 'Page 1' {
        New-HTMLHeader {
            New-HTMLText -Text 'In header'
        }
        New-HTMLTab -Name 'Test 1' {
            New-HTMLSection -HeaderText 'Test 0' {
                New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
            }
            New-HTMLSection -HeaderText 'Test 1' {
                New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
            }
        }
        New-HTMLTab -Name 'Test 2' {

        }
        New-HTMLFooter {
            New-HTMLText -Text 'In footer'
        }
    }

With this as testing, I know this is incorrect but just looking to see if we can use any command to load the other HTML page here without creating a new HTML page from this Master script. So the idea is to have this as the Master page with small checks, but other heavy scripts will run separately and generate the output then we can call those from this master page

    New-HTMLPage -Name 'Page 1' {
        New-HTMLHeader {
            New-HTMLText -Text 'In header'
            New-HTMLContent -Content "P:\_Scripts\Dashboards_Testing\VMinventory.html"
        }

        New-HTMLFooter {
            New-HTMLText -Text 'In footer'
        }
    }

Here is the complete code

$DataTable1 = @(
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.42 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.72 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 1.22 }
    [PSCustomObject] @{ Test = 'Name'; Test2 = 'Name2'; Test3 = 'Name3'; Test4 = 2.73 }
)

New-HTML -TitleText 'Testing Navigation' {
    New-HTMLNavTop -Logo 'https://evotec.xyz/wp-content/uploads/2021/04/Logo-evotec-bb.png' -LogoLinkHome {
        New-NavTopMenu -Name 'Domains' -IconRegular address-book {
            New-NavLink -IconMaterial airplane -Name 'This is internal link 1' -InternalPageID 'Page 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link to evotec' -IconColor Pink -NameColor Red
            New-NavLink -Name 'This is link 3' -IconBrands apple-pay {
                New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                New-NavLink -IconSolid address-book -Name 'This is link 6' {
                    New-NavLink -Name 'This is link 3' -IconBrands confluence {
                        New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                        New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 6'
                    }
                }
            }
        }
        New-NavTopMenu -Name 'Domain Controllers' -IconSolid ambulance {
            New-NavLink -IconMaterial airplane -Name 'This is link 1 (internal)' -InternalPageID 'Page 2'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 3'
        }
        New-NavTopMenu -Name 'Office 365' {
            New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 4'
        }
    } #-MenuColor Black -MenuColorBackground Pink -HomeColorBackground Black -HomeColor Red
    New-HTMLHeader {
        New-HTMLText -Text 'In header - main page'
    }
    New-HTMLTab -Name 'Test 21' {
        New-HTMLText -Text "This is first page - tab 1" -Color Red -FontSize 40px -Alignment center

    }
    New-HTMLTab -Name 'Test 22' {
        New-HTMLText -Text "This is first page - tab 2" -Color Red -FontSize 40px -Alignment center
    }
    New-HTMLFooter {
        New-HTMLText -Text 'In footer - main page'
    }

    New-HTMLPage -Name 'Page 1' {
        New-HTMLHeader {
            New-HTMLText -Text 'In header'
            New-HTMLContent -Content "P:\_Scripts\Dashboards_Testing\VMinventory.html"
        }

        New-HTMLFooter {
            New-HTMLText -Text 'In footer'
        }
    }
    New-HTMLPage -Name 'Page 2' {
        New-HTMLSection -HeaderText 'Test2' {
            New-HTMLTable -DataTable $DataTable1 -Title 'Test2' -PagingLength 2
        }
    }
    #} -ShowHTML -Online -FilePath $PSScriptRoot\Example41-Navigation03.html

}-ShowHTML -Online -FilePath "P:\_Scripts\Dashboards_Testing\Home.html"
PrzemyslawKlys commented 1 year ago

So the thing is you can't modify existing HTML document without heavy parsing. When I created the NavBars (3 kinds) what I did is actually thought on how to address the issue that you are having. Essentially all my modules GPOZaurr/Testimo and so on, all generrate HTML reports and how to combine them into a single Dashboard.

The problem is:

So I did entertain the idea that I would have PSWriteHTML use PSParseHTML to get current scripts, compare with new scripts, merge NavBar at the top which may or may not work. But then I was thinking - ok, this will require the reports to be generrated by PSWriteHTML and if you try to merge anything else it will be bonkers. There's just too many unknowns. Like I wanted to integrated PingCastle to it.

So what I did instead is use New-HTMLFrame. Basically you create pages as you do above, that link to existing HTML files that are displayed within a frame. And it works.

I've created project TheDashboard which takes existing files, and history of the reports and merges it into a dashboard

image

And then if you choose report, you go to next page, which then shows you newest report, but with ability to go back in time and check older reports (if present). The marked rectangle is basically a frame that displays HTML that sits somewhere else. So the main page is small (if you use links, not include full CSS/JS), that links to a much larger document.

image

I guess you're trying to build something similar, and I have this working on IIS/SharePoint for a long time now where I've learnt what works, what doesn't. I do plan on releasing TheDashboard, but I'm thinking on it as "sponsorware" at the moment. But I have not decided yet on how to do it. If you want to do it yourself, New-HTMLFrame is what you need.

amolsp777 commented 1 year ago

Thanks. Let me digest this and test it.

amolsp777 commented 1 year ago

That worked, as I wanted to. Thanks for giving this life saver Module. So what I tried and what is the concern now.

I tried the below code I working perfectly fine as the mentioned page opens in the same master page panel.

> Working

New-HTML {
    New-HTMLNavTop -Logo 'https://evotec.xyz/wp-content/uploads/2021/04/Logo-evotec-bb.png'   -LogoLinkHome -MenuColorBackground LightBlue -HomeColor black  -MenuColor Black -HomeColorBackground White -HomeLinkHome {
    #endregion Top Menu part

    #region  All the Menus
        New-NavTopMenu -Name 'Report' -IconSolid receipt {
            New-NavLink -IconMaterial accounts-alt -Name 'VM Inventory' -InternalPageID 'Page 1' 
            New-NavLink -IconMaterial alarm-check -Name 'Server reboot' -InternalPageID 'Page 2'
            New-NavLink -Name 'Inventory' -IconBrands   blogger {
                New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                New-NavLink -IconSolid address-book -Name 'This is link 6' {
                    New-NavLink -Name 'This is link 3' -IconBrands confluence {
                        New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                        New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 6'
                    }
                }
            }
        }
        New-NavTopMenu -Name ' Bookmarks' -IconSolid bookmark {
            New-NavLink -IconSolid address-book -Href 'https://portal.azure.com' -Name 'Azure'
            New-NavLink -IconBrands codiepie -Href 'https://www.vmware.com/support/services.html' -Name 'VMware Support'
            New-NavLink -IconBrands codiepie -Href 'https://github.com/' -Name 'GitHub'
        }
        New-NavTopMenu -Name 'IntraLinks' {
            New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 4'
        }
    #endregion All the Menus

   } #-MenuColor Black -MenuColorBackground Pink -HomeColorBackground Black -HomeColor Red
   New-HTMLPage -Name 'Page 1' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\VMInventory\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'VM Inventory'
        }
    New-HTMLPage -Name 'Page 2' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\RebootCheck\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'Server reboot'
        }

<#
        New-HTMLSection {
            New-HTMLFrame -SourcePath "https://google.com"
        } -HeaderText 'Test' -Height 100px
#>
    } -Online -TitleText 'Test Inline' -ShowHTML -FilePath "$PSScriptRoot\Example-InlineHTML01.html" -AddComment

Now if I am trying to add the Tab or Section its not working properly and data also not showing in formated way.

New-HTML {
    New-HTMLNavTop -Logo 'https://evotec.xyz/wp-content/uploads/2021/04/Logo-evotec-bb.png'   -LogoLinkHome -MenuColorBackground LightBlue -HomeColor black  -MenuColor Black -HomeColorBackground White -HomeLinkHome {
    #endregion Top Menu part

    #region  All the Menus
        New-NavTopMenu -Name 'Report' -IconSolid receipt {
            New-NavLink -IconMaterial accounts-alt -Name 'VM Inventory' -InternalPageID 'Page 1' 
            New-NavLink -IconMaterial alarm-check -Name 'Server reboot' -InternalPageID 'Page 2'
            New-NavLink -Name 'Inventory' -IconBrands   blogger {
                New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                New-NavLink -IconSolid address-book -Name 'This is link 6' {
                    New-NavLink -Name 'This is link 3' -IconBrands confluence {
                        New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                        New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 6'
                    }
                }
            }
        }
        New-NavTopMenu -Name ' Bookmarks' -IconSolid bookmark {
            New-NavLink -IconSolid address-book -Href 'https://portal.azure.com' -Name 'Azure'
            New-NavLink -IconBrands codiepie -Href 'https://www.vmware.com/support/services.html' -Name 'VMware Support'
            New-NavLink -IconBrands codiepie -Href 'https://github.com/' -Name 'GitHub'
        }
        New-NavTopMenu -Name 'IntraLinks' {
            New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 4'
        }
    #endregion All the Menus

   } #-MenuColor Black -MenuColorBackground Pink -HomeColorBackground Black -HomeColor Red
   New-HTMLPage -Name 'Page 1' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\VMInventory\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'VM Inventory'
        }
    New-HTMLPage -Name 'Page 2' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\RebootCheck\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'Server reboot'
        }

    New-HTMLTab -Name 'Dashboard' -IconRegular chart-bar   {
       New-HTMLSection  -Name 'Block info' -Width 10% {

       New-HTMLSection  -Name 'Sub-Block info' -Margin 10 -Width 15%    {
                New-HTMLPanel -Margin 10 {

                    New-HTMLPanel -BackgroundColor lightgreen -AlignContentText right -BorderRadius 10px {
                        New-HTMLText -TextBlock {
                           # New-HTMLText -Text $UserDisabled -Alignment justify -FontSize 25 -FontWeight bold 
                            New-HTMLText -Text 50 -Alignment justify -FontSize 25 -FontWeight bold 
                            New-HTMLText -Text 'Active Test' -Alignment justify -FontSize 15 
                            New-HTMLTag -Tag 'i' -Attributes @{ class = "fas fa-user-slash fa-3x" } 
                        } 
                    }

                    New-HTMLPanel -BackgroundColor yellowgreen -AlignContentText right -BorderRadius 10px {
                        New-HTMLText -TextBlock { 
                            #New-HTMLText -Text $userinactive -Alignment justify -FontSize 25 -FontWeight bold 
                            New-HTMLText -Text 130 -Alignment justify -FontSize 25 -FontWeight bold
                            New-HTMLText -Text 'Failed Test' -Alignment justify -FontSize 15 
                            New-HTMLTag -Tag 'span' -Attributes @{ class = "fas fa-user-clock fa-3x" } 
                        }
                    }

                }
                }

           }
    }

    } -Online -TitleText 'Test Inline' -ShowHTML -FilePath "$PSScriptRoot\Example-InlineHTML01.html" -AddComment
PrzemyslawKlys commented 1 year ago

Just move New-HTMLPage to the end, as it's supposed to be processed as last.

New-HTML {
    New-HTMLNavTop -Logo 'https://evotec.xyz/wp-content/uploads/2021/04/Logo-evotec-bb.png' -LogoLinkHome -MenuColorBackground LightBlue -HomeColor black -MenuColor Black -HomeColorBackground White -HomeLinkHome {
        #endregion Top Menu part

        #region  All the Menus
        New-NavTopMenu -Name 'Report' -IconSolid receipt {
            New-NavLink -IconMaterial accounts-alt -Name 'VM Inventory' -InternalPageID 'Page 1'
            New-NavLink -IconMaterial alarm-check -Name 'Server reboot' -InternalPageID 'Page 2'
            New-NavLink -Name 'Inventory' -IconBrands blogger {
                New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                New-NavLink -IconSolid address-book -Name 'This is link 6' {
                    New-NavLink -Name 'This is link 3' -IconBrands confluence {
                        New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 5'
                        New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 6'
                    }
                }
            }
        }
        New-NavTopMenu -Name ' Bookmarks' -IconSolid bookmark {
            New-NavLink -IconSolid address-book -Href 'https://portal.azure.com' -Name 'Azure'
            New-NavLink -IconBrands codiepie -Href 'https://www.vmware.com/support/services.html' -Name 'VMware Support'
            New-NavLink -IconBrands codiepie -Href 'https://github.com/' -Name 'GitHub'
        }
        New-NavTopMenu -Name 'IntraLinks' {
            New-NavLink -IconMaterial airplane -Href 'https://evotec.xyz' -Name 'This is link 1'
            New-NavLink -IconSolid address-book -Href 'https://evotec.xyz' -Name 'This is link 2'
            New-NavLink -IconBrands codiepie -Href 'https://evotec.xyz' -Name 'This is link 4'
        }
        #endregion All the Menus

    } #-MenuColor Black -MenuColorBackground Pink -HomeColorBackground Black -HomeColor Red

    New-HTMLTab -Name 'Dashboard' -IconRegular chart-bar {
        New-HTMLSection -Name 'Block info' -Width 10% {

            New-HTMLSection -Name 'Sub-Block info' -Margin 10 -Width 15% {
                New-HTMLPanel -Margin 10 {

                    New-HTMLPanel -BackgroundColor lightgreen -AlignContentText right -BorderRadius 10px {
                        New-HTMLText -TextBlock {
                            # New-HTMLText -Text $UserDisabled -Alignment justify -FontSize 25 -FontWeight bold
                            New-HTMLText -Text 50 -Alignment justify -FontSize 25 -FontWeight bold
                            New-HTMLText -Text 'Active Test' -Alignment justify -FontSize 15
                            New-HTMLTag -Tag 'i' -Attributes @{ class = "fas fa-user-slash fa-3x" }
                        }
                    }

                    New-HTMLPanel -BackgroundColor yellowgreen -AlignContentText right -BorderRadius 10px {
                        New-HTMLText -TextBlock {
                            #New-HTMLText -Text $userinactive -Alignment justify -FontSize 25 -FontWeight bold
                            New-HTMLText -Text 130 -Alignment justify -FontSize 25 -FontWeight bold
                            New-HTMLText -Text 'Failed Test' -Alignment justify -FontSize 15
                            New-HTMLTag -Tag 'span' -Attributes @{ class = "fas fa-user-clock fa-3x" }
                        }
                    }

                }
            }

        }
    }

    New-HTMLPage -Name 'Page 1' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\VMInventory\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'VM Inventory'
    }
    New-HTMLPage -Name 'Page 2' {
        New-HTMLSection {
            New-HTMLFrame -SourcePath "P:\InfraWeb\RebootCheck\Home.html" -Scrolling Auto -Height 1500px
        } -HeaderText 'Server reboot'
    }
} -Online -TitleText 'Test Inline' -ShowHTML -FilePath "$PSScriptRoot\Example-InlineHTML01.html" -AddComment

The way it works that way is that when you add New-HTMLPage, it basically treats anything that comes before New-HTMLPage, as not defined New-HTMLPage that is the primary page. If you mix it up it gets confused what goes where. I am not sure if it's worth my effort to do anything about it. Probably not.

amolsp777 commented 1 year ago

That worked. Thank you so much once again. Now I will build my Dashboard and see what other challenges I face.