add server side project

Resume.Blazor/_Imports.razor

@@ -9,4 +9,4 @@
 @using Resume.Blazor
 @using Resume.Blazor.Shared
 @using MudBlazor
-@using Resume.Blazor.Models.ItemModels
+@using Resume.Blazor.Models.ItemModels

Resume.Blazor/tailwind.extension.json

@@ -0,0 +1 @@
+{"ConfigurationFile":"tailwind.config.js","InputCssFile":null,"OutputCssFile":null}

Resume.BlazorSS/App.razor

@@ -0,0 +1,12 @@
+<Router AppAssembly="@typeof(App).Assembly">
+    <Found Context="routeData">
+        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
+        <FocusOnNavigate RouteData="@routeData" Selector="h1" />
+    </Found>
+    <NotFound>
+        <PageTitle>Not found</PageTitle>
+        <LayoutView Layout="@typeof(MainLayout)">
+            <p role="alert">Sorry, there's nothing at this address.</p>
+        </LayoutView>
+    </NotFound>
+</Router>

Resume.BlazorSS/Components/ItemTemplate/ContactInfoItemTemplate.razor

@@ -0,0 +1,24 @@
+<div class="flex flex-row my-5">
+    <div class="bg-[#2E2E48] py-2 px-2.5 rounded-full">
+
+        <svg width="25" height="25" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="@SvgPath" fill="#E2E6EE" />
+        </svg>
+
+    </div>
+    <div class="mx-4">
+        <p class="text-gray-400">@Title</p>
+        <p class="text-white -mt-1">@Detail</p>
+    </div>
+</div>
+
+@code {
+    [Parameter]
+    public string Title { get; set; }
+
+    [Parameter]
+    public string Detail { get; set; }
+
+    [Parameter]
+    public string SvgPath { get; set; }
+}

Resume.BlazorSS/Components/ItemTemplate/EducationItemTemplate.razor

@@ -0,0 +1,20 @@
+<div class="my-8 mx-1">
+  <div
+    class="w-[19rem] bg-[url('https://rwrg.razi.ac.ir/documents/2384744/2384950/razi+1.png.jpg/ebadeea5-6be3-d2b5-31ee-070d1f5504b3?t=1652690416693')] rounded-md"
+  >
+    <div class="bg-black/60 backdrop-blur-sm rounded-md p-5 text-white">
+      <div>
+        <div class="justify-items-end w-full">
+          <img
+            src="https://isic.ir/wp-content/uploads/2019/08/dow12nload.jpg"
+            class="w-20 h-20 rounded-md"
+          />
+        </div>
+        <p>iGarson</p>
+        <p class="text-gray-400">2018 - 2022</p>
+      </div>
+    </div>
+  </div>
+</div>
+
+@code { } 

Resume.BlazorSS/Components/ItemTemplate/ExperienceItemTemplate.razor

@@ -0,0 +1,32 @@
+<div class="mt-2">
+  <MudStack>
+    <div class="text-gray-400">
+      <p>@Period</p>
+      <div class="flex flex-row">
+        <img src="@ImageSrc" class="w-[3.5rem] my-2 h-[3.5rem] rounded-md" />
+        <div class="mx-3 my-auto">
+          <p class="text-white">@CompanyName</p>
+          <div class="flex flex-wrap my-2 -mx-1">
+            @foreach (var feild in Feilds)
+            {
+              <div class="bg-[#2E2E48] mx-1 px-3 py-1 rounded-md text-[0.7rem]">
+                <p>@feild</p>
+              </div>
+            }
+          </div>
+        </div>
+      </div>
+    </div>
+    <p class="text-justify -mt-2">@Detail</p>
+  </MudStack>
+</div>
+
+@code {
+  [Parameter] public string CompanyName { get; set; }
+  [Parameter] public string Detail { get; set; }
+  [Parameter] public string CompanyImage { get; set; }
+  [Parameter] public bool HasLeftBorder { get; set; }
+  [Parameter] public string Period { get; set; }
+  [Parameter] public string ImageSrc { get; set; }
+  [Parameter] public string[] Feilds { get; set; }
+}

Resume.BlazorSS/Components/ItemTemplate/ProjectItemTemplate.razor

@@ -0,0 +1,39 @@
+<div class="bg-[#2E2E48] f-full m-1 rounded-lg">
+  <MudCardContent>
+
+    <MudStack Justify="Justify.SpaceBetween">
+      <MudImage Src="@ImageSrc" ObjectFit="ObjectFit.Cover" Class="rounded-lg" />
+      <MudText Typo="Typo.h6" class=" font-outfit mt-1">@Name</MudText>
+      <p class="text-gray-400">
+        @Detail
+      </p>
+      <div class="flex space-x-1 mt-3">
+
+        @foreach (var feild in Feilds)
+        {
+          <div class="bg-[#232339] px-3 py-1 rounded-md text-[0.7rem]">
+            <p>@feild</p>
+          </div>
+        }
+
+
+      </div>
+
+      @if (ShowButton)
+      {
+        <MudButton StartIcon="@Icons.Material.Filled.InsertLink" Variant="Variant.Outlined" Color="Color.Primary"
+          FullWidth="true">@ButtonText</MudButton>
+      }
+    </MudStack>
+  </MudCardContent>
+</div>
+
+@code {
+  [Parameter] public string Name { get; set; }
+  [Parameter] public string Detail { get; set; }
+  [Parameter] public string Link { get; set; }
+  [Parameter] public string[] Feilds { get; set; }
+  [Parameter] public string ImageSrc { get; set; }
+  [Parameter] public bool ShowButton { get; set; } = true;
+  [Parameter] public string ButtonText { get; set; }
+}

