Skip to content

Commit 6202bd7

Browse files
committed
Update banners
1 parent a2a5916 commit 6202bd7

File tree

4 files changed

+37
-49
lines changed

4 files changed

+37
-49
lines changed

RadzenBlazorDemos/Pages/Index.razor

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -78,16 +78,8 @@
7878
</RadzenColumn>
7979
</RadzenRow>
8080

81-
<RadzenRow ID="components" Gap="1rem" class="rz-w-100 rz-mx-auto" Style="max-width: 1440px;">
81+
<RadzenRow ID="components" Gap="1rem" class="rz-w-100 rz-mx-auto rz-mt-12 rz-pt-12" Style="max-width: 1440px;">
8282
<RadzenColumn Size="12">
83-
<RadzenAlert AlertStyle="AlertStyle.Dark" Icon="mode_heat" Size="AlertSize.Large" Variant="Variant.Flat" class="rz-my-lg-12 promo-alert">
84-
<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-mb-3 rz-color-on-base-darker"><strong>NEW: Radzen Blazor for Visual Studio</strong></RadzenText>
85-
<RadzenText TextStyle="TextStyle.Body1" class="rz-color-on-base-darker">The extension brings Radzen’s rich feature set and productivity tools directly into the familiar Visual Studio 2022 environment. Connect to data, design, code seamlessly, and work faster within Visual Studio. <RadzenLink Path="https://www.radzen.com/blazor-visual-studio" target="_blank" Style="color: #FFB9FF !important;">Learn More ↗</RadzenLink></RadzenText>
86-
<RadzenStack Orientation="Orientation.Horizontal" Gap="2rem" AlignItems="AlignItems.Center" class="rz-mt-6">
87-
<RadzenButton Text="See in Action" ButtonStyle="ButtonStyle.Primary" Variant="Variant.Flat" Size="ButtonSize.Medium" Click=@(args => ShowVideoDialog("https://www.youtube.com/embed/VUwy-BX3eCM?&rel=0")) />
88-
</RadzenStack>
89-
</RadzenAlert>
90-
9183
<RadzenToc Orientation="Orientation.Horizontal" Selector=".radzen-blazor" Style="position: sticky; top: 2rem; z-index: 1;" class="rz-display-none rz-display-md-flex">
9284
<RadzenTocItem Text="UI Components" Selector="#get-started"></RadzenTocItem>
9385
<RadzenTocItem Selector="#blocks">

RadzenBlazorDemos/Shared/MainLayout.razor

