Updating Mudblazor Version

2025-04-27 19:34:50 -04:00
parent 38ff4e3e89
commit e820457176
153 changed files with 5010 additions and 2059 deletions
@@ -2,7 +2,7 @@

@inherits BasePage

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService


@page "/about"
@@ -16,7 +16,8 @@
                What is this website for?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                This is just a "yet another third-party tool" website for a video game. If you played a game like Path of Exile, you are probably already used to seeing a bunch of said tools.
+                This is just a "yet another third-party tool" website for a video game. If you played a game like Path
+                of Exile, you are probably already used to seeing a bunch of said tools.
            </InfoAnswerComponent>
        </InfoBodyComponent>
        <InfoBodyComponent>
@@ -24,7 +25,9 @@
                So what is <i>this</i> specific tool for?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                Ideally, this website will be a casual reference, for getting started with understanding the themes and game patterns of IMMORTAL: Gates of Pyre. That said, this tool is currently not near to achieving said goal. In the meantime, you can check out the simple calculator and database tools on this website.
+                Ideally, this website will be a casual reference, for getting started with understanding the themes and
+                game patterns of IMMORTAL: Gates of Pyre. That said, this tool is currently not near to achieving said
+                goal. In the meantime, you can check out the simple calculator and database tools on this website.
            </InfoAnswerComponent>
        </InfoBodyComponent>
        <InfoBodyComponent>
@@ -40,7 +43,9 @@
                Any disclaimers?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                This website has no association with "SunSpear Games." Beyond that, any game data displayed on this website for "IMMORTAL: Gates of Pyre" may be inaccurate due to my own human error and time limitations. Use with caution.
+                This website has no association with "SunSpear Games." Beyond that, any game data displayed on this
+                website for "IMMORTAL: Gates of Pyre" may be inaccurate due to my own human error and time limitations.
+                Use with caution.
            </InfoAnswerComponent>
        </InfoBodyComponent>
    </PaperComponent>
@@ -1,5 +1,5 @@
@using Services.Website
-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService
@inject NavigationManager NavigationManager


@@ -10,7 +10,7 @@
@inject IEconomyService EconomyService
@inject IToastService ToastService
@inject ITimingService TimingService
-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService

@page "/build-calculator"
@using Services.Website
@@ -22,7 +22,7 @@
    <AlertComponent Type="@SeverityType.Warning">
        <Title>Work In Progress and Not Fully Tested</Title>
        <Message>
-            Build Calculator hasn't been thoroughly tested. Bugs and inaccurate results assumed. 
+            Build Calculator hasn't been thoroughly tested. Bugs and inaccurate results assumed.
            <br/>
            Currently not considering running out of alloy and ether to harvest.
        </Message>
@@ -32,7 +32,8 @@

    <div class="calculatorGrid">
        <div class="gridItem" style="grid-area: timing;">
-            <ButtonComponent MyButtonType="MyButtonType.Secondary" OnClick="OnResetClicked">Clear Build Order</ButtonComponent>
+            <ButtonComponent MyButtonType="MyButtonType.Secondary" OnClick="OnResetClicked">Clear Build Order
+            </ButtonComponent>
            <PanelComponent>
                <InfoTooltipComponent InfoText="@Locale["Tooltip Timing Info"]">
                    <TimingComponent></TimingComponent>
@@ -119,7 +120,8 @@
                    What is this tool?
                </InfoQuestionComponent>
                <InfoAnswerComponent>
-                    This is a calculator to determine build timings. Mostly so someone can quickly try out a few build orders to see if they somewhat make sense.
+                    This is a calculator to determine build timings. Mostly so someone can quickly try out a few build
+                    orders to see if they somewhat make sense.
                </InfoAnswerComponent>
            </InfoBodyComponent>

@@ -128,13 +130,22 @@
                    How does it work?
                </InfoQuestionComponent>
                <InfoAnswerComponent>
-                    The tool calculates every second of game time. So if you attempt to build a <b>Legion Hall</b> as your first action, the tool will scan every second, until you get to one where the request can be made. In this case, that is interval 58.
+                    The tool calculates every second of game time. So if you attempt to build a <b>Legion Hall</b> as
+                    your first action, the tool will scan every second, until you get to one where the request can be
+                    made. In this case, that is interval 58.
                    <br/>
                    <br/>
-                    If you then build 2 <b>Apostle of Bindings</b> a <b>Soul Foundry</b> and a 3 <b>Absolvers</b> you should see yourself roughly floating 500 alloy, with barely having any ether. Which means you could of gotten an <b>Acropolis</b> and a <b>Zentari</b> without hurting your build.
+                    If you then build 2 <b>Apostle of Bindings</b> a <b>Soul Foundry</b> and a 3 <b>Absolvers</b> you
+                    should see yourself roughly floating 500 alloy, with barely having any ether. Which means you could
+                    of gotten an <b>Acropolis</b> and a <b>Zentari</b> without hurting your build.
                    <br/>
                    <br/>
-                    Try building <b>Apostle of Bindings</b> before the <b>Legion Hall</b> and see how that changes the timing of your 3 <b>Absolvers</b>. (Spoiler: <SpoilerTextComponent> your <b>Absolvers</b> will be built much faster, and you won't be floating so much alloy.</SpoilerTextComponent>)
+                    Try building <b>Apostle of Bindings</b> before the <b>Legion Hall</b> and see how that changes the
+                    timing of your 3 <b>Absolvers</b>. (Spoiler:
+                    <SpoilerTextComponent> your <b>Absolvers</b> will be built much faster, and you won't be floating so
+                        much alloy.
+                    </SpoilerTextComponent>
+                    )
                </InfoAnswerComponent>
            </InfoBodyComponent>

@@ -230,7 +241,7 @@
        DataCollectionService.SendEvent(
            DataCollectionKeys.PageInitialized,
            new Dictionary<string, string> { { "page", "build-calculator" } }
-            );
+        );
    }

    void IDisposable.Dispose()
@@ -13,7 +13,8 @@
                <Display>@lastInterval | T @Interval.ToTime(lastInterval)</Display>
            </FormDisplayComponent>
            <FormDisplayComponent Label="Army Attacking At">
-                <Display>@(lastInterval + timingService.GetTravelTime()) | T @Interval.ToTime(lastInterval + timingService.GetTravelTime())</Display>
+                <Display>@(lastInterval + timingService.GetTravelTime()) |
+                    T @Interval.ToTime(lastInterval + timingService.GetTravelTime())</Display>
            </FormDisplayComponent>
        </div>
        <FormDisplayComponent Label="Army units built">
@@ -38,32 +39,36 @@

 <style>
    .armyView {
-        overflow-y: scroll; width: 100%; overflow-x: hidden; height: 350px;
-}
+        overflow-y: scroll;
+        width: 100%;
+        overflow-x: hidden;
+        height: 350px;
+    }

-.armyCardsContainer {
-    display: flex; 
-    width: 100%; 
-    gap: 16px;  
-    flex-wrap: wrap;
-}
+    .armyCardsContainer {
+        display: flex;
+        width: 100%;
+        gap: 16px;
+        flex-wrap: wrap;
+    }

    .armyCard {
-        width:100px; 
-        height: 80px; 
+        width: 100px;
+        height: 80px;
        padding: 16px;
    }
-    
+
    .armyCountPosition {
        height: 0;
        top: -20px;
        left: -16px;
        position: relative;
    }
+
    .armyCount {
        font-weight: bolder;
    }
-    
+
 </style>

@code {
@@ -134,7 +139,7 @@
            }
        }

-    //TODO Better
+        //TODO Better
        var armyCountIs = 0;
        foreach (var army in armyCount)
        {
@@ -7,7 +7,8 @@

 <div class="bankContainer">
    <FormDisplayComponent Label="Time">
-        <Display>@(BuildOrderService.GetLastRequestInterval() + 1) | T @Interval.ToTime(BuildOrderService.GetLastRequestInterval() + 1)</Display>
+        <Display>@(BuildOrderService.GetLastRequestInterval() + 1) |
+            T @Interval.ToTime(BuildOrderService.GetLastRequestInterval() + 1)</Display>
    </FormDisplayComponent>
    <div class="bankRow">
        <FormDisplayComponent Label="Alloy">
@@ -48,7 +49,7 @@
        flex-direction: column;
        gap: 5px;
    }
-    
+
    .workerText {
        margin-bottom: -2px;
        font-size: 0.8em;
@@ -62,11 +63,9 @@

@code {

-    [Inject]
-    IBuildOrderService BuildOrderService { get; set; } = default!;
+    [Inject] IBuildOrderService BuildOrderService { get; set; } = default!;

-    [Inject]
-    IEconomyService EconomyService { get; set; } = default!;
+    [Inject] IEconomyService EconomyService { get; set; } = default!;

    EconomyModel _economy = new();
    int _supplyGranted;
@@ -77,8 +76,8 @@
    {
        base.OnInitialized();
        BuildOrderService.Subscribe(OnBuildOrderChanged);
-        
-        
+
+
        _economy = EconomyService.GetEconomy(BuildOrderService.GetLastRequestInterval() + 1);
    }

@@ -16,7 +16,8 @@ else
            var takenPixels = new Dictionary<int, bool>();

            <div style="width: @chart.IntervalDisplayMax.ToString()px; height: @chart.ValueDisplayMax.ToString()px">
-                <div style="position: relative; border: 2px solid gray; border-radius:2px; width: @chart.IntervalDisplayMax.ToString()px; height: @chart.ValueDisplayMax.ToString()px">
+                <div
+                    style="position: relative; border: 2px solid gray; border-radius:2px; width: @chart.IntervalDisplayMax.ToString()px; height: @chart.ValueDisplayMax.ToString()px">
                    @foreach (var point in chart.Points)
                    {
                        var x = int.Parse(point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax));
@@ -27,11 +28,12 @@ else


                        <div style="position: absolute;
-							bottom:@point.GetValue(chart.HighestValuePoint, chart.ValueDisplayMax)px;
-							left:@point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax)px;
-							width: 0px;
-							height: 0px;">
-                            <div style="width:1px; height: 1px; border-top-right-radius:10px; border-top-left-radius:10px; border: 2px solid @chart.ChartColor; background-color:@chart.ChartColor">
+                            bottom:@point.GetValue(chart.HighestValuePoint, chart.ValueDisplayMax)px;
+                        left:@point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax)px;
+                        width: 0px;
+                        height: 0px;">
+                            <div
+                                style="width:1px; height: 1px; border-top-right-radius:10px; border-top-left-radius:10px; border: 2px solid @chart.ChartColor; background-color:@chart.ChartColor">
                            </div>
                        </div>
                    }