Resume.BlazorSS/Components/ItemTemplate/SkillItemTemplate.razor

@@ -0,0 +1,27 @@
+<div class="bg-[#2E2E48] rounded-lg">
+  <MudCardContent>
+    <MudHidden Breakpoint="Breakpoint.SmAndDown" Invert="true">
+      <MudStack AlignItems="AlignItems.Center">
+        <img src="@ImageSrc" class="w-16 h-16 rounded-md" />
+        <MudText Typo="Typo.subtitle2" Align="Align.Center" class="text-white">
+          <p>@Name</p>
+        </MudText>
+        <p class="text-gray-400 text-[0.8rem]">@ExperiencePeriod Years Experience</p>
+      </MudStack>
+    </MudHidden>
+    <MudHidden Breakpoint="Breakpoint.MdAndUp" Invert="true">
+      <MudStack Row="true">
+        <img src="@ImageSrc" class="w-12 h-12 rounded-md" />
+        <div class="my-auto ml-2">
+          <p class="text-white">@Name</p>
+          <p class="text-gray-400 text-[0.8rem]">@ExperiencePeriod Years Experience</p>
+        </div>
+      </MudStack>
+    </MudHidden>
+  </MudCardContent>
+</div>
+@code {
+  [Parameter] public string Name { get; set; }
+  [Parameter] public int ExperiencePeriod { get; set; }
+  [Parameter] public string ImageSrc { get; set; }
+}

Resume.BlazorSS/Components/ItemTemplate/ToolsItemTemplate.razor

@@ -0,0 +1,14 @@
+<div class="bg-[#2E2E48] justify-center py-7 px-5 rounded-md">
+    <img src="@ImageSrc" class="mb-4 mx-auto w-16 h-16 rounded-md" />
+    <div class="my-auto ml-2">
+        <p class="text-center text-white">@Name</p>
+        <p class="text-center text-gray-400 text-[0.8rem]">@ExperiencePeriod Years Experience</p>
+    </div>
+</div>
+@code
+{
+    [Parameter] public string Name { get; set; }
+    [Parameter] public int ExperiencePeriod { get; set; }
+    [Parameter] public string ImageSrc { get; set; }
+
+}

Resume.BlazorSS/Dockerfile

@@ -0,0 +1,24 @@
+#See https://aka.ms/customizecontainer to learn how to customize your debug container and how Visual Studio uses this Dockerfile to build your images for faster debugging.
+
+FROM mcr.microsoft.com/dotnet/aspnet:8.0 AS base
+WORKDIR /app
+EXPOSE 80
+EXPOSE 443
+
+FROM mcr.microsoft.com/dotnet/sdk:8.0 AS build
+ARG BUILD_CONFIGURATION=Release
+WORKDIR /src
+COPY ["Resume.BlazorSS/Resume.BlazorSS.csproj", "Resume.BlazorSS/"]
+RUN dotnet restore "./Resume.BlazorSS/Resume.BlazorSS.csproj"
+COPY . .
+WORKDIR "/src/Resume.BlazorSS"
+RUN dotnet build "./Resume.BlazorSS.csproj" -c $BUILD_CONFIGURATION -o /app/build
+
+FROM build AS publish
+ARG BUILD_CONFIGURATION=Release
+RUN dotnet publish "./Resume.BlazorSS.csproj" -c $BUILD_CONFIGURATION -o /app/publish /p:UseAppHost=false
+
+FROM base AS final
+WORKDIR /app
+COPY --from=publish /app/publish .
+ENTRYPOINT ["dotnet", "Resume.BlazorSS.dll"]

Resume.BlazorSS/Models/ItemModels/ProjectItemModel.cs

@@ -0,0 +1,11 @@
+namespace Resume.BlazorSS.Models.ItemModels;
+public class ProjectItemModel
+{
+    public bool ShowButton { get; set; } = true;
+    public string Name { get; set; }
+    public string ImageSrc { get; set; }
+    public string Link { get; set; }
+    public string ButtonText { get; set; }
+    public string Detail { get; set; }
+    public string[] Feilds { get; set; }
+}

Resume.BlazorSS/Models/ItemModels/SkillItemModel.cs

@@ -0,0 +1,7 @@
+namespace Resume.BlazorSS.Models.ItemModels;
+public class SkillItemModel
+{
+    public string Name { get; set; }
+    public int ExperiencePeriod { get; set; }
+    public string ImageSrc { get; set; }
+}

Resume.BlazorSS/Pages/Counter.razor

@@ -0,0 +1,18 @@
+@page "/counter"
+
+<PageTitle>Counter</PageTitle>
+
+<h1>Counter</h1>
+
+<p role="status">Current count: @currentCount</p>
+
+<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
+
+@code {
+    private int currentCount = 0;
+
+    private void IncrementCount()
+    {
+        currentCount++;
+    }
+}