Lines changed: 34 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -43,50 +43,46 @@
4343
<RadzenColumn Size="12">
4444
<RadzenRow class="rz-mx-auto" Style="max-width: 1600px;">
4545
<RadzenColumn Size="12" SizeMD=@(example?.Toc != null ? 10 : 12)>
46-
<RadzenAlert AlertStyle="AlertStyle.Dark" Icon="mode_heat" Size="AlertSize.Large" Variant="Variant.Flat" class="rz-my-lg-12 promo-alert">
47-
<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-mb-3 rz-color-on-base-darker"><strong>NEW: Radzen Blazor for Visual Studio</strong></RadzenText>
48-
<RadzenText TextStyle="TextStyle.Body1" class="rz-color-on-base-darker">The extension brings Radzen’s rich feature set and productivity tools directly into the familiar Visual Studio 2022 environment. Connect to data, design, code seamlessly, and work faster within Visual Studio. <RadzenLink Path="https://www.radzen.com/blazor-visual-studio" target="_blank" Style="color: #FFB9FF !important;">Learn More ↗</RadzenLink></RadzenText>
49-
<RadzenStack Orientation="Orientation.Horizontal" Gap="2rem" AlignItems="AlignItems.Center" class="rz-mt-6">
50-
<RadzenButton Text="See in Action" ButtonStyle="ButtonStyle.Primary" Variant="Variant.Flat" Size="ButtonSize.Medium" Click=@(args => ShowVideoDialog("https://www.youtube.com/embed/VUwy-BX3eCM?&rel=0")) />
51-
</RadzenStack>
52-
</RadzenAlert>
5346
@Body
54-
<RadzenCard class="rz-mt-12 rz-display-block rz-p-6 rz-p-md-12">
55-
<RadzenRow AlignItems="AlignItems.Center" Gap="0px">
56-
<RadzenColumn SizeMD="12" SizeLG="7" class="rz-p-0 rz-pe-4 rz-pt-lg-8 rz-pb-lg-8 rz-ps-lg-8 rz-pe-lg-0">
57-
<RadzenRow Gap="1rem">
58-
<RadzenColumn Size="12">
59-
<RadzenStack Orientation="Orientation.Vertical">
60-
<RadzenText TextStyle="TextStyle.DisplayH4" TagName="TagName.H2" class="rz-mb-4" Style="line-height: 1.2; text-wrap: balance;">Supercharge your Blazor development with Radzen</RadzenText>
61-
<RadzenText TextStyle="TextStyle.H6" TagName="TagName.P" class="rz-text-secondary-color" Style="line-height: 1.5; max-width: 720px;">Whether you prefer a standalone environment or integration directly within Visual Studio, Radzen provides a powerful toolkit to increase development speed, reduce repetitive coding, and focus on building exceptional applications.</RadzenText>
47+
<RadzenCard class="rz-mt-12 rz-display-block rz-p-6 rz-p-md-12 rz-pb-12 rz-background-color-base-darker dark" Style="overflow: hidden; ">
48+
<RadzenRow AlignItems="AlignItems.Center" Gap="0px" class="rz-pb-12 rz-mb-4">
49+
<RadzenColumn SizeMD="12" class="rz-p-0 rz-pb-12 rz-mb-12">
50+
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Center" Style="position: relative;" class="rz-mb-12">
51+
<RadzenText TextStyle="TextStyle.Overline" TagName="TagName.Span" class="rz-mt-8 rz-mb-12 rz-color-primary-light" Style="font-size: 1rem">All the tools in one place</RadzenText>
52+
<RadzenText TextStyle="TextStyle.DisplayH2" TagName="TagName.H2" class="rz-mb-8 rz-color-on-base-darker rz-text-align-center" Style="--rz-text-display-h2-font-weight: 600; text-wrap: balance;">Code Less. Deliver More.</RadzenText>
53+
<RadzenText TextStyle="TextStyle.H5" TagName="TagName.P" class="rz-mb-12 rz-color-on-base-darker rz-text-align-center" Style="line-height: 1.5; max-width: 720px; text-wrap: balance;">With Radzen Subscription you get the full toolkit. Get started now and save hours on every project.</RadzenText>
54+
<RadzenStack Gap="1rem" class="rz-mb-6" Style="max-width: 500px;">
55+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
56+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
57+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">Complete Blazor development environment.</RadzenText>
6258
</RadzenStack>
63-
</RadzenColumn>
64-
<RadzenColumn Size="12" SizeMD="5" class="rz-py-5 rz-pe-6 rz-text-align-start">
65-
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Start" Gap="0.5rem" Wrap="FlexWrap.Wrap" class="rz-mb-2">
66-
<RadzenBadge BadgeStyle="BadgeStyle.Danger" Text="Pro" />
67-
<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H3" class="rz-m-0" Style="line-height: 1.2; text-wrap: balance;">Radzen Blazor Studio</RadzenText>
59+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
60+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
61+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">Open technology stack. No vendor lock-in.</RadzenText>
6862
</RadzenStack>
69-
<RadzenText TextStyle="TextStyle.Body2" TagName="TagName.P" class="rz-text-secondary-color" Style="line-height: 1.5; text-wrap: balance;">Radzen Blazor Studio is a software development environment that empowers developers to design, build and deploy Blazor applications without the traditional hurdles.</RadzenText>
70-
<RadzenStack Orientation="Orientation.Horizontal" Gap="1rem" Wrap="FlexWrap.Wrap" class="rz-my-4">
71-
<RadzenButton Text="See in Action" ButtonStyle="ButtonStyle.Primary" Variant="Variant.Flat" Size="ButtonSize.Medium" Click=@(args => ShowVideoDialog("https://www.youtube.com/embed/_F-CUWxYvCA?&rel=0")) />
72-
<NavLink class="rz-button rz-button-md rz-base rz-shade-default rz-variant-flat rz-text-align-center" href="https://www.radzen.com/blazor-studio/" target="_blank">Learn More</NavLink>
63+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
64+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
65+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">Ready-to-use UI blocks and app templates.</RadzenText>
7366
</RadzenStack>
74-
</RadzenColumn>
75-
<RadzenColumn Size="12" SizeMD="5" class="rz-py-5 rz-pe-4 rz-text-align-start ">
76-
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Start" Gap="0.5rem" Wrap="FlexWrap.Wrap" class="rz-mb-2">
77-
<RadzenBadge BadgeStyle="BadgeStyle.Success" Text="New" />
78-
<RadzenText TextStyle="TextStyle.H5" TagName="TagName.H3" class="rz-m-0" Style="line-height: 1.2; text-wrap: balance;">Radzen Blazor for Visual Studio</RadzenText>
67+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
68+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
69+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">Advanced theming.</RadzenText>
7970
</RadzenStack>
80-
<RadzenText TextStyle="TextStyle.Body2" TagName="TagName.P" class="rz-text-secondary-color" Style="line-height: 1.5; text-wrap: balance;">Radzen Blazor for Visual Studio extension streamlines Blazor development within the Visual Studio environment. The Blazor extension you need to boost productivity!</RadzenText>
81-
<RadzenStack Orientation="Orientation.Horizontal" Gap="1rem" Wrap="FlexWrap.Wrap" class="rz-my-4">
82-
<RadzenButton Text="See in Action" ButtonStyle="ButtonStyle.Primary" Variant="Variant.Flat" Size="ButtonSize.Medium" Click=@(args => ShowVideoDialog("https://www.youtube.com/embed/VUwy-BX3eCM?&rel=0")) />
83-
<NavLink class="rz-button rz-button-md rz-base rz-shade-default rz-variant-flat rz-text-align-center" href="https://www.radzen.com/blazor-visual-studio/" target="_blank">Learn More</NavLink>
71+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
72+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
73+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">Dedicated support backed by proven expertise.</RadzenText>
8474
</RadzenStack>
85-
</RadzenColumn>
86-
</RadzenRow>
87-
</RadzenColumn>
88-
<RadzenColumn SizeMD="12" SizeLG="5" class="rz-pb-5 rz-py-xl-12">
89-
<RadzenImage Path="images/radzen-blazor-studio.png" class="rz-m-0" Style="width: 100%" AlternateText=">Radzen Blazor Studio" Click=@(args => ShowVideoDialog("https://www.youtube.com/embed/_F-CUWxYvCA?&rel=0")) />
75+
<RadzenStack Orientation="Radzen.Orientation.Horizontal" AlignItems="Radzen.AlignItems.Center">
76+
<RadzenIcon Icon="task_alt" class="rz-color-on-base-darker" />
77+
<RadzenText TextStyle="Radzen.Blazor.TextStyle.Body1" class="rz-color-on-base-darker">No hidden runtime costs.</RadzenText>
78+
</RadzenStack>
79+
</RadzenStack>
80+
<RadzenStack Orientation="Orientation.Horizontal" JustifyContent="JustifyContent.Center" Gap="1.5rem" Wrap="FlexWrap.Wrap" class="rz-my-12 rz-pb-12">
81+
<NavLink class="cta-button primary" href="https://www.radzen.com/blazor-studio/download/" target="_blank" title="Get Radzen Blazor Studio for Windows, Mac or Linux">Start Free</NavLink>
82+
<NavLink class="cta-button" href="https://www.radzen.com/blazor-studio/" target="_blank" title="Explore Radzen Blazor Studio features">See All Benefits</NavLink>
83+
</RadzenStack>
84+
<NavLink href="https://www.radzen.com/blazor-studio/" target="_blank" title="Explore Radzen Blazor Studio features" class="rz-text-align-center" Style="position: absolute; top: calc(100% - 30px);"><img alt="Radzen Blazor Studio" src="images/radzen-blazor-studio-dark.png" style="width: 100%; max-width: 1200px;" /></NavLink>
85+
</RadzenStack>
9086
</RadzenColumn>
9187
</RadzenRow>
9288
</RadzenCard>

RadzenBlazorDemos/wwwroot/css/site.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -162,8 +162,8 @@ body {
162162
.cta-button.primary {
163163
font-weight: 600;
164164
color: #ffffff !important;
165-
border-color: #FF504D;
166-
background: #FF504D;
165+
border-color: var(--rz-primary); /*#FF504D*/
166+
background: var(--rz-primary); /*#FF504D*/
167167
}
168168

169169
.cta-button:hover {
-168 KB
Loading

0 commit comments

Comments
 (0)