@@ -42,16 +44,16 @@ else


    <style>
-    .chartsContainer {
-        position: relative;
-        display: flex;
-        gap: 20px;
-        flex-wrap: wrap;
-        justify-content: center;
-        margin-bottom: 20px;
-    }
-    
-</style>
+        .chartsContainer {
+            position: relative;
+            display: flex;
+            gap: 20px;
+            flex-wrap: wrap;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+    </style>

    <FormLayoutComponent>
        <FormDisplayComponent Label="Highest Alloy">
@@ -103,7 +105,7 @@ else
    }


-    int lastRequestedRefreshIndex = 0;
+    int lastRequestedRefreshIndex;

    void OnAge(object? sender, ElapsedEventArgs elapsedEventArgs)
    {
@@ -130,7 +132,7 @@ else
    }


-    int requestedRefreshIndex = 0;
+    int requestedRefreshIndex;

    void OnBuilderOrderChanged()
    {
@@ -320,8 +322,8 @@ else
        charts.Add(etherChart);


-    //TODO WIP
-    //charts.Add(pyreChart);
+        //TODO WIP
+        //charts.Add(pyreChart);

        charts.Add(armyChart);

@@ -18,12 +18,15 @@
 }
 <style>
    .entityClickView {
-        overflow-y: scroll; width: 100%; overflow-x: hidden; height: 550px;
+        overflow-y: scroll;
+        width: 100%;
+        overflow-x: hidden;
+        height: 550px;
    }
 </style>

@code {
-    private EntityModel? _entity = default!;
+    private EntityModel? _entity;
    private string _viewType = EntityViewType.Detailed;

    protected override void OnInitialized()
@@ -8,7 +8,7 @@
@inject IEconomyService EconomyService
@inject ITimingService TimingService
@inject IToastService ToastService
-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService


 <InputPanelComponent>
@@ -22,7 +22,8 @@


            var color = (hotkey.KeyText.Equals("SPACE") && KeyService.IsHoldingSpace()) || KeyService.GetAllPressedKeys().Contains(hotkey.KeyText)
-                ? "#0a0f12" : hotkey.GetColor();
+                ? "#0a0f12"
+                : hotkey.GetColor();

            var x = hotkey.PositionX * Size;
            var y = hotkey.PositionY * Size + (hotkey.PositionY == 0 ? 5 : -50);
@@ -37,6 +38,7 @@
            {
                border = "5px solid black";
            }
+
            if (hotkey.KeyText.Equals(controlGroup))
            {
                color = "#257525";
@@ -49,9 +51,9 @@

            var keyText = hotkey.KeyText.Equals("CAPSLOCK") ? "Caps"
                : hotkey.KeyText.Equals("CONTROL") ? "Ctrl"
-                    : hotkey.KeyText.Equals("SHIFT") ? "Shift"
-                        : hotkey.KeyText.Equals("TAB") ? "Tab"
-                            : hotkey.KeyText.Equals("SPACE") ? "Space" : hotkey.KeyText;
+                : hotkey.KeyText.Equals("SHIFT") ? "Shift"
+                : hotkey.KeyText.Equals("TAB") ? "Tab"
+                : hotkey.KeyText.Equals("SPACE") ? "Space" : hotkey.KeyText;


            var controlStyle = $"background-color:{color}; " +
@@ -74,11 +76,11 @@
            var usedStyle = hotkey.PositionY == 0 ? controlStyle : keyStyle;

            <div style="position:relative;
-                    cursor:pointer;
-							top:@y.ToString()px;
-							left:@x.ToString()px;
-							width: 0px;
-							height: 0px;">
+                cursor:pointer;
+                top:@y.ToString()px;
+            left:@x.ToString()px;
+            width: 0px;
+            height: 0px;">

                <div @onclick="e => ButtonClicked(e, hotkey)" style="@usedStyle">
                    @keyText
@@ -138,8 +140,7 @@

@code {

-    [Parameter]
-    public int Size { get; set; } = 100;
+    [Parameter] public int Size { get; set; } = 100;

    readonly Dictionary<string, EntityModel> data = EntityModel.GetDictionary();
    readonly List<HotkeyModel> hotkeys = HotkeyModel.GetAll();
@@ -163,7 +164,7 @@
        BuildOrderService.Unsubscribe(OnBuilderOrderChanged);
    }

-    int completedTimeCount = 0;
+    int completedTimeCount;

    void OnBuilderOrderChanged()
    {
@@ -237,6 +238,7 @@
        {
            return false;
        }
+
        return true;
    }

@@ -256,6 +258,7 @@
        {
            return false;
        }
+
        return true;
    }

@@ -265,6 +268,7 @@
        {
            return false;
        }
+
        return true;
    }

@@ -274,6 +278,7 @@
        {
            return false;
        }
+
        return true;
    }

@@ -286,26 +291,32 @@
        {
            controlGroup = "Z";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("TAB"))
        {
            controlGroup = "TAB";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("C"))
        {
            controlGroup = "C";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("D"))
        {
            controlGroup = "D";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("V"))
        {
            controlGroup = "V";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("ALT"))
        {
            controlGroup = "ALT";
        }
+
        if (KeyService.GetAllPressedKeys().Contains("SHIFT"))
        {
            controlGroup = "SHIFT";
@@ -367,7 +378,7 @@
        DataCollectionService.SendEvent(
            DataCollectionKeys.BuildCalcInput,
            new Dictionary<string, string> { { "key", hotkey.KeyText.ToLower() }, { "input-source", "mouse" } }
-            );
+        );


        if (hotkey.KeyText.Equals(HotKeyType.SPACE.ToString()))
@@ -1,7 +1,7 @@
@using Services.Website
@inject IKeyService KeyService

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService
@inject IJSRuntime JsRuntime


@@ -16,15 +16,14 @@

@code {

-    [Parameter]
-    public RenderFragment ChildContent { get; set; } = default!;
+    [Parameter] public RenderFragment ChildContent { get; set; } = default!;

    private void HandleKeyDown(KeyboardEventArgs e)
    {
        DataCollectionService.SendEvent(
            DataCollectionKeys.BuildCalcInput,
            new Dictionary<string, string> { { "key", e.Key.ToLower() }, { "input-source", "keyboard" } }
-            );
+        );

        KeyService.AddPressedKey(e.Key);
    }
@@ -12,7 +12,9 @@
                         Value="BuildDelay"
                         OnChange="@OnBuildingInputDelayChanged">
        <FormLabelComponent>Building Input Delay</FormLabelComponent>
-        <FormInfoComponent>Add a input delay to constructing buildings for simulating worker movement and player micro.</FormInfoComponent>
+        <FormInfoComponent>Add a input delay to constructing buildings for simulating worker movement and player
+            micro.
+        </FormInfoComponent>
    </FormNumberComponent>
    <div class="optionRow">
        <FormLayoutComponent>
@@ -1,6 +1,6 @@
@layout PageLayout

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService
@inherits BasePage

@page "/contact"
@@ -14,7 +14,8 @@
                How do I contact you for feature requests and bug reports?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                You can message me at <b>JonathanMcCaffrey#3544</b> on my <a href="https://discord.gg/uMq8bMGeeN" target="_blank">Discord</a> channel.
+                You can message me at <b>JonathanMcCaffrey#3544</b> on my <a href="https://discord.gg/uMq8bMGeeN"
+                                                                             target="_blank">Discord</a> channel.
            </InfoAnswerComponent>
        </InfoBodyComponent>
    </PaperComponent>
@@ -1,6 +1,6 @@
@page "/data-collection"

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService
@inherits BasePage