Resume.BlazorSS/Pages/Error.cshtml

@@ -0,0 +1,42 @@
+@page
+@model Resume.BlazorSS.Pages.ErrorModel
+
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <title>Error</title>
+    <link href="~/css/bootstrap/bootstrap.min.css" rel="stylesheet" />
+    <link href="~/css/site.css" rel="stylesheet" asp-append-version="true" />
+</head>
+
+<body>
+    <div class="main">
+        <div class="content px-4">
+            <h1 class="text-danger">Error.</h1>
+            <h2 class="text-danger">An error occurred while processing your request.</h2>
+
+            @if (Model.ShowRequestId)
+            {
+                <p>
+                    <strong>Request ID:</strong> <code>@Model.RequestId</code>
+                </p>
+            }
+
+            <h3>Development Mode</h3>
+            <p>
+                Swapping to the <strong>Development</strong> environment displays detailed information about the error that occurred.
+            </p>
+            <p>
+                <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
+                It can result in displaying sensitive information from exceptions to end users.
+                For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
+                and restarting the app.
+            </p>
+        </div>
+    </div>
+</body>
+
+</html>

Resume.BlazorSS/Pages/Error.cshtml.cs

@@ -0,0 +1,27 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using System.Diagnostics;
+
+namespace Resume.BlazorSS.Pages
+{
+    [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
+    [IgnoreAntiforgeryToken]
+    public class ErrorModel : PageModel
+    {
+        public string? RequestId { get; set; }
+
+        public bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+        private readonly ILogger<ErrorModel> _logger;
+
+        public ErrorModel(ILogger<ErrorModel> logger)
+        {
+            _logger = logger;
+        }
+
+        public void OnGet()
+        {
+            RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier;
+        }
+    }
+}

Resume.BlazorSS/Pages/FetchData.razor

@@ -0,0 +1,47 @@
+@page "/fetchdata"
+@using Resume.BlazorSS.Data
+@inject WeatherForecastService ForecastService
+
+<PageTitle>Weather forecast</PageTitle>
+
+<h1>Weather forecast</h1>
+
+<p>This component demonstrates fetching data from a service.</p>
+
+@if (forecasts == null)
+{
+    <p><em>Loading...</em></p>
+}
+else
+{
+    <table class="table">
+        <thead>
+            <tr>
+                <th>Date</th>
+                <th>Temp. (C)</th>
+                <th>Temp. (F)</th>
+                <th>Summary</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var forecast in forecasts)
+            {
+                <tr>
+                    <td>@forecast.Date.ToShortDateString()</td>
+                    <td>@forecast.TemperatureC</td>
+                    <td>@forecast.TemperatureF</td>
+                    <td>@forecast.Summary</td>
+                </tr>
+            }
+        </tbody>
+    </table>
+}
+
+@code {
+    private WeatherForecast[]? forecasts;
+
+    protected override async Task OnInitializedAsync()
+    {
+        forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
+    }
+}

Resume.BlazorSS/Pages/Index.razor

