Files
radzen-blazor/RadzenBlazorDemos/Pages/TemplatesRealestatePage.razor
2025-10-22 12:54:05 +03:00

121 lines
10 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@page "/templates-realestate"
<PageTitle>Real Estate Blazor Website | Premium App Templates by Radzen</PageTitle>
<HeadContent>
<meta name="description" content="A real estate website template designed to showcase listings, build trust, and convert leads. Featuring clean layout and responsive design.">
</HeadContent>
<RadzenText TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8 rz-mb-12">
Real Estate Blazor Website Template
</RadzenText>
<RadzenCard Variant="Variant.Outlined">
<RadzenRow class="rz-w-100 rz-mx-auto" Gap="2rem">
<RadzenColumn Size="12">
<RadzenLink Style="--rz-link-hover-text-decoration: none" Path="https://realestate.radzen.com" title="Open in a new tab" target="_blank">
<RadzenImage class="rz-w-100 rz-h-100" Path="images/blazor-template-real-estate.jpg"></RadzenImage>
</RadzenLink>
</RadzenColumn>
</RadzenRow>
<RadzenRow class="rz-w-100 rz-mx-auto rz-px-6 rz-px-sm-12 rz-pt-6 rz-pt-sm-12" Gap="3rem">
<RadzenColumn Size="12" SizeLG="8" class="rz-pb-6 rz-pb-sm-12">
<RadzenStack Gap="0" class="rz-h-100">
<RadzenText Text="Overview" TextStyle="Radzen.Blazor.TextStyle.Overline" Style="max-width: 800px; font-size: 1rem" class="rz-color-primary" />
<RadzenText Text="A real estate website template designed to help agencies, independent agents, and property developers showcase listings, build trust, and convert leads. With a clean layout, responsive design, and compelling content sections, it provides everything you need to create a high-converting online presence in the real estate space." TextStyle="Radzen.Blazor.TextStyle.H5" TagName="Radzen.Blazor.TagName.P" Style="max-width: 800px; line-height: 1.5" />
<RadzenText Text="The template features all Radzen Blazor themes including light and dark modes." TextStyle="Radzen.Blazor.TextStyle.H5" TagName="Radzen.Blazor.TagName.P" Style="max-width: 800px; line-height: 1.5" />
<RadzenText Text="Perfect for" TextStyle="Radzen.Blazor.TextStyle.Overline" Style="max-width: 800px; font-size: 1rem" class="rz-color-primary rz-mt-6 rz-mb-4" />
<RadzenText Text="Real estate agencies, independent realtors, property developers, rental platforms." TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="1rem" Wrap="Radzen.FlexWrap.Wrap" class="rz-mt-12">
<RadzenLink Text="Live Preview" Icon="open_in_new" class="rz-button rz-button-lg rz-variant-flat rz-text-align-center rz-primary rz-shade-default" Style="--rz-link-hover-text-decoration: none" Path="https://realestate.radzen.com" title="Open in a new tab" target="_blank" />
<RadzenLink class="rz-button rz-button-lg rz-variant-text rz-base rz-text-align-center rz-shade-darker" Style="--rz-link-hover-text-decoration: none" Path="https://www.radzen.com/pricing" title="See Radzen Pricing" target="_blank">
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.25rem">
<RadzenIcon Icon="arrow_right_alt" Style="font-size: 1.5rem" /> Get Template
</RadzenStack>
</RadzenLink>
</RadzenStack>
</RadzenStack>
</RadzenColumn>
<RadzenColumn Size="12" SizeLG="4" class="rz-pb-6 rz-pb-sm-12">
<RadzenStack Gap="1rem" class="rz-h-100">
<RadzenText Text="What pages are included?" TextStyle="Radzen.Blazor.TextStyle.Overline" Style="max-width: 800px; font-size: 1rem" class="rz-color-primary" />
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Home page with top property listings" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Properties page with filtering" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Property Details page" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Agents and Agent Details pages" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="About us page" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Contact us page" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem" AlignItems="Radzen.AlignItems.Center">
<RadzenIcon Icon="check_circle" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText Text="Privacy Policy and Terms of Use pages" TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" />
</RadzenStack>
</RadzenStack>
</RadzenColumn>
<RadzenColumn Size="12" SizeLG="8" class="rz-pb-6 rz-pb-sm-12">
<RadzenStack Gap="1rem" class="rz-h-100">
<RadzenText Text="How to use?" TextStyle="Radzen.Blazor.TextStyle.Overline" Style="max-width: 800px; font-size: 1rem" class="rz-color-primary" />
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1">
This template is exclusively available with an active <RadzenLink Text="Radzen Professional or Enterprise subscription" Path="https://www.radzen.com/pricing" title="See Radzen Pricing" target="_blank" />.
</RadzenText>
<RadzenRow Gap="1rem">
<RadzenColumn Size="12" SizeSM="6">
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" >
In <RadzenLink Path="https://www.radzen.com/blazor-studio/download" target="_blank" title="Get Radzen Blazor Studio">Radzen Blazor Studio</RadzenLink> click the <strong>+</strong> button in the bottom left corner to start the New application wizard.
</RadzenText>
</RadzenStack>
</RadzenColumn>
<RadzenColumn Size="12" SizeSM="6">
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0" >
In <RadzenLink Path="https://www.radzen.com/blazor-visual-studio/download" target="_blank" title="Get Radzen Blazor for Visual Studio">Radzen Blazor for Visual Studio</RadzenLink> create a new application and pick the <strong>Radzen Blazor Application</strong> template.
</RadzenText>
</RadzenStack>
</RadzenColumn>
</RadzenRow>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0">
Select <strong>Real Estate Blazor Website</strong> and enter a name for your app.
</RadzenText>
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0">
Pick a rendering mode. All interactive rendering modes are supported - Server, WebAssembly and Auto. Interactivity is enabled globally.
</RadzenText>
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0">
Choose a directory where the application will exist and click <strong>Finish</strong>.
</RadzenText>
</RadzenStack>
<RadzenStack Orientation="Radzen.Orientation.Horizontal" Gap="0.5rem">
<RadzenIcon Icon="arrow_right_alt" IconStyle="Radzen.IconStyle.Primary"></RadzenIcon>
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-m-0">
Run the application to see the final result in your browser.
</RadzenText>
</RadzenStack>
</RadzenStack>
</RadzenColumn>
</RadzenRow>
</RadzenCard>