@layout PageLayout
@@ -0,0 +1,393 @@
+@layout PageLayout
+
+@inject IDataCollectionService DataCollectionService
+@using Model
+@inherits BasePage
+
+@page "/data-tables"
+
+<LayoutMediumContentComponent>
+    <WebsiteTitleComponent>Comparision Tables</WebsiteTitleComponent>
+
+    <PaperComponent>
+        Credit to Zard for deriving the formula.
+    </PaperComponent>
+
+    <PaperComponent>
+        <LayoutRowComponent>
+            <LayoutColumnComponent>
+                <FormLayoutComponent>
+                    <FormDisplayComponent Label="Cost of worker">
+                        <Display>@CostOfWorker</Display>
+                    </FormDisplayComponent>
+
+                    <FormDisplayComponent Label="Alloy mined per second by worker">
+                        <Display>@AlloyMinedPerSecondByWorker</Display>
+                    </FormDisplayComponent>
+
+                    <FormDisplayComponent Label="Time to produce worker">
+                        <Display>@TimeToProduceWorker</Display>
+                    </FormDisplayComponent>
+                </FormLayoutComponent>
+            </LayoutColumnComponent>
+
+            <LayoutColumnComponent>
+                <FormLayoutComponent>
+                    <FormNumberComponent Min="1"
+                                         Id="numberOfWorkersLostToHarass"
+                                         Value="@((int)NumberOfWorkersLostToHarass)"
+                                         OnChange="@(e =>
+                                                   {
+                                                       NumberOfWorkersLostToHarass = int.Parse(e.Value!.ToString()!);
+                                                       Calculate();
+                                                   })">
+                        <FormLabelComponent>Number of workers lost to harass</FormLabelComponent>
+                    </FormNumberComponent>
+
+                    <FormNumberComponent Min="1"
+                                         Id="numberOfTownHallsExisting"
+                                         Value="@((int)NumberOfTownHallsExisting)"
+                                         OnChange="OnTownHallsChanged">
+                        <FormLabelComponent>Number of townhalls you have</FormLabelComponent>
+                    </FormNumberComponent>
+
+                    <div id="numberOfTownHallTravelTimes">
+                        @{
+                            var index = 0;
+                        }
+                        @foreach (var travelTime in TravelTimes)
+                        {
+                            index++;
+                            if (index == 1)
+                            {
+                                continue;
+                            }
+
+                            var id = $"numberOfTownHallsExisting_{index}";
+                            <FormNumberComponent Min="0"
+                                                 Id="@id"
+                                                 Value="@((int)travelTime.Value)"
+                                                 OnChange="e => { OnTownHallTravelTimeChanged(e, travelTime); }">
+                                <FormLabelComponent>Worker travel time from other
+                                    base @(travelTime.Index + 1)</FormLabelComponent>
+                            </FormNumberComponent>
+                        }
+                    </div>
+
+
+                    <FormDisplayComponent Label="Total alloy lost">
+                        <Display>
+                            <div style="font-size: 1.5rem; font-weight: 800;">
+                                <span id="totalAlloyHarassment">
+                                    @TotalAlloyHarassment
+                                </span>
+                            </div>
+                        </Display>
+                    </FormDisplayComponent>
+
+
+                </FormLayoutComponent>
+
+                <br/>
+                <div>
+                    (<b>Worker replacement costs:</b> <span id="workerReplacementCost">@WorkerReplacementCost()</span>)
+                </div>
+                <div>
+                    (<b>Delayed mining time:</b> <span id="delayedMiningCost">@DelayedMiningCost()</span>)
+                </div>
+                <div>
+                    (<b>Average travel time:</b> <span id="getAverageTravelTime">@GetAverageTravelTime()</span>)
+                </div>
+
+            </LayoutColumnComponent>
+        </LayoutRowComponent>
+    </PaperComponent>
+
+    <ContentDividerComponent></ContentDividerComponent>
+
+    <PaperComponent>
+        <InfoBodyComponent>
+            <InfoQuestionComponent>
+                What is this tool?
+            </InfoQuestionComponent>
+            <InfoAnswerComponent>
+                The Harass Calculator allows you to calculate damage done to an enemy alloy line. For example, if you
+                were to attack with Ichors, and kill 6 enemy workers, you can set the
+                <b>
+                    Number of workers lost to
+                    harass
+                </b> to 6. This would determine a loss of <span id="exampleTotalAlloyLoss">@ExampleTotalAlloyLoss</span>
+                alloy. Quite
+                the large number.
+            </InfoAnswerComponent>
+        </InfoBodyComponent>
+
+        <InfoBodyComponent>
+            <InfoQuestionComponent>
+                What can I learn from this?
+            </InfoQuestionComponent>
+            <InfoAnswerComponent>
+                Well, let's assume you lost a full alloy line of workers, and have to take that
+                @ExampleTotalAlloyLoss alloy cost (<span id="exampleWorkerCost">@ExampleWorkerCost</span>
+                to rebuy the workers, and <span id="exampleMiningTimeCost">@ExampleMiningTimeCost</span> in lost mining
+                time.)
+                <br/><br/>
+                If you were to set the <b>Number of townhalls you have</b> to 2, the calculator will consider worker
+                transfer micro. Allowing you to cut the total cost by roughly
+                <span id="exampleTotalAlloyLossDifference">@ExampleTotalAlloyLossDifference</span> alloy. However, that
+                number isn't
+                entirely accurate, you are also going to have to bump up the <b>Worker travel time to alloy</b> to
+                account for the time it takes the transferred workers to arrive at the decimated alloy line.
+                <br/><br/>
+                Let's say it takes 10 seconds for workers to transfer from your second base. Let's enter that for the
+                second base travel time for the more accurate loss of
+                <span
+                    id="exampleTotalAlloyLossAccurate">
+                    @ExampleTotalAlloyLossAccurate
+                </span> alloy
+                (saving you <span
+                    id="exampleTotalAlloyLossAccurateDifference">@ExampleTotalAlloyLossAccurateDifference</span> alloy.)
+                <i>
+                    Which is
+                    much better than not transferring workers!
+                </i>
+            </InfoAnswerComponent>
+        </InfoBodyComponent>
+
+        <InfoBodyComponent>
+            <InfoQuestionComponent>
+                Can I see the formula for the calculation?
+            </InfoQuestionComponent>
+            <InfoAnswerComponent>
+                The Harass Calculator is based on the following calculation.
+
+                <br/>
+                <div class="mathContainer">
+                    <div> =c*m+r*g*(t+l) +</div>
+
+                    <MathLoopSumComponent>
+                        <LoopStart><i>x</i> =1</LoopStart>
+                        <LoopEnd>
+                            ⌊
+                            <MathDivisionComponent>
+                                <Dividee>m</Dividee>
+                                <Divider>a</Divider>
+                            </MathDivisionComponent>
+                            ⌋
+                        </LoopEnd>
+                        <IndexSymbol>
+                            <i>x</i>
+                        </IndexSymbol>
+                    </MathLoopSumComponent>
+
+                    <div style="width: 132px">g*<i>x</i>*(t+l)</div>
+                </div>
+                <br/>
+                <div style="font-family:monospace;">
+                    <div>c is CostOfWorker</div>
+                    <div>m is NumberOfWorkersLostToHarass, <i>m for [M]otes</i></div>
+                    <div>a is NumberOfTownHallsExisting, <i>a for [A]cropolis</i></div>
+                    <div>r is m mod a is LeftOverWorkersToProduceCount()</div>
+                    <div>g is AlloyMinedPerSecondByWorker</div>
+                    <div>t is TimeToProduceWorker</div>
+                    <div>l is TravelTime</div>
+                    <div><i>x</i> is workerProductionIndex</div>
+                </div>
+                <br/>
+                This logic has since been changed slightly to allow client to enter different travel times per base.
+                <br/>
+            </InfoAnswerComponent>
+        </InfoBodyComponent>
+        <InfoBodyComponent>
+            <InfoQuestionComponent>
+                Can I see the code for the calculation?
+            </InfoQuestionComponent>
+            <InfoAnswerComponent>
+                <br/>
+                <LinkButtonComponent
+                    Href="https://git.jonathanmccaffrey.ca/JonathanMcCaffrey/IGP-Fan-Reference/src/branch/main/IGP/Pages/HarassCalculatorPage.razor#L226">
+                    View Here
+                </LinkButtonComponent>
+            </InfoAnswerComponent>
+        </InfoBodyComponent>
+    </PaperComponent>
+
+
+</LayoutMediumContentComponent>
+
+<style>
+    .mathContainer {
+        font-family: monospace;
+        display: flex;
+        flex-direction: row;
+        align-items: flex-start;
+        border: 1px black solid;
+        padding: 32px;
+        background-color: #1A1B1E
+    }
+
+    @@media only screen and (max-width: 1025px) {
+        .mathContainer {
+            padding-left: 2px;
+            padding-right: 2px;
+        }
+    }
+</style>
+
+@code {
+
+    // Example calcs
+    float ExampleTotalAlloyLoss => Calculate(
+        WorkerReplacementCost(6),
+        SimultaneousProductionFloor(1, 6),
+        6,
+        new List<float> { 0 });
+
+    float ExampleWorkerCost => WorkerReplacementCost(6);
+
+    float ExampleMiningTimeCost => ExampleTotalAlloyLoss - ExampleWorkerCost;
+
+    float ExampleTotalAlloyLossDifference => ExampleTotalAlloyLoss - Calculate(
+        WorkerReplacementCost(6),
+        SimultaneousProductionFloor(2, 6),
+        6,
+        new List<float> { 0, 0 });
+
+    float ExampleTotalAlloyLossAccurate => Calculate(
+        WorkerReplacementCost(6),
+        SimultaneousProductionFloor(2, 6),
+        6,
+        new List<float> { 0, 10 });
+
+    float ExampleTotalAlloyLossAccurateDifference => ExampleTotalAlloyLoss - ExampleTotalAlloyLossAccurate;
+
+    float TotalAlloyHarassment;
+
+    readonly float CostOfWorker = 50;
+    readonly float AlloyMinedPerSecondByWorker = 1;
+    readonly float TimeToProduceWorker = 20;
+    float NumberOfWorkersLostToHarass = 1;
+    float NumberOfTownHallsExisting = 1;
+
+    float GetAverageTravelTime()
+    {
+        if (TravelTimes.Count == 0)
+        {
+            return 0;
+        }
+
+        float sum = 0;
+
+        foreach (var travelTime in TravelTimes)
+        {
+            sum += travelTime.Value;
+        }
+
+        return sum / NumberOfTownHallsExisting;
+    }
+
+
+    float SimultaneousProductionFloor()
+    {
+        if (NumberOfTownHallsExisting <= 0 || NumberOfWorkersLostToHarass <= 0)
+        {
+            return 0;
+        }
+
+        return NumberOfWorkersLostToHarass / Math.Min(NumberOfTownHallsExisting, NumberOfWorkersLostToHarass);
+    }
+
+    float SimultaneousProductionFloor(float existingTownHalls, float numberOfWorkersLost)
+    {
+        if (existingTownHalls <= 0 || numberOfWorkersLost <= 0)
+        {
+            return 0;
+        }
+
+        return numberOfWorkersLost / Math.Min(existingTownHalls, numberOfWorkersLost);
+    }
+
+    float WorkerReplacementCost()
+    {
+        return CostOfWorker * NumberOfWorkersLostToHarass;
+    }
+
+    float WorkerReplacementCost(int numberOfWorkersLostToHarass)
+    {
+        return CostOfWorker * numberOfWorkersLostToHarass;
+    }
+
+    float DelayedMiningCost()
+    {
+        return TotalAlloyHarassment - WorkerReplacementCost();
+    }
+
+    void Calculate()
+    {
+        TotalAlloyHarassment = Calculate(WorkerReplacementCost(),
+            SimultaneousProductionFloor(),
+            NumberOfWorkersLostToHarass,
+            TravelTimes.Select(x => x.Value).ToList(),
+            TimeToProduceWorker,
+            AlloyMinedPerSecondByWorker);
+    }
+
+    float Calculate(float workerReplacementCost,
+        float simultaneousProductionFloor,
+        float numberOfWorkersLostToHarass,
+        IList<float> travelTimes,
+        float timeToProduceWorker = 20,
+        float alloyMinedPerSecondByWorker = 1)
+    {
+        var totalAlloyHarassment = workerReplacementCost;
+
+        for (var workerProductionIndex = 0; workerProductionIndex < simultaneousProductionFloor; workerProductionIndex++)
+        {
+            totalAlloyHarassment += alloyMinedPerSecondByWorker * timeToProduceWorker * (workerProductionIndex + 1);
+        }
+
+        var remainder = (int)(numberOfWorkersLostToHarass % simultaneousProductionFloor);
+        for (var remainderIndex = 0; remainderIndex < remainder; remainderIndex++)
+        {
+            totalAlloyHarassment += alloyMinedPerSecondByWorker * timeToProduceWorker * (simultaneousProductionFloor + 1);
+        }
+
+        for (var travelTimeIndex = 0; travelTimeIndex < numberOfWorkersLostToHarass; travelTimeIndex++)
+        {
+            var townHallIndex = travelTimeIndex % travelTimes.Count;
+            totalAlloyHarassment += alloyMinedPerSecondByWorker * travelTimes[townHallIndex];
+        }
+
+        return totalAlloyHarassment;
+    }
+
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+        Calculate();
+    }
+
+
+    public List<TravelTime> TravelTimes { get; set; } = new() { new TravelTime(0, 0) };
+
+    private void OnTownHallsChanged(ChangeEventArgs obj)
+    {
+        NumberOfTownHallsExisting = int.Parse(obj.Value!.ToString()!);
+
+        while (TravelTimes.Count > NumberOfTownHallsExisting)
+            TravelTimes.Remove(TravelTimes.Last());
+
+        while (TravelTimes.Count < NumberOfTownHallsExisting)
+            TravelTimes.Add(new TravelTime(TravelTimes.Count, 10 * TravelTimes.Count));
+        Calculate();
+    }
+
+    private void OnTownHallTravelTimeChanged(ChangeEventArgs obj, TravelTime travelTime)
+    {
+        travelTime.Value = (int)obj.Value!;
+
+        Calculate();
+        StateHasChanged();
+    }
+
+}
@@ -0,0 +1,5 @@
+<h3>UnitTable</h3>
+
+@code {
+    
+}
@@ -0,0 +1,23 @@
+<h3>WeaponTable</h3>
+
+
+<MudDataGrid Items="@_entityWeapons.Take(4)">
+    <Columns>
+        <PropertyColumn Property="x => x.Range" Title="Nr"/>
+    </Columns>
+</MudDataGrid>
+
+@code {
+    List<EntityWeaponModel> _entityWeapons;
+
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+
+        _entityWeapons = DATA.Get()
+            .SelectMany(e => e.Value.EntityParts)
+            .OfType<EntityWeaponModel>()
+            .ToList();
+    }
+
+}
@@ -20,7 +20,9 @@
    </PaperComponent>

    <div style="margin-left: 8px">