@@ -0,0 +1,238 @@
+@page "/"
+@using Resume.BlazorSS.Components.ItemTemplate
+@using Resume.BlazorSS.Helpers
+@using Resume.BlazorSS.Models.ItemModels
+
+<MudContainer MaxWidth="MaxWidth.ExtraExtraLarge">
+
+    <MudGrid>
+
+        <MudItem xs="0" md="3" class="bg-transparent">
+            <div class="m-8">
+                <img src="https://s3.ir-thr-at1.arvanstorage.ir/igarson/Images/utils/photo_2023-06-18_11-20-13.jpg"
+                     class="rounded-md" />
+                <p class="text-white font-bold font-outfit-bold text-3xl mt-8" Typo="Typo.h1"> Amir Hossein Khademi </p>
+                <h2 class="bg-clip-text font-extrabold font-outfit-black text-2xl text-transparent bg-gradient-to-r mb-8 from-pink-500
+to-violet-500">
+                    Software Engineer
+                </h2>
+                <div class="h-[0.1rem] bg-white opacity-10"></div>
+                <p class="my-5 text-gray-400">Contact Info</p>
+
+                <ContactInfoItemTemplate Title="Email" Detail="avvampier@gmail.com" SvgPath="M8.33325 8.33329H1.66659C1.20635 8.33329 0.833252 7.9602 0.833252 7.49996V2.46371C0.852672 2.01769 1.22014
+1.6662 1.66659 1.66663H8.33325C8.79349 1.66663 9.16659 2.03972 9.16659 2.49996V7.49996C9.16659 7.9602 8.79349 8.33329
+8.33325 8.33329ZM1.66659 3.27829V7.49996H8.33325V3.27829L4.99992 5.49996L1.66659 3.27829ZM1.99992 2.49996L4.99992
+4.49996L7.99992 2.49996H1.99992Z" />
+
+                <ContactInfoItemTemplate Title="Phone" Detail="(+98) 921 480 2813" SvgPath="M7.9157 8.33329C4.36086 8.33833 1.66295 5.60808 1.66675 2.08434C1.66675 1.85422 1.8533 1.66663 2.08342
+1.66663H3.18315C3.38964 1.66663 3.56505 1.81835 3.59537 2.0226C3.66804 2.51212 3.81057 2.9887 4.01862 3.43775L4.06143
+3.53017C4.12097 3.65867 4.08061 3.81135 3.96536 3.89366C3.62479 4.13687 3.49463 4.62644 3.75995 5.00844C4.09291 5.48781
+4.5126 5.90742 4.99186 6.24022C5.37384 6.50546 5.86333 6.37532 6.10654 6.03481C6.1889 5.9195 6.34167 5.87913 6.47025
+5.93869L6.56224 5.9813C7.01133 6.18933 7.48793 6.33187 7.97751 6.40452C8.18177 6.43484 8.33341 6.61024 8.33341
+6.81674V7.91662C8.33341 8.14674 8.14641 8.33328 7.91629 8.33328L7.9157 8.33329Z" />
+
+
+                <ContactInfoItemTemplate Title="Address" Detail="Tehran" SvgPath="M4.99992 8.74996C4.47364 8.30106 3.98583 7.80893 3.54159 7.27871C2.87492 6.48246 2.08325 5.29663 2.08325
+4.16663C2.08266 2.98644 2.79336 1.92221 3.8837 1.47054C4.97404 1.01888 6.22911 1.26881 7.06325 2.10371C7.61178 2.6498
+7.91905 3.39262 7.9166 4.16663C7.9166 5.29663 7.12492 6.48246 6.45825 7.27871C6.01401 7.80893 5.5262 8.30106 4.99992
+8.74996ZM4.99992 2.91663C4.55334 2.91663 4.14068 3.15488 3.91739 3.54163C3.6941 3.92838 3.6941 4.40488 3.91739
+4.79163C4.14068 5.17838 4.55334 5.41663 4.99992 5.41663C5.69028 5.41663 6.24992 4.85698 6.24992 4.16663C6.24992 3.47627
+5.69028 2.91663 4.99992 2.91663Z" />
+
+                <div class="h-[0.1rem] bg-white opacity-10"></div>
+                <p class="my-5 text-gray-400">Socials</p>
+
+                <a target="_blank" href="https://instagram.com/mr.mohande3">
+                    <div class="flex flex-row my-5">
+                        <div>
+                            <svg width="40" height="40" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                <rect y="0.5" width="16" height="16" rx="8" fill="url(#paint0_radial_357_1266)" />
+                                <rect y="0.5" width="16" height="16" rx="8" fill="url(#paint1_radial_357_1266)" fill-opacity="0.2" />
+                                <path d="M6.33373 8.5002C6.33373 7.57972 7.07972 6.83333 8.0002 6.83333C8.92068 6.83333 9.66707 7.57972 9.66707 8.5002C9.66707
+9.42068 8.92068 10.1671 8.0002 10.1671C7.07972 10.1671 6.33373 9.42068 6.33373 8.5002ZM5.43266 8.5002C5.43266 9.91826
+6.58214 11.0677 8.0002 11.0677C9.41826 11.0677 10.5677 9.91826 10.5677 8.5002C10.5677 7.08214 9.41826 5.93266 8.0002
+5.93266C6.58214 5.93266 5.4327 7.08206 5.4327 8.5002H5.43266ZM10.0694 5.83085C10.0694 5.94953 10.1045 6.06555 10.1704
+6.16425C10.2363 6.26295 10.33 6.33989 10.4396 6.38535C10.5492 6.43081 10.6698 6.44274 10.7863 6.41964C10.9027 6.39653
+11.0096 6.33943 11.0935 6.25554C11.1775 6.17166 11.2347 6.06477 11.2579 5.94839C11.2811 5.832 11.2692 5.71135 11.2239
+5.6017C11.1785 5.49204 11.1016 5.3983 11.003 5.33233C10.9043 5.26635 10.7883 5.23112 10.6697 5.23107H10.6694C10.5104
+5.23114 10.3578 5.29435 10.2453 5.40681C10.1328 5.51927 10.0695 5.67178 10.0694 5.83085ZM5.98012 12.5703C5.49262 12.5481
+5.22765 12.4669 5.05156 12.3983C4.81811 12.3074 4.65155 12.1992 4.47642 12.0243C4.30129 11.8494 4.19289 11.683 4.1024
+11.4495C4.03376 11.2735 3.95256 11.0085 3.9304 10.521C3.90616 9.9939 3.90132 9.83557 3.90132 8.50028C3.90132 7.16499
+3.90656 7.0071 3.9304 6.4796C3.9526 5.9921 4.0344 5.72757 4.1024 5.55104C4.19329 5.31759 4.30153 5.15103 4.47642
+4.9759C4.65131 4.80077 4.81771 4.69237 5.05156 4.60188C5.22757 4.53324 5.49262 4.45204 5.98012 4.42988C6.50718 4.40564
+6.66551 4.4008 8.0002 4.4008C9.33489 4.4008 9.49338 4.40596 10.0209 4.42996C10.5084 4.45216 10.7729 4.53396 10.9494
+4.60196C11.1829 4.69245 11.3495 4.80109 11.5246 4.97598C11.6997 5.15087 11.8077 5.31767 11.8986 5.55112C11.9672 5.72713
+12.0484 5.99218 12.0706 6.47968C12.0948 7.00718 12.0997 7.16507 12.0997 8.50036C12.0997 9.83565 12.0948 9.99354 12.0706
+10.521C12.0484 11.0085 11.9668 11.2735 11.8986 11.4496C11.8077 11.683 11.6995 11.8496 11.5246 12.0243C11.3497 12.1991
+11.1829 12.3075 10.9494 12.3984C10.7734 12.467 10.5084 12.5482 10.0209 12.5704C9.49382 12.5946 9.33549 12.5994 8.0002
+12.5994C6.66491 12.5994 6.50702 12.5946 5.98012 12.5704V12.5703ZM5.93872 3.53028C5.40642 3.55452 5.04268 3.63893 4.72503
+3.76253C4.39626 3.89018 4.11756 4.06142 3.83927 4.33927C3.56098 4.61713 3.39018 4.89586 3.26253 5.22503C3.13893 5.54288
+3.05452 5.90642 3.03028 6.43872C3.00564 6.97186 3 7.14231 3 8.5002C3 9.8581 3.00564 10.0285 3.03028 10.5617C3.05452
+11.094 3.13893 11.4575 3.26253 11.7754C3.39018 12.1041 3.56102 12.3834 3.83927 12.6611C4.11752 12.9389 4.39586 13.1099
+4.72503 13.2379C5.04328 13.3615 5.40642 13.4459 5.93872 13.4701C6.47214 13.4944 6.64231 13.5004 8.0002 13.5004C9.35809
+13.5004 9.52854 13.4948 10.0617 13.4701C10.594 13.4459 10.9575 13.3615 11.2754 13.2379C11.6041 13.1099 11.8828 12.939
+12.1611 12.6611C12.4394 12.3833 12.6099 12.1041 12.7379 11.7754C12.8615 11.4575 12.9463 11.094 12.9701 10.5617C12.9944
+10.0281 13 9.8581 13 8.5002C13 7.14231 12.9944 6.97186 12.9701 6.43872C12.9459 5.90638 12.8615 5.54268 12.7379
+5.22503C12.6099 4.89626 12.439 4.61757 12.1611 4.33927C11.8833 4.06098 11.6041 3.89018 11.2758 3.76253C10.9575 3.63893
+10.594 3.55412 10.0621 3.53028C9.52886 3.50592 9.3585 3.5 8.0008 3.5C6.64311 3.5 6.47234 3.50564 5.93892 3.53028"
+                                      fill="white" />
+                                <defs>
+                                    <radialGradient id="paint0_radial_357_1266" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+                                                    gradientTransform="translate(1.0355 16.1495) scale(20.3141)">
+                                        <stop offset="0.09" stop-color="#FA8F21" />
+                                        <stop offset="0.78" stop-color="#D82D7E" />
+                                    </radialGradient>
+                                    <radialGradient id="paint1_radial_357_1266" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+                                                    gradientTransform="translate(8 16) scale(12.5)">
+                                        <stop offset="0.713542" stop-color="#8C3AAA" stop-opacity="0" />
+                                        <stop offset="1" stop-color="#8C3AAA" />
+                                    </radialGradient>
+                                </defs>
+                            </svg>
+                        </div>
+                        <div class="mx-4">
+                            <p class="text-gray-400 text-sm -mb-1">Instagram</p>
+                            <a class="text-white -mt-1" target="_blank" href="https://instagram.com/mr.mohande3">mr.mohande3</a>
+                        </div>
+                    </div>
+                </a>
+
+                <a target="_blank" href="https://x.com/mrmohande3">
+                    <div class="flex flex-row my-5">
+                        <div class="p-1 bg-[#00ACEE] my-auto rounded-full">
+
+                            <img class="w-7 h-7"
+                                 src="https://png.pngtree.com/png-vector/20221018/ourmid/pngtree-twitter-social-media-round-icon-png-image_6315985.png" />
+
+                        </div>
+                        <div class="mx-4">
+                            <p class="text-gray-400 text-sm -mb-1">Twitter</p>
+                            <a target="_blank" href="https://x.com/mrmohande3" class="text-white">Amir Hossein Khademi</a>
+                        </div>
+                    </div>
+                </a>
+
+                <a target="_blank" href="https://linkedin.com/in/mrmohande3">
+                    <div class="flex flex-row my-5">
+                        <div class="p-1 bg-[#0077B5] my-auto rounded-full">
+
+                            <img class="w-7 h-7 rounded-full"
+                                 src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/ca/LinkedIn_logo_initials.png/800px-LinkedIn_logo_initials.png" />
+
+                        </div>
+                        <div class="mx-4">
+                            <p class="text-gray-400 text-sm -mb-1">Linkdin</p>
+                            <a class="text-white -mt-1" target="_blank" href="https://linkedin.com/in/mrmohande3">mrmohande3</a>
+                        </div>
+                    </div>
+                </a>
+            </div>
+        </MudItem>
+        <MudItem xs="12" md="9" class="bg-transparent">
+            <MudStack Row="true" AlignItems="AlignItems.Center">
+                <div class="bg-[#2E2E48] w-10 h-10 rounded-full">
+                    <div class="bg-[#C696FC] w-3 h-3 rounded-full m-3.5"></div>
+                </div>
+                <p class="text-white text-2xl font-bold">Experience</p>
+            </MudStack>
+            <div class="flex md:ml-5 flex-row">
+                <div class="w-0.5 bg-[#2E2E48] h-auto collapse md:visible"></div>
+
+                <MudGrid class="ml-5 my-5">
+
+                    <MudItem sm="6">
+
+                        <ExperienceItemTemplate Period="April 2018 - Now"
+                                                Feilds="@(new string[] {"Co-Founder" , "Senior .Net Developer"})" HasLeftBorder="true"
+                                                ImageSrc="../assets/images/vnfLogo.png" CompanyName="Vira Nasir Fanafar"
+                                                Detail="Since 2018, with the start of startup activity , we introduce our brand , Vira Nasr Fanavar and I have been responsible as Co-Founder , senior .Net Developer of projects." />
+                    </MudItem>
+
+                    <MudItem sm="6">
+                        <ExperienceItemTemplate Period="June 2019 - Now" Feilds="@(new string[] {"Scrum Master"})"
+                                                ImageSrc="../assets/images/mucutLogo.png" HasLeftBorder="false" CompanyName="Sahand Company"
+                                                Detail="Since 2020, I have been working as a Scrum Master in Sahand company, while also developing and implementing the idea of a startup called Mokat. I gained valuable experiences in development, implementation, and team building." />
+                    </MudItem>
+
+                </MudGrid>
+            </div>
+
+            <MudStack Row="true" AlignItems="AlignItems.Center">
+                <div class="bg-[#2E2E48] w-10 h-10 rounded-full">
+                    <div class="bg-[#C696FC] w-3 h-3 rounded-full m-3.5"></div>
+                </div>
+                <MudText class=" text-white text-2xl font-bold">
+                    <p>Latest Projects</p>
+                </MudText>
+            </MudStack>
+            <MudStack Row="true" class="md:ml-5">
+                <div class="w-0.5 md:mr-10 bg-[#2E2E48] h-auto collapse md:visible"></div>
+                <MudGrid class="my-5" Spacing="1" Justify="Justify.Center">
+                    @foreach (var item in ProjectItemModels)
+                    {
+                        <MudItem xs="12" sm="6" md="6" lg="6" xl="3">
+                            <ProjectItemTemplate Name="@item.Name" Detail="@item.Detail" ImageSrc="@item.ImageSrc"
+                                                 ShowButton="@item.ShowButton" Link="@item.Link" Feilds="@item.Feilds" ButtonText="@item.ButtonText" />
+                        </MudItem>
+                    }
+                </MudGrid>
+
+            </MudStack>
+
+
+
+
+            <MudStack Row="true" AlignItems="AlignItems.Center">
+                <div class="bg-[#2E2E48] w-10 h-10 rounded-full">
+                    <div class="bg-[#C696FC] w-3 h-3 rounded-full m-3.5"></div>
+                </div>
+                <p class="my-auto mx-5 text-white text-2xl font-bold">Skills</p>
+            </MudStack>
+            <MudStack Row="true" class="md:ml-5">
+                <div class="w-0.5 collapse md:visible  md:mr-10 bg-[#2E2E48] h-auto"></div>
+                <MudGrid class="my-5" Spacing="1">
+                    @foreach (var item in SkillItemModels)
+                    {
+                        <MudItem xs="6" sm="4" md="4" lg="3">
+                            <SkillItemTemplate Name="@item.Name" ExperiencePeriod="@item.ExperiencePeriod" ImageSrc="@item.ImageSrc" />
+                        </MudItem>
+                    }
+
+                </MudGrid>
+            </MudStack>
+
+
+
+
+            <MudStack Row="true" AlignItems="AlignItems.Center">
+                <div class="bg-[#2E2E48] w-10 h-10 rounded-full">
+                    <div class="bg-[#C696FC] w-3 h-3 rounded-full m-3.5"></div>
+                </div>
+                <p class="my-auto mx-5 text-white text-2xl font-bold">Tools</p>
+            </MudStack>
+            <MudStack Row="true" class="md:ml-15">
+                <div class="w-0.5 collapse  md:mr-10 bg-[#2E2E48] h-auto"></div>
+                <MudGrid class="my-5" Spacing="1" Justify="Justify.Center">
+                    @foreach (var item in ToolsItemModels)
+                    {
+                        <MudItem xs="6" sm="4" md="4" lg="2">
+                            <ToolsItemTemplate Name="@item.Name" ExperiencePeriod="@item.ExperiencePeriod" ImageSrc="@item.ImageSrc" />
+                        </MudItem>
+                    }
+                </MudGrid>
+            </MudStack>
+
+
+        </MudItem>
+
+    </MudGrid>
+</MudContainer>
+
+@code
+{
+
+    [Parameter] public List<SkillItemModel> SkillItemModels { get; set; } = ExperienceHelper.SkillItemModels;
+    [Parameter] public List<SkillItemModel> ToolsItemModels { get; set; } = ExperienceHelper.ToolsItemModels;
+    [Parameter] public List<ProjectItemModel> ProjectItemModels { get; set; } = ExperienceHelper.ProjectItemModels;
+
+}

Resume.BlazorSS/Pages/_Host.cshtml

@@ -0,0 +1,48 @@
+@page "/"
+@using Microsoft.AspNetCore.Components.Web
+@namespace Resume.BlazorSS.Pages
+@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <base href="~/" />
+    <link href="css/site.min.css" rel="stylesheet" />
+    <link rel="icon" type="image/png" href="favicon.png" />
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
+    <link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
+    <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
+
+
+
+    <meta name="theme-color" content="#232339" />
+    <meta name="description" content="امیرحسین خادمی | Amir Hossein Khademi مهندس نرم افزار و توسعه دهنده .net">
+    <meta property="og:title" content="Amir Hossein Khademi | امیرحسین خادمی">
+    <meta property="og:description" content="امیرحسین خادمی | Amir Hossein Khademi مهندس نرم افزار و توسعه دهنده .net">
+    <meta property="og:url" content="https://amir-khademi.ir">
+    <meta name="twitter:title" content="Amir Hossein Khademi | امیرحسین خادمی">
+    <meta name="twitter:description" content="امیرحسین خادمی | Amir Hossein Khademi مهندس نرم افزار و توسعه دهنده .net">
+    <meta name="twitter:url" content="https://mucut.ir">
+    <meta name="twitter:card" content="summary_large_image">
+
+</head>
+<body>
+    <component type="typeof(App)" render-mode="ServerPrerendered" />
+
+    <div id="blazor-error-ui">
+        <environment include="Staging,Production">
+            An error has occurred. This application may no longer respond until reloaded.
+        </environment>
+        <environment include="Development">
+            An unhandled exception has occurred. See browser dev tools for details.
+        </environment>
+        <a href="" class="reload">Reload</a>
+        <a class="dismiss">🗙</a>
+    </div>
+
+<script src="_framework/blazor.server.js"></script>
+    <script src="_content/MudBlazor/MudBlazor.min.js"></script>
+</body>
+</html>