-        <ButtonGroupComponent OnClick="choice => { EntityDisplayService.SetDisplayType(choice); }" Choice="@EntityDisplayService.GetDisplayType()" Choices="@EntityDisplayService.DefaultChoices()"></ButtonGroupComponent>
+        <ButtonGroupComponent OnClick="choice => { EntityDisplayService.SetDisplayType(choice); }"
+                              Choice="@EntityDisplayService.GetDisplayType()"
+                              Choices="@EntityDisplayService.DefaultChoices()"></ButtonGroupComponent>
    </div>

    <PaperComponent>
@@ -50,7 +52,8 @@
                What is this tool?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                This is a reference database. Mostly so unit stats can be reviewed outside of the game, IMMORTAL: Gates of Pyre.
+                This is a reference database. Mostly so unit stats can be reviewed outside of the game, IMMORTAL: Gates
+                of Pyre.
            </InfoAnswerComponent>
        </InfoBodyComponent>

@@ -59,7 +62,8 @@
                Is this database complete?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                No. A lot of content is missing, that needs to be manually transfered from screenshots of IMMORTAL: Gates of Pyre. This will happen slowly over-time.
+                No. A lot of content is missing, that needs to be manually transfered from screenshots of IMMORTAL:
+                Gates of Pyre. This will happen slowly over-time.
            </InfoAnswerComponent>
        </InfoBodyComponent>

@@ -68,7 +72,9 @@
                Is this database updated to the latest version?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                Maybe. Check this <b>@VariableService.Variables["GamePatch"]</b> version number, and compare it to the number on discord, in the <b>#game-updates</b> channel. That should give a general sense of how out of date the data is.
+                Maybe. Check this <b>@VariableService.Variables["GamePatch"]</b> version number, and compare it to the
+                number on discord, in the <b>#game-updates</b> channel. That should give a general sense of how out of
+                date the data is.
            </InfoAnswerComponent>
        </InfoBodyComponent>

@@ -103,20 +109,19 @@
        border-bottom: 4px solid var(--accent);
        padding: 4px;
    }
-    
+
    .databaseInfoContainer {
        display: flex;
        gap: 24px;
-        
+
    }
-    
+
 </style>


@code {

-    [Inject]
-    public IEntityFilterService EntityFilterService { get; set; } = default!;
+    [Inject] public IEntityFilterService EntityFilterService { get; set; } = default!;

    readonly List<EntityModel> defaults = (from entity in EntityModel.GetList()
        where entity.IsSpeculative == false
@@ -20,7 +20,9 @@
    </PaperComponent>

    <div style="margin-left: 8px">
-        <ButtonGroupComponent OnClick="choice => { EntityDisplayService.SetDisplayType(choice); }" Choice="@EntityDisplayService.GetDisplayType()" Choices="@EntityDisplayService.DefaultChoices()"></ButtonGroupComponent>
+        <ButtonGroupComponent OnClick="choice => { EntityDisplayService.SetDisplayType(choice); }"
+                              Choice="@EntityDisplayService.GetDisplayType()"
+                              Choices="@EntityDisplayService.DefaultChoices()"></ButtonGroupComponent>
    </div>


@@ -61,8 +63,7 @@

@code {

-    [Parameter]
-    public string? Text { get; set; }
+    [Parameter] public string? Text { get; set; }

    private EntityModel? _entity;

@@ -29,17 +29,17 @@
        padding: 30px;
        display: flex;
        flex-wrap: wrap;
-        
+
        flex-direction: column;
    }
-    
+
    .entityPartsContainer {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        width: 100%;
    }
-    
+
    @@media only screen and (max-width: 1025px) {
        .entitiesContainer {
            padding: 0px;
@@ -49,10 +49,8 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; }
+    [CascadingParameter] public EntityModel? Entity { get; set; }

-    [CascadingParameter]
-    public string? StyleType { get; set; }
+    [CascadingParameter] public string? StyleType { get; set; }

 }
@@ -33,18 +33,21 @@
                                <b>- Energy: </b> @production.Energy
                            </div>
                        }
+
                        @if (!production.DefensiveLayer.Equals(0))
                        {
                            <div>
                                <b>- Shields:</b> @production.DefensiveLayer
                            </div>
                        }
+
                        if (production.BuildTime != 0)
                        {
                            <div>
                                <b>- BuildTime: </b> @production.BuildTime
                            </div>
                        }
+
                        if (production.Cooldown != 0)
                        {
                            <div>
@@ -68,7 +71,8 @@

                <div>
                    <div>
-                        <b>Name:</b> <EntityLabelComponent EntityId="@spell.DataType"/>
+                        <b>Name:</b>
+                        <EntityLabelComponent EntityId="@spell.DataType"/>
                    </div>
                    <div>
                        <b>Description:</b> @((MarkupString)info.Description)
@@ -90,18 +94,21 @@
                                    <b> Energy: </b> @production.Energy
                                </div>
                            }
+
                            @if (!production.DefensiveLayer.Equals(0))
                            {
                                <div>
                                    <b>Shields:</b> @production.DefensiveLayer
                                </div>
                            }
+
                            if (production.BuildTime != 0)
                            {
                                <div>
                                    <b> BuildTime: </b> @production.BuildTime
                                </div>
                            }
+
                            if (production.Cooldown != 0)
                            {
                                <div>
@@ -119,11 +126,9 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }

-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";


 }
@@ -26,38 +26,36 @@ else
    </div>

    <style>
-    .entityHeader {
-        display: flex;
-        flex-direction: row;
-        gap: 4px;
-        justify-content: space-between;
-        margin-bottom: 22px;
-        width: 100%;
-        margin-left: -6px;
-    }
-
-    .entityHeaderText {
-        font-size: 2rem;
-        font-weight: 900;
-    }
-
-    @@media only screen and (max-width: 1025px) {
        .entityHeader {
-            flex-direction: column;
-            justify-content: normal;
-            margin-left: 4px;
+            display: flex;
+            flex-direction: row;
+            gap: 4px;
+            justify-content: space-between;
+            margin-bottom: 22px;
+            width: 100%;
+            margin-left: -6px;
        }
-    }
-</style>
+
+        .entityHeaderText {
+            font-size: 2rem;
+            font-weight: 900;
+        }
+
+        @@media only screen and (max-width: 1025px) {
+            .entityHeader {
+                flex-direction: column;
+                justify-content: normal;
+                margin-left: 4px;
+            }
+        }
+    </style>
 }

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -110,17 +110,15 @@ else
                gap: 4px;
            }
        }
-</style>
+    </style>
 }



@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }

-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -23,10 +23,8 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }

-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -77,7 +77,8 @@

                <div>
                    <div>
-                        <b>Name:</b> <EntityLabelComponent EntityId="@passive.DataType"/>
+                        <b>Name:</b>
+                        <EntityLabelComponent EntityId="@passive.DataType"/>
                    </div>
                    <div>
                        <b>Description:</b> @((MarkupString)info.Description)
@@ -130,11 +131,9 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -72,6 +72,7 @@
                }
            </div>
        }
+
        @if (Supply != null)
        {
            <div>
@@ -103,7 +104,8 @@
                            <div>

                                <span>
-                                    <b>@requirement.Requirement.Replace("_", " "):</b> <EntityLabelComponent EntityId="@requirement.Id"/>
+                                    <b>@requirement.Requirement.Replace("_", " "):</b> <EntityLabelComponent
+                                        EntityId="@requirement.Id"/>
                                </span>
                            </div>
                        }
@@ -186,29 +188,27 @@


        <style>
-    .ProductionContainer {
-        display: flex;
-        gap: 32px;
-    }
+            .ProductionContainer {
+                display: flex;
+                gap: 32px;
+            }

-    @@media only screen and (max-width: 1025px) {
-        .ProductionContainer {
-            flex-direction: column;
-            gap: 4px;
-        }
-    }
-</style>
+            @@media only screen and (max-width: 1025px) {
+                .ProductionContainer {
+                    flex-direction: column;
+                    gap: 4px;
+                }
+            }
+        </style>
    }
 }

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; }
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";


    private EntityProductionModel Production => Entity!.Production();
@@ -24,11 +24,13 @@
                            <b>- Pyre: </b>
                            @production.Pyre
                        }
+
                        if (production.BuildTime != 0)
                        {
                            <b>- BuildTime: </b>
                            @production.BuildTime
                        }