Resume.BlazorSS/Program.cs

@@ -0,0 +1,29 @@
+using MudBlazor.Services;
+
+var builder = WebApplication.CreateBuilder(args);
+
+// Add services to the container.
+builder.Services.AddRazorPages();
+builder.Services.AddServerSideBlazor();
+builder.Services.AddMudServices();
+
+
+var app = builder.Build();
+
+// Configure the HTTP request pipeline.
+if (!app.Environment.IsDevelopment())
+{
+    app.UseExceptionHandler("/Error");
+    app.UseHsts();
+}
+
+app.UseHttpsRedirection();
+
+app.UseStaticFiles();
+
+app.UseRouting();
+
+app.MapBlazorHub();
+app.MapFallbackToPage("/_Host");
+
+app.Run();

Resume.BlazorSS/Properties/launchSettings.json

@@ -0,0 +1,47 @@
+{
+  "profiles": {
+    "http": {
+      "commandName": "Project",
+      "launchBrowser": true,
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      },
+      "dotnetRunMessages": true,
+      "applicationUrl": "http://localhost:5023"
+    },
+    "https": {
+      "commandName": "Project",
+      "launchBrowser": true,
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      },
+      "dotnetRunMessages": true,
+      "applicationUrl": "https://localhost:7271;http://localhost:5023"
+    },
+    "IIS Express": {
+      "commandName": "IISExpress",
+      "launchBrowser": true,
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      }
+    },
+    "Container (Dockerfile)": {
+      "commandName": "Docker",
+      "launchBrowser": true,
+      "launchUrl": "{Scheme}://{ServiceHost}:{ServicePort}",
+      "environmentVariables": {
+        "ASPNETCORE_URLS": "https://+:443;http://+:80"
+      },
+      "publishAllPorts": true,
+      "useSSL": true
+    }
+  },
+  "iisSettings": {
+    "windowsAuthentication": false,
+    "anonymousAuthentication": true,
+    "iisExpress": {
+      "applicationUrl": "http://localhost:17475",
+      "sslPort": 44330
+    }
+  }
+}