+
                        if (production.Cooldown != 0)
                        {
                            <b>- Cooldown: </b>
@@ -51,7 +53,8 @@

                <div>
                    <div>
-                        <b>Name:</b> <EntityLabelComponent EntityId="@spell.DataType"/>
+                        <b>Name:</b>
+                        <EntityLabelComponent EntityId="@spell.DataType"/>
                    </div>
                    <div>
                        <b>Description:</b> @((MarkupString)info.Description)
@@ -64,11 +67,13 @@
                                <b> Pyre: </b>
                                @production.Pyre
                            }
+
                            if (production.BuildTime != 0)
                            {
                                <b> BuildTime: </b>
                                @production.BuildTime
                            }
+
                            if (production.Cooldown != 0)
                            {
                                <b> Cooldown: </b>
@@ -85,11 +90,9 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -151,30 +151,28 @@
            </div>
        </EntityDisplayComponent>
        <style>
-    .statContainer {
-        display: flex;
-        gap: 32px;
-    }
+            .statContainer {
+                display: flex;
+                gap: 32px;
+            }

-    @@media only screen and (max-width: 1025px) {
-        .statContainer {
-            flex-direction: column;
-            gap: 4px;
-        }
-    }
-</style>
+            @@media only screen and (max-width: 1025px) {
+                .statContainer {
+                    flex-direction: column;
+                    gap: 4px;
+                }
+            }
+        </style>
    }
 }


@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";


    private EntityVitalityModel Vitality => Entity!.Vitality();
@@ -24,7 +24,8 @@
                    var entity = EntityModel.Get(upgradeId.Id);
                    <div>
                        <div>
-                            <b>Name:</b> <EntityLabelComponent EntityId="@entity.DataType"/>
+                            <b>Name:</b>
+                            <EntityLabelComponent EntityId="@entity.DataType"/>
                        </div>
                        <div>
                            <b>Description:</b> @entity.Info().Description
@@ -36,29 +37,27 @@


        <style>
-    .upgradesContainer {
-        display: flex;
-        gap: 32px;
-    }
+            .upgradesContainer {
+                display: flex;
+                gap: 32px;
+            }

-    @@media only screen and (max-width: 1025px) {
-        .upgradesContainer {
-            flex-direction: column;
-            gap: 4px;
-        }
-    }
-</style>
+            @@media only screen and (max-width: 1025px) {
+                .upgradesContainer {
+                    flex-direction: column;
+                    gap: 4px;
+                }
+            }
+        </style>
    }
 }


@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -22,12 +22,14 @@
        <EntityDisplayComponent Title="Vanguard">
            <div>
                <div>
-                    <b>Immortal:</b> <EntityLabelComponent EntityId="@immortal.DataType"/>
+                    <b>Immortal:</b>
+                    <EntityLabelComponent EntityId="@immortal.DataType"/>
                </div>
                @if (!Vanguard.ReplaceId.Equals(""))
                {
                    <div>
-                        <b>Replaces:</b> <EntityLabelComponent EntityId="@Vanguard.ReplaceId"></EntityLabelComponent>
+                        <b>Replaces:</b>
+                        <EntityLabelComponent EntityId="@Vanguard.ReplaceId"></EntityLabelComponent>
                    </div>
                }
            </div>
@@ -37,14 +39,11 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }

    private EntityVanguardAddedModel? Vanguard => Entity?.VanguardAdded();

-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
-
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";


 }
@@ -44,13 +44,16 @@

                <div>
                    <div>
-                        <b>Name:</b> <EntityLabelComponent EntityId="@entity.DataType"/>
+                        <b>Name:</b>
+                        <EntityLabelComponent EntityId="@entity.DataType"/>
                    </div>
                    <div>
-                        <b>Replaces:</b> <EntityLabelComponent EntityId="@vanguard.ReplaceId"/>
+                        <b>Replaces:</b>
+                        <EntityLabelComponent EntityId="@vanguard.ReplaceId"/>
                    </div>
                    <div>
-                        <b>Built From:</b> <EntityLabelComponent EntityId="@productionBuilding"/>
+                        <b>Built From:</b>
+                        <EntityLabelComponent EntityId="@productionBuilding"/>
                    </div>
                </div>
            }
@@ -60,11 +63,9 @@

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

 }
@@ -91,12 +91,14 @@
                            <i>- Light DPS: @(Math.Round(data.LightDamage * data.AttacksPerSecond))</i>&nbsp;
                        </span>
                    }
+
                    @if (data.MediumDamage != 0)
                    {
                        <span>
                            <i>- Medium DPS: @(Math.Round(data.MediumDamage * data.AttacksPerSecond))</i>&nbsp;
                        </span>
                    }
+
                    @if (data.HeavyDamage != 0)
                    {
                        <span>
@@ -188,12 +190,14 @@
                                    <i>Light DPS: @(Math.Round(data.LightDamage * data.AttacksPerSecond))</i>&nbsp;
                                </div>
                            }
+
                            @if (data.MediumDamage != 0)
                            {
                                <div>
                                    <i>Medium DPS: @(Math.Round(data.MediumDamage * data.AttacksPerSecond))</i>&nbsp;
                                </div>
                            }
+
                            @if (data.HeavyDamage != 0)
                            {
                                <div>
@@ -207,39 +211,37 @@
        </EntityDisplayComponent>

        <style>
-    .weaponsContainer {
-        display: flex;
-        gap: 32px;
-    }
+            .weaponsContainer {
+                display: flex;
+                gap: 32px;
+            }

-    @@media only screen and (max-width: 1025px) {
-        .weaponsContainer {
-            flex-direction: column;
-            gap: 4px;
-        }
-    }
+            @@media only screen and (max-width: 1025px) {
+                .weaponsContainer {
+                    flex-direction: column;
+                    gap: 4px;
+                }
+            }

-    .alternateDamage {
-        margin-left: 18px;
-    }
+            .alternateDamage {
+                margin-left: 18px;
+            }

-    .damageContainer {
-        margin-bottom: 6px;
-    }
-</style>
+            .damageContainer {
+                margin-bottom: 6px;
+            }
+        </style>
    }
 }

@code {

-    [CascadingParameter]
-    public EntityModel? Entity { get; set; } = default!;
+    [CascadingParameter] public EntityModel? Entity { get; set; }


-    [CascadingParameter]
-    public string StyleType { get; set; } = "Detailed";
+    [CascadingParameter] public string StyleType { get; set; } = "Detailed";

-    private bool _isDynamicFormatting = false;
+    private bool _isDynamicFormatting;

    protected override void OnInitialized()
    {
@@ -9,6 +9,7 @@
                    {
                        styleClass = "selected";
                    }
+
                    <button @onclick="@(e => OnChangeFaction(choice))"
                            class="choiceButton @styleClass">
                        @(choice == DataType.Any
@@ -30,7 +31,9 @@
                        {
                            styleClass = "selected";
                        }
-                        <button class="choiceButton @styleClass" @onclick="@(e => OnChangeImmortal(choice))">@name</button>
+
+                        <button class="choiceButton @styleClass"
+                                @onclick="@(e => OnChangeImmortal(choice))">@name</button>
                    }
                </div>
            }
@@ -44,10 +47,12 @@
                    styleClass = "selected";
                }

-                <button class="choiceButton @styleClass" @onclick="@(e => OnChangeEntity(choice))">@choice.Replace("_", " ")</button>
+                <button class="choiceButton @styleClass"
+                        @onclick="@(e => OnChangeEntity(choice))">@choice.Replace("_", " ")</button>
            }
        </div>
-        <FormTextComponent Id="filterName" Label="Filter Name" Placeholder="Throne..." OnChange="@(e => EntityFilterService.EnterSearchText(e.Value!.ToString()!))"/>
+        <FormTextComponent Id="filterName" Label="Filter Name" Placeholder="Throne..."
+                           OnChange="@(e => EntityFilterService.EnterSearchText(e.Value!.ToString()!))"/>
    </div>
 </div>

@@ -99,118 +104,117 @@

 <style>