Resume.BlazorSS/Resume.BlazorSS.csproj

@@ -0,0 +1,23 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+	<Target Name="PostBuild" AfterTargets="PostBuildEvent">
+		<Exec Command="npm run buildcss" />
+	</Target>
+
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <UserSecretsId>d2d661a9-c192-4290-9ecd-5f597df0e1a6</UserSecretsId>
+    <DockerDefaultTargetOS>Linux</DockerDefaultTargetOS>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.19.6" />
+    <PackageReference Include="MudBlazor" Version="6.19.1" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <Folder Include="Pages\AdminPanel\" />
+  </ItemGroup>
+
+</Project>

Resume.BlazorSS/Shared/MainLayout.razor

@@ -0,0 +1,10 @@
+@inherits LayoutComponentBase
+<MudThemeProvider IsDarkMode="true" />
+<MudDialogProvider />
+<MudSnackbarProvider />
+
+<MudLayout>
+    <MudMainContent class="bg-[#232339] pt-5">
+        @Body
+    </MudMainContent>
+</MudLayout>

Resume.BlazorSS/Shared/MainLayout.razor.css

@@ -0,0 +1,70 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+}
+
+.sidebar {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row ::deep a, .top-row .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+    }
+
+    .top-row a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row:not(.auth) {
+        display: none;
+    }
+
+    .top-row.auth {
+        justify-content: space-between;
+    }
+
+    .top-row a, .top-row .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row, article {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}

Resume.BlazorSS/Shared/NavMenu.razor

@@ -0,0 +1,39 @@
+<div class="top-row ps-3 navbar navbar-dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="">Resume.BlazorSS</a>
+        <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+    </div>
+</div>
+
+<div class="@NavMenuCssClass nav-scrollable" @onclick="ToggleNavMenu">
+    <nav class="flex-column">
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+                <span class="oi oi-home" aria-hidden="true"></span> Home
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="counter">
+                <span class="oi oi-plus" aria-hidden="true"></span> Counter
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="fetchdata">
+                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
+            </NavLink>
+        </div>
+    </nav>
+</div>
+
+@code {
+    private bool collapseNavMenu = true;
+
+    private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
+
+    private void ToggleNavMenu()
+    {
+        collapseNavMenu = !collapseNavMenu;
+    }
+}

Resume.BlazorSS/Shared/NavMenu.razor.css

@@ -0,0 +1,68 @@
+.navbar-toggler {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+.top-row {
+    height: 3.5rem;
+    background-color: rgba(0,0,0,0.4);
+}
+
+.navbar-brand {
+    font-size: 1.1rem;
+}
+
+.oi {
+    width: 2rem;
+    font-size: 1.1rem;
+    vertical-align: text-top;
+    top: -2px;
+}
+
+.nav-item {
+    font-size: 0.9rem;
+    padding-bottom: 0.5rem;
+}
+
+    .nav-item:first-of-type {
+        padding-top: 1rem;
+    }
+
+    .nav-item:last-of-type {
+        padding-bottom: 1rem;
+    }
+
+    .nav-item ::deep a {
+        color: #d7d7d7;
+        border-radius: 4px;
+        height: 3rem;
+        display: flex;
+        align-items: center;
+        line-height: 3rem;
+    }
+
+.nav-item ::deep a.active {
+    background-color: rgba(255,255,255,0.25);
+    color: white;
+}
+
+.nav-item ::deep a:hover {
+    background-color: rgba(255,255,255,0.1);
+    color: white;
+}
+
+@media (min-width: 641px) {
+    .navbar-toggler {
+        display: none;
+    }
+
+    .collapse {
+        /* Never collapse the sidebar for wide screens */
+        display: block;
+    }
+    
+    .nav-scrollable {
+        /* Allow sidebar to scroll for tall menus */
+        height: calc(100vh - 3.5rem);
+        overflow-y: auto;
+    }
+}

Resume.BlazorSS/Shared/SurveyPrompt.razor

@@ -0,0 +1,16 @@
+<div class="alert alert-secondary mt-4">
+    <span class="oi oi-pencil me-2" aria-hidden="true"></span>
+    <strong>@Title</strong>
+
+    <span class="text-nowrap">
+        Please take our
+        <a target="_blank" class="font-weight-bold link-dark" href="https://go.microsoft.com/fwlink/?linkid=2186158">brief survey</a>
+    </span>
+    and tell us what you think.
+</div>
+
+@code {
+    // Demonstrates how a parent component can supply parameters
+    [Parameter]
+    public string? Title { get; set; }
+}

Resume.BlazorSS/_Imports.razor

@@ -0,0 +1,11 @@
+@using System.Net.Http
+@using Microsoft.AspNetCore.Authorization
+@using Microsoft.AspNetCore.Components.Authorization
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using Resume.BlazorSS
+@using Resume.BlazorSS.Shared
+@using MudBlazor

Resume.BlazorSS/appsettings.Development.json

@@ -0,0 +1,9 @@
+{
+  "DetailedErrors": true,
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}

Resume.BlazorSS/appsettings.json

@@ -0,0 +1,9 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "AllowedHosts": "*"
+}

Resume.BlazorSS/package.json

@@ -0,0 +1,12 @@
+{
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "buildcss": "postcss wwwroot/css/site.css -o wwwroot/css/site.min.css"
+  },
+  "dependencies": {
+    "autoprefixer": "^10.4.19",
+    "postcss": "^8.4.38",
+    "postcss-cli": "^11.0.0",
+    "tailwindcss": "^3.4.3"
+  }
+}

Resume.BlazorSS/postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

Resume.BlazorSS/tailwind.config.js

@@ -0,0 +1,23 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    purge: {
+        enabled: true,
+        content: [
+            './**/*.html',
+            './**/*.razor'
+        ],
+    },
+    content: ["./src/**/*.{razor,html,cshtml}"],
+    theme: {
+        extend:
+        {
+            fontFamily: {
+                'outfit': ['Outfit', 'sans-serif'],
+                'outfit-black': ['Outfit-Black', 'sans-serif'],
+                'poppins': ['Poppins', 'sans-serif']
+            },
+        },
+    },
+    plugins: [],
+}
+