-.desktopFilters {
-    display: flex;
-    gap: 12px;
-    flex-direction: column;
-    justify-content: flex-start;
-    justify-items: flex-start;
-    top: 50px;
-    padding: 12px;
-    width: 100%;
-    left: 0px;
-}
-
-.desktopFiltersContainer {
-    width: 75%;
-    min-width: 1000px;
-    margin: auto;
-    display: flex;
-    gap: 16px;
-    flex-direction: column;
-    justify-content: flex-start;
-    justify-items: flex-start;
-}
-
-.filtersContainer {
-    display: flex;
-    gap: 16px;
-}
-
-.filterContainer {
-    display: flex;
-    background-color: var(--background);
-    gap: 2px;
-    margin-right: auto;
-    border-radius: 8px;
-}
-
-.choiceButton {
-    background-color: var(--primary);
-    color: white;
-    padding: 12px;
-    border: 1px solid var(--primary);
-}
-
-.choiceButton:hover {
-    background-color: var(--primary-hover);
-    border-color: var(--primary-border-hover);
-}
-
-.selected {
-    background-color: var(--secondary);
-    color: white;
-    font-style: normal;
-    font-weight: bold;
-}
-
-.selected:hover {
-    background-color: var(--secondary-hover);
-    border-color: var(--secondary-border-hover);
-}
-
-
-.filterContainer .choiceButton:first-child {
-    border-top-left-radius: 8px;
-    border-bottom-left-radius: 8px;
-}
-
-
-.filterContainer .choiceButton:last-child {
-    border-top-right-radius: 8px;
-    border-bottom-right-radius: 8px;
-}
-
-@@media only screen and (max-width: 1025px) {
-    .desktopNavContainer {
-        display: none;
-    }
-}
-
-@@media only screen and (max-width: 480px) {
-    .filtersContainer {
+    .desktopFilters {
+        display: flex;
+        gap: 12px;
        flex-direction: column;
+        justify-content: flex-start;
+        justify-items: flex-start;
+        top: 50px;
+        padding: 12px;
+        width: 100%;
+        left: 0px;
+    }
+
+    .desktopFiltersContainer {
+        width: 75%;
+        min-width: 1000px;
+        margin: auto;
+        display: flex;
+        gap: 16px;
+        flex-direction: column;
+        justify-content: flex-start;
+        justify-items: flex-start;
+    }
+
+    .filtersContainer {
+        display: flex;
+        gap: 16px;
    }

    .filterContainer {
-        flex-direction: column;
+        display: flex;
+        background-color: var(--background);
+        gap: 2px;
+        margin-right: auto;
+        border-radius: 8px;
    }
-}

-.mobileFilters {
-    display: none;
-}
+    .choiceButton {
+        background-color: var(--primary);
+        color: white;
+        padding: 12px;
+        border: 1px solid var(--primary);
+    }
+
+    .choiceButton:hover {
+        background-color: var(--primary-hover);
+        border-color: var(--primary-border-hover);
+    }
+
+    .selected {
+        background-color: var(--secondary);
+        color: white;
+        font-style: normal;
+        font-weight: bold;
+    }
+
+    .selected:hover {
+        background-color: var(--secondary-hover);
+        border-color: var(--secondary-border-hover);
+    }
+
+
+    .filterContainer .choiceButton:first-child {
+        border-top-left-radius: 8px;
+        border-bottom-left-radius: 8px;
+    }
+
+
+    .filterContainer .choiceButton:last-child {
+        border-top-right-radius: 8px;
+        border-bottom-right-radius: 8px;
+    }
+
+    @@media only screen and (max-width: 1025px) {
+        .desktopNavContainer {
+            display: none;
+        }
+    }
+
+    @@media only screen and (max-width: 480px) {
+        .filtersContainer {
+            flex-direction: column;
+        }
+
+        .filterContainer {
+            flex-direction: column;
+        }
+    }

-@@media only screen and (max-width: 1024px) {
    .mobileFilters {
-        display: block;
-    }
-
-    .desktopFilters {
        display: none;
    }

-    .desktopSpacer {
-        display: none;
+    @@media only screen and (max-width: 1024px) {
+        .mobileFilters {
+            display: block;
+        }
+
+        .desktopFilters {
+            display: none;
+        }
+
+        .desktopSpacer {
+            display: none;
+        }
    }
-}
 </style>


@code {

-    [Inject]
-    public IEntityFilterService EntityFilterService { get; set; } = default!;
+    [Inject] public IEntityFilterService EntityFilterService { get; set; } = default!;

    protected override void OnInitialized()
    {
@@ -24,39 +24,39 @@ else
 }

 <style>
- .docTitle {
-    font-weight: bold;
- }
- 
- .docHeader {
-    display: flex;
-    justify-content: space-between;
- }
- 
- .docDates {
-    display: flex;
-    flex-direction: column;
- }
- 
- .docFooter {
-    display: flex;
-    justify-content: flex-end;
- }
- 
- th {
-    padding:  8px;
-    border: 1px solid gray;
- }
-  td {
-    padding:  8px;
-    border: 1px solid gray;
-  }  
+    .docTitle {
+        font-weight: bold;
+    }
+
+    .docHeader {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    .docDates {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .docFooter {
+        display: flex;
+        justify-content: flex-end;
+    }
+
+    th {
+        padding: 8px;
+        border: 1px solid gray;
+    }
+
+    td {
+        padding: 8px;
+        border: 1px solid gray;
+    }
 </style>

@code {

-    [Parameter]
-    public DocContentModel DocContentModel { get; set; } = default!;
+    [Parameter] public DocContentModel DocContentModel { get; set; } = default!;

    DocFrontMatterModel docFrontMatter = null!;
    private string? content;
@@ -13,7 +13,8 @@
        index++;

        <div style="width: 0; height: @chart.ValueDisplayMax.ToString()px">
-            <div style="left: calc(-@width.ToString()px / 2); position: relative; border: 2px solid gray; border-radius:2px; width: @chart.IntervalDisplayMax.ToString()px; height: @chart.ValueDisplayMax.ToString()px">
+            <div
+                style="left: calc(-@width.ToString()px / 2); position: relative; border: 2px solid gray; border-radius:2px; width: @chart.IntervalDisplayMax.ToString()px; height: @chart.ValueDisplayMax.ToString()px">
                @foreach (var point in chart.Points)
                {
                    var xCoord = point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax);
@@ -24,11 +25,12 @@
                    if (show == player)
                    {
                        <div style="position: absolute;
-							bottom:@point.GetValue(highestAlloyPoint, chart.ValueDisplayMax)px;
-                            left:@point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax)px;
-                            width: 0px;
-							height: 0px;">
-                            <div style="width:1px; height: 1px; border-top-right-radius:10px; border-top-left-radius:10px; border: 2px solid @chart.ChartColor; background-color:@chart.ChartColor">
+                            bottom:@point.GetValue(highestAlloyPoint, chart.ValueDisplayMax)px;
+                        left:@point.GetInterval(chart.HighestIntervalPoint, chart.IntervalDisplayMax)px;
+                        width: 0px;
+                        height: 0px;">
+                            <div
+                                style="width:1px; height: 1px; border-top-right-radius:10px; border-top-left-radius:10px; border: 2px solid @chart.ChartColor; background-color:@chart.ChartColor">
                            </div>
                        </div>
                    }
@@ -46,7 +48,7 @@
        justify-content: center;
        margin-bottom: 20px;
    }
-    
+
 </style>

@code {
@@ -57,7 +59,7 @@
    private List<ChartModel> charts = new();


-    float highestAlloyPoint = 0;
+    float highestAlloyPoint;


    protected override void OnInitialized()
@@ -44,31 +44,31 @@


 <style>
-.differences {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-    padding: 12px;
-}
+    .differences {
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+        padding: 12px;
+    }

    .differenceTitle {
        font-size: 1.2em;
        font-weight: 800;
    }
-    
+
    .differenceContainer {
-        
+
    }
 </style>

@code {
-    private int StartingAdvantageAtTime = 0;
+    private int StartingAdvantageAtTime;

-    private int PeakAdvantageByAlloy = 0;
-    private int PeakAdvantageAtTime = 0;
+    private int PeakAdvantageByAlloy;
+    private int PeakAdvantageAtTime;

-    private int WorseningTime = 0;
-    private int MiracleTime = 0;
+    private int WorseningTime;
+    private int MiracleTime;

    protected override void OnInitialized()
    {
@@ -34,13 +34,12 @@


 <style>
-    
+
 </style>

@code {

-    [Parameter]
-    public int ForPlayer { get; set; }
+    [Parameter] public int ForPlayer { get; set; }

    private int TownHallCount => economyComparisonService.GetTownHallCount(ForPlayer);
    private string ChartColor => economyComparisonService.GetColor(ForPlayer);
@@ -1,6 +1,6 @@
@layout PageLayout

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService
@using Model
@inherits BasePage

@@ -36,7 +36,11 @@
                    <FormNumberComponent Min="1"
                                         Id="numberOfWorkersLostToHarass"
                                         Value="@((int)NumberOfWorkersLostToHarass)"
-                                         OnChange="@(e => { NumberOfWorkersLostToHarass = int.Parse(e.Value!.ToString()!); Calculate();})">
+                                         OnChange="@(e =>
+                                                   {
+                                                       NumberOfWorkersLostToHarass = int.Parse(e.Value!.ToString()!);
+                                                       Calculate();
+                                                   })">
                        <FormLabelComponent>Number of workers lost to harass</FormLabelComponent>
                    </FormNumberComponent>

@@ -58,12 +62,14 @@
                            {
                                continue;
                            }
+
                            var id = $"numberOfTownHallsExisting_{index}";
                            <FormNumberComponent Min="0"
                                                 Id="@id"
                                                 Value="@((int)travelTime.Value)"
                                                 OnChange="e => { OnTownHallTravelTimeChanged(e, travelTime); }">
-                                <FormLabelComponent>Worker travel time from other base @(travelTime.Index + 1)</FormLabelComponent>
+                                <FormLabelComponent>Worker travel time from other
+                                    base @(travelTime.Index + 1)</FormLabelComponent>
                            </FormNumberComponent>
                        }
                    </div>
@@ -110,7 +116,8 @@
                <b>
                    Number of workers lost to
                    harass
-                </b> to 6. This would determine a loss of <span id="exampleTotalAlloyLoss">@ExampleTotalAlloyLoss</span> alloy. Quite
+                </b> to 6. This would determine a loss of <span id="exampleTotalAlloyLoss">@ExampleTotalAlloyLoss</span>
+                alloy. Quite
                the large number.
            </InfoAnswerComponent>
        </InfoBodyComponent>
@@ -127,8 +134,10 @@
                <br/><br/>
                If you were to set the <b>Number of townhalls you have</b> to 2, the calculator will consider worker
                transfer micro. Allowing you to cut the total cost by roughly
-                <span id="exampleTotalAlloyLossDifference">@ExampleTotalAlloyLossDifference</span> alloy. However, that number isn't
-                entirely accurate, you are also going to have to bump up the <b>Worker travel time to alloy</b> to account for the time it takes the transferred workers to arrive at the decimated alloy line.
+                <span id="exampleTotalAlloyLossDifference">@ExampleTotalAlloyLossDifference</span> alloy. However, that
+                number isn't
+                entirely accurate, you are also going to have to bump up the <b>Worker travel time to alloy</b> to
+                account for the time it takes the transferred workers to arrive at the decimated alloy line.
                <br/><br/>
                Let's say it takes 10 seconds for workers to transfer from your second base. Let's enter that for the
                second base travel time for the more accurate loss of
@@ -136,7 +145,8 @@
                    id="exampleTotalAlloyLossAccurate">
                    @ExampleTotalAlloyLossAccurate
                </span> alloy
-                (saving you <span id="exampleTotalAlloyLossAccurateDifference">@ExampleTotalAlloyLossAccurateDifference</span> alloy.)
+                (saving you <span
+                    id="exampleTotalAlloyLossAccurateDifference">@ExampleTotalAlloyLossAccurateDifference</span> alloy.)
                <i>
                    Which is
                    much better than not transferring workers!
@@ -153,15 +163,17 @@

                <br/>
                <div class="mathContainer">
-                    <div> =c*m+r*g*(t+l) + </div>
+                    <div> =c*m+r*g*(t+l) +</div>

                    <MathLoopSumComponent>
                        <LoopStart><i>x</i> =1</LoopStart>
                        <LoopEnd>
                            ⌊
                            <MathDivisionComponent>
-                                <Dividee>m</Dividee><Divider>a</Divider>
-                            </MathDivisionComponent>⌋
+                                <Dividee>m</Dividee>
+                                <Divider>a</Divider>
+                            </MathDivisionComponent>
+                            ⌋
                        </LoopEnd>
                        <IndexSymbol>
                            <i>x</i>
@@ -172,7 +184,7 @@
                </div>
                <br/>
                <div style="font-family:monospace;">
-                    <div>c is CostOfWorker </div>
+                    <div>c is CostOfWorker</div>
                    <div>m is NumberOfWorkersLostToHarass, <i>m for [M]otes</i></div>
                    <div>a is NumberOfTownHallsExisting, <i>a for [A]cropolis</i></div>
                    <div>r is m mod a is LeftOverWorkersToProduceCount()</div>
@@ -192,8 +204,9 @@
            </InfoQuestionComponent>
            <InfoAnswerComponent>
                <br/>
-                <LinkButtonComponent Href="https://git.jonathanmccaffrey.ca/JonathanMcCaffrey/IGP-Fan-Reference/src/branch/main/IGP/Pages/HarassCalculatorPage.razor#L226">
-                    View Here 
+                <LinkButtonComponent
+                    Href="https://git.jonathanmccaffrey.ca/JonathanMcCaffrey/IGP-Fan-Reference/src/branch/main/IGP/Pages/HarassCalculatorPage.razor#L226">
+                    View Here
                </LinkButtonComponent>
            </InfoAnswerComponent>
        </InfoBodyComponent>
@@ -222,6 +235,7 @@
 </style>

@code {
+
    // Example calcs
    float ExampleTotalAlloyLoss => Calculate(
        WorkerReplacementCost(6),
@@ -25,12 +25,12 @@
            <ContentHighlightComponent Title="Build Calculator"
                                       Description="Make a build!"
                                       Href="/build-calculator"
-                                       ImageHref="image/hero/Build.png" />
+                                       ImageHref="image/hero/Build.png"/>

            <ContentHighlightComponent Title="Database"
                                       Description="Review the units!"
                                       Href="/database"
-                                       ImageHref="image/hero/Database.png" />
+                                       ImageHref="image/hero/Database.png"/>


        </div>
@@ -26,14 +26,14 @@
        margin-left: 12px;
        margin-right: 12px;
    }
-        
-        .contentHighlight:hover {
-            background-color: var(--paper-hover);
-            border-color: var(--paper-border-hover);
-            text-decoration: none;
-            box-shadow: 0 4px 6px rgba(0,0,0,0.6);
-            transform: translateY(-2px) scale(1.01);
-        }
+
+    .contentHighlight:hover {
+        background-color: var(--paper-hover);
+        border-color: var(--paper-border-hover);
+        text-decoration: none;
+        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6);
+        transform: translateY(-2px) scale(1.01);
+    }


    .contentHighlightTitle {
@@ -43,8 +43,8 @@
    }

    .contentHighlightImage {
-        border: 1px solid rgba(0,0,0,0.5);
-        box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
+        border: 1px solid rgba(0, 0, 0, 0.5);
+        box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
        width: calc(100% - 32px);
        margin-left: auto;
        margin-right: auto;
@@ -62,17 +62,13 @@

@code {

-    [Parameter]
-    public string Href { get; set; } = default!;
+    [Parameter] public string Href { get; set; } = default!;

-    [Parameter]
-    public string Title { get; set; } = default!;
+    [Parameter] public string Title { get; set; } = default!;

-    [Parameter]
-    public string Description { get; set; } = default!;
+    [Parameter] public string Description { get; set; } = default!;

-    [Parameter]
-    public string ImageHref { get; set; } = default!;
+    [Parameter] public string ImageHref { get; set; } = default!;


 }
@@ -19,10 +19,16 @@
                What is this tool?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                A tool to test your memory of unit stats. Look at the first unit given, and fill in the remaining stats based on how they should compare.
+                A tool to test your memory of unit stats. Look at the first unit given, and fill in the remaining stats
+                based on how they should compare.

                <br/><br/>
-                For example, if the first unit you see is the Masked Hunter of range 400, do you remember the range of the Scepter? Are they the same? Does the Scepter have double the range of the Masked Hunter? Less range than it? Well, enter your guess and submit! <SpoilerTextComponent>The range is 200 longer, so if you remember that, you know you are going to need more than Masked Hunters to deal with hard to reach enemy Scepters.</SpoilerTextComponent>
+                For example, if the first unit you see is the Masked Hunter of range 400, do you remember the range of
+                the Scepter? Are they the same? Does the Scepter have double the range of the Masked Hunter? Less range
+                than it? Well, enter your guess and submit!
+                <SpoilerTextComponent>The range is 200 longer, so if you remember that, you know you are going to need
+                    more than Masked Hunters to deal with hard to reach enemy Scepters.
+                </SpoilerTextComponent>
            </InfoAnswerComponent>
        </InfoBodyComponent>

@@ -31,7 +37,8 @@
                Why is this tool here?
            </InfoQuestionComponent>
            <InfoAnswerComponent>
-                It was just a tool to quickly develop for fun when I didn't want to cover something larger on the 02/27/2022 live coding stream.
+                It was just a tool to quickly develop for fun when I didn't want to cover something larger on the
+                02/27/2022 live coding stream.
                <br/><br/>
                It may get expanded upon later.
            </InfoAnswerComponent>
@@ -28,20 +28,20 @@
    .unitMemoryContainer {
    }

-        .unitMemoryContainer.correct {
-            border-color: green;
+    .unitMemoryContainer.correct {
+        border-color: green;

-        }
+    }

-        .unitMemoryContainer.wrong {
-            border-color: red;
-        }
+    .unitMemoryContainer.wrong {
+        border-color: red;
+    }

    .wrongAnswer {
        padding: 12px;
        color: #ff2525;
        font-weight: 700;
-        background-color: rgba(0,0,0,0.4);
+        background-color: rgba(0, 0, 0, 0.4);
        padding: 8px;
        border-radius: 2px;
    }
@@ -49,14 +49,13 @@

@code {

-    [Parameter]
-    public MemoryEntityModel EntityMemory { get; set; } = default!;
+    [Parameter] public MemoryEntityModel EntityMemory { get; set; } = default!;

    private List<MemoryQuestionModel> questions { get; set; } = default!;

-    private bool hasBeenSubmitted = false;
-    private bool isCorrect = false;
-    private bool isWrong = false;
+    private bool hasBeenSubmitted;
+    private bool isCorrect;
+    private bool isWrong;

    public int Guess { get; set; }

@@ -5,7 +5,7 @@
@inject INoteService NoteService
@implements IDisposable

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService

@page "/notes"

@@ -47,36 +47,36 @@ else
        padding-top: 8px;
        padding-bottom: 64px;
    }
-    
+
    .noteSectionTitle {
        font-size: 3rem;
        font-weight: bold;
        text-align: center;
        margin-bottom: 32px;
    }
-    
+
    .noteContentContainer {
        display: grid;
        gap: 12px;
        grid-template-columns: 1fr 1fr;
    }
-    
+
    @@media only screen and (max-width: 1025px) {
-          .noteContentContainer {
-           grid-template-columns: 1fr;
-       }
+        .noteContentContainer {
+            grid-template-columns: 1fr;
+        }
    }
-    
+
    .noteContentName {
        font-weight: bold;
        font-size: 1.6rem;
    }
-    
+
    .noteContentDescription {
        font-weight: normal;
    }
-    
-    
+
+
    .noteContentLink {
        background-color: var(--paper);
        border: 1px solid var(--paper-border);
@@ -93,13 +93,13 @@ else
        margin-left: 12px;
        margin-right: 12px;
    }
-    
-    
+
+
    .noteContentLink:hover {
        background-color: var(--paper-hover);
        border-color: var(--paper-border-hover);
        text-decoration: none;
-        box-shadow: 0 4px 6px rgba(0,0,0,0.6);
+        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6);
        transform: translateY(-2px) scale(1.01);
    }

@@ -107,20 +107,15 @@ else

@code {

-    [Parameter]
-    public string? Href1 { get; set; }
+    [Parameter] public string? Href1 { get; set; }

-    [Parameter]
-    public string? Href2 { get; set; }
+    [Parameter] public string? Href2 { get; set; }

-    [Parameter]
-    public string? Href3 { get; set; }
+    [Parameter] public string? Href3 { get; set; }

-    [Parameter]
-    public string? Href4 { get; set; }
+    [Parameter] public string? Href4 { get; set; }

-    [Parameter]
-    public string? Href5 { get; set; }
+    [Parameter] public string? Href5 { get; set; }

    private string Href => Href5 ?? Href4 ?? Href3 ?? Href2 ?? Href1 ?? "";

@@ -5,7 +5,7 @@
@inject INoteService NoteService
@implements IDisposable

-@inject IDataCollectionService DataCollectionService 
+@inject IDataCollectionService DataCollectionService

@page "/notes/{href1}/{href2?}/{href3?}/{href4?}/{href5?}"

@@ -30,6 +30,7 @@ else
                    {
                        continue;
                    }
+
                    <NoteComponent NoteContentModel="note"/>
                }
            </PaperComponent>
@@ -39,11 +40,11 @@ else

 <style>
    pre code {
-        color: white;  
+        color: white;
    }
-    
+
    h1 {
-    	display: block;
+        display: block;
        font-size: 2em;
        margin-top: 0.67em;
        margin-bottom: 0.67em;
@@ -51,7 +52,7 @@ else
        margin-right: 0;
        font-weight: bold;
    }
-    
+
    h2 {
        display: block;
        font-size: 1.5em;
@@ -61,11 +62,11 @@ else
        margin-right: 0;
        font-weight: bold;
    }
-    
+
    li {
-    	display: list-item;
+        display: list-item;
    }
-    
+
    p {
        display: block;
        margin-top: 1em;
@@ -73,7 +74,7 @@ else
        margin-left: 0;
        margin-right: 0;
    }
-    
+
    ul {
        display: block;
        list-style-type: disc;
@@ -83,7 +84,7 @@ else
        margin-right: 0;
        padding-left: 40px;
    }
-    
+
    pre {
        background: black;
        padding: 2px;
@@ -92,20 +93,15 @@ else

@code {

-    [Parameter]
-    public string? Href1 { get; set; }
+    [Parameter] public string? Href1 { get; set; }

-    [Parameter]
-    public string? Href2 { get; set; }
+    [Parameter] public string? Href2 { get; set; }

-    [Parameter]
-    public string? Href3 { get; set; }
+    [Parameter] public string? Href3 { get; set; }

-    [Parameter]
-    public string? Href4 { get; set; }
+    [Parameter] public string? Href4 { get; set; }

-    [Parameter]
-    public string? Href5 { get; set; }
+    [Parameter] public string? Href5 { get; set; }

    private string Href => Href5 ?? Href4 ?? Href3 ?? Href2 ?? Href1 ?? "";

@@ -24,35 +24,34 @@ else
 }

 <style>
- .noteTitle {
-    font-weight: bold;
- }
- 
- .noteHeader {
-    display: flex;
-    justify-content: space-between;
- }
- 
- .noteDates {
-    display: flex;
-    flex-direction: column;
- }
- 
- 
- .noteFooter {
-    display: flex;
-    justify-content: flex-end;
- }
- 
+    .noteTitle {
+        font-weight: bold;
+    }
+
+    .noteHeader {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    .noteDates {
+        display: flex;
+        flex-direction: column;
+    }
+
+
+    .noteFooter {
+        display: flex;
+        justify-content: flex-end;
+    }
+
 </style>

@code {

-    [Parameter]
-    public NoteContentModel NoteContentModel { get; set; } = default!;
+    [Parameter] public NoteContentModel NoteContentModel { get; set; } = default!;

    NoteFrontMatterModel noteFrontMatter = null!;
-    private string? content = null;
+    private string? content;

    private string Filepath => $"content/notes/{NoteContentModel.Content}.md";
    private string GitUrl => $"{Project.GitResourcesUrl}/{Filepath}";
@@ -11,55 +11,51 @@
 }

 <style>
- 
-.noteInnerNavContainer {
-    display: flex;
-    flex-direction: column;
-}

-.noteInnerNavButton a {
-    color: white;
-}
+    .noteInnerNavContainer {
+        display: flex;
+        flex-direction: column;
+    }

-.noteInnerNavButton a:hover {
-    color: white;
-}
+    .noteInnerNavButton a {
+        color: white;
+    }

-.noteInnerNavButton {
-    padding: 8px;
-    margin-left: 8px;
-    color: white;
-}
+    .noteInnerNavButton a:hover {
+        color: white;
+    }

-.noteInnerNavButton:hover {
-    
-}
+    .noteInnerNavButton {
+        padding: 8px;
+        margin-left: 8px;
+        color: white;
+    }
+
+    .noteInnerNavButton:hover {
+
+    }


-.inner_1 {
-    margin-left: 8px;
-}
-
-.inner_2 {
-    margin-left: 16px;
-}
-
-.inner_3 {
-    margin-left: 24px;
-}
+    .inner_1 {
+        margin-left: 8px;
+    }

+    .inner_2 {
+        margin-left: 16px;
+    }

+    .inner_3 {
+        margin-left: 24px;
+    }


 </style>

@code {

-    [Parameter]
-    public NoteContentModel? Note { get; set; } = default!;
+    [Parameter] public NoteContentModel? Note { get; set; }

-    [Parameter]
-    public int Layers { get; set; } = 1;
+    [Parameter] public int Layers { get; set; } = 1;

    public int IncrementLayers()
    {
@@ -10,35 +10,33 @@
 </div>

 <style>
- .noteNavContainer {
-   display: flex;
-   flex-direction: column;
-   gap: 8px;
- }
- 
- .noteNavButton a {
-     color: white;
- }
- 
- .noteNavButton a:hover {
-      color: white;
-      background-color: var(--primary-hover);
-           
-  }
- 
- .noteNavButton {
-     padding: 8px;
-     color: white;
- }
+    .noteNavContainer {
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+    }
+
+    .noteNavButton a {
+        color: white;
+    }
+
+    .noteNavButton a:hover {
+        color: white;
+        background-color: var(--primary-hover);
+
+    }
+
+    .noteNavButton {
+        padding: 8px;
+        color: white;
+    }

 </style>

@code {

-    [Parameter]
-    public List<NoteContentModel> Notes { get; set; } = default!;
+    [Parameter] public List<NoteContentModel> Notes { get; set; } = default!;

-    [Parameter]
-    public List<NoteConnectionModel> Connections { get; set; } = default!;
+    [Parameter] public List<NoteConnectionModel> Connections { get; set; } = default!;

 }
@@ -3,7 +3,7 @@
@inject IPermissionService PermissionService
@layout PageLayout

-@inject IMyDialogService MyDialogService 
+@inject IMyDialogService MyDialogService

@inherits BasePage
@using Services.Website
@@ -32,17 +32,22 @@
    <PaperComponent>
        <InfoBodyComponent>
            <InfoQuestionComponent>What's this page?</InfoQuestionComponent>
-            <InfoAnswerComponent>This page has options to enable and disable certain permissions settings. Such as Storage and Data Collection.</InfoAnswerComponent>
+            <InfoAnswerComponent>This page has options to enable and disable certain permissions settings. Such as
+                Storage and Data Collection.
+            </InfoAnswerComponent>
        </InfoBodyComponent>

        <InfoBodyComponent>
            <InfoQuestionComponent>What does this website store?</InfoQuestionComponent>
-            <InfoAnswerComponent>This website usages storage to track user defined default on the Storage page.</InfoAnswerComponent>
+            <InfoAnswerComponent>This website usages storage to track user defined default on the Storage page.
+            </InfoAnswerComponent>
        </InfoBodyComponent>

        <InfoBodyComponent>
            <InfoQuestionComponent>Why would I enable storage?</InfoQuestionComponent>
-            <InfoAnswerComponent>Enable storage if you want to website to remeber past settings whenever you visit the website on the same web browser.</InfoAnswerComponent>
+            <InfoAnswerComponent>Enable storage if you want to website to remeber past settings whenever you visit the
+                website on the same web browser.
+            </InfoAnswerComponent>
        </InfoBodyComponent>

        <InfoBodyComponent>
@@ -50,13 +55,16 @@
            <InfoAnswerComponent>
                This website usages Google Analytics to collect data on usage of this website.
                <br/><br/>
-                Items include: if people use keyboard or mouse in build calculator, what pages people visit, and other usages.
+                Items include: if people use keyboard or mouse in build calculator, what pages people visit, and other
+                usages.
            </InfoAnswerComponent>
        </InfoBodyComponent>

        <InfoBodyComponent>
            <InfoQuestionComponent>Why would I enable data collection?</InfoQuestionComponent>
-            <InfoAnswerComponent>Enable data tracking if you want the website maintainer to know how your using the website.</InfoAnswerComponent>
+            <InfoAnswerComponent>Enable data tracking if you want the website maintainer to know how your using the
+                website.
+            </InfoAnswerComponent>
        </InfoBodyComponent>
    </PaperComponent>
 </LayoutMediumContentComponent>
@@ -5,7 +5,9 @@
 <div class="page">
    <AlertComponent>
        <Title>Placeholders and Speculative</Title>
-        <Message>The data I am using contains placeholders and speculation on future mechanics. Ignore said data when using this JSON.</Message>
+        <Message>The data I am using contains placeholders and speculation on future mechanics. Ignore said data when
+            using this JSON.
+        </Message>
    </AlertComponent>
    <CodeComponent>
        @DATA.AsJson()
@@ -114,7 +114,9 @@
                                     Value="@(_buildingInputDelay == null ? 0 : (int)_buildingInputDelay)"
                                     OnChange="OnBuildingInputDelayChanged">
                    <FormLabelComponent>Building Input Delay</FormLabelComponent>
-                    <FormInfoComponent>Add a input delay to constructing buildings for simulating worker movement and player micro.</FormInfoComponent>
+                    <FormInfoComponent>Add a input delay to constructing buildings for simulating worker movement and
+                        player micro.
+                    </FormInfoComponent>
                </FormNumberComponent>
                <FormNumberComponent Max="600"
                                     Min="1"
@@ -10,7 +10,9 @@
    <PaperComponent>
        <InfoBodyComponent>
            <InfoQuestionComponent>When and where are you streaming?</InfoQuestionComponent>
-            <InfoAnswerComponent>I stream Sunday updates on <a href="https://www.twitch.tv/jonathanmccaffrey" target="_blank">Twitch</a>.</InfoAnswerComponent>
+            <InfoAnswerComponent>I stream Sunday updates on <a href="https://www.twitch.tv/jonathanmccaffrey"
+                                                               target="_blank">Twitch</a>.
+            </InfoAnswerComponent>
        </InfoBodyComponent>
        <InfoBodyComponent>
            <InfoQuestionComponent>What exactly are you streaming?</InfoQuestionComponent>
@@ -25,14 +27,24 @@
        <InfoBodyComponent>
            <InfoQuestionComponent>Why should you watch these streams?</InfoQuestionComponent>
            <InfoAnswerComponent>
-                You shouldn't. By nature of being live coding streams, I think they will have little entertainment and educational value.
+                You shouldn't. By nature of being live coding streams, I think they will have little entertainment and
+                educational value.
                <br/><br/>
-                The most reason (that comes to mind) is to see a coding day of one software developer. Although please note that I stream content that I think is easy (to look smart), so it's not a "truly random" coding day. For example, you won't find any vods of the five-week sprint where I (figuratively) bash my head against the table trying to get SQL working in Blazor WASM before giving up and moving on.
+                The most reason (that comes to mind) is to see a coding day of one software developer. Although please
+                note that I stream content that I think is easy (to look smart), so it's not a "truly random" coding
+                day. For example, you won't find any vods of the five-week sprint where I (figuratively) bash my head
+                against the table trying to get SQL working in Blazor WASM before giving up and moving on.
            </InfoAnswerComponent>
        </InfoBodyComponent>
        <InfoBodyComponent>
            <InfoQuestionComponent>Anything else I should know?</InfoQuestionComponent>
-            <InfoAnswerComponent>I'll be streaming under the "<a href="https://www.twitch.tv/directory/game/Software%20and%20Game%20Development" target="_blank">Twitch, Software and Game Development</a>" category. If you are looking to see some actual IGP gameplay, there are better and more focused streamers to provide said content. Check out the "<a href="https://www.twitch.tv/directory/game/IMMORTAL%3A%20Gates%20of%20Pyre/videos/all" target="_blank">Twitch, IMMORTAL: Gates of Pyre</a>" category for some examples.</InfoAnswerComponent>
+            <InfoAnswerComponent>I'll be streaming under the "<a
+                    href="https://www.twitch.tv/directory/game/Software%20and%20Game%20Development" target="_blank">Twitch,
+                    Software and Game Development</a>" category. If you are looking to see some actual IGP gameplay,
+                there are better and more focused streamers to provide said content. Check out the "<a
+                    href="https://www.twitch.tv/directory/game/IMMORTAL%3A%20Gates%20of%20Pyre/videos/all"
+                    target="_blank">Twitch, IMMORTAL: Gates of Pyre</a>" category for some examples.
+            </InfoAnswerComponent>
        </InfoBodyComponent>
    </PaperComponent>
 </LayoutMediumContentComponent>