Merge branch 'main' of https://gitfrieds.nackenbox.xyz/Gottfried/KI-Kunst-Kirsten-Kloeckner
This commit is contained in:
jankaminski1
commit
77aa98a493
|
|
@ -10,46 +10,48 @@
|
||||||
@inject DialogService DialogService
|
@inject DialogService DialogService
|
||||||
|
|
||||||
<PageTitle>AiArt</PageTitle>
|
<PageTitle>AiArt</PageTitle>
|
||||||
<div class="hero_area">
|
|
||||||
|
|
||||||
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Center">
|
<section class="about_section layout_padding">
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Center">
|
||||||
<h1>Wunschbilder von KI nur für dich</h1>
|
<h1>Wunschbilder von KI nur für dich</h1>
|
||||||
<RadzenText TextStyle="TextStyle.H2">Nenne uns deinen Wunsch:</RadzenText>
|
<RadzenText TextStyle="TextStyle.H2">Nenne uns deinen Wunsch:</RadzenText>
|
||||||
<RadzenTextBox @bind-Value=@request Placeholder="Dein Wunsch"/>
|
<RadzenTextBox @bind-Value=@request Placeholder="Dein Wunsch"/>
|
||||||
|
|
||||||
<RadzenPanel AllowCollapse="true" Style="width: 500px;" Text="Mehr Optionen">
|
<RadzenPanel AllowCollapse="true" Style="width: 500px;" Text="Mehr Optionen">
|
||||||
<ChildContent>
|
<ChildContent>
|
||||||
<RadzenCard class="rz-mt-4">
|
<RadzenCard class="rz-mt-4">
|
||||||
<RadzenStack Orientation="Orientation.Horizontal"
|
<RadzenStack Orientation="Orientation.Horizontal"
|
||||||
MouseEnter="@(args => ShowTemperatureTooltip(args))"
|
MouseEnter="@(args => ShowTemperatureTooltip(args))"
|
||||||
MouseLeave="TooltipService.Close"
|
MouseLeave="TooltipService.Close"
|
||||||
AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
|
AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
|
||||||
<RadzenText>Temperature:</RadzenText>
|
<RadzenText>Temperature:</RadzenText>
|
||||||
<RadzenSlider @bind-Value=@temperature TValue="float"
|
<RadzenSlider @bind-Value=@temperature TValue="float"
|
||||||
Step="0.1" Min="0.0m" Max="2.0m">
|
Step="0.1" Min="0.0m" Max="2.0m">
|
||||||
</RadzenSlider>
|
</RadzenSlider>
|
||||||
<RadzenText>@temperature</RadzenText>
|
<RadzenText>@temperature</RadzenText>
|
||||||
</RadzenStack>
|
</RadzenStack>
|
||||||
</RadzenCard>
|
</RadzenCard>
|
||||||
</ChildContent>
|
</ChildContent>
|
||||||
</RadzenPanel>
|
</RadzenPanel>
|
||||||
|
|
||||||
<RadzenButton Visible=@_buttonVisible Click=@(async ()=> await DoStuff(true))>Generate</RadzenButton>
|
<RadzenButton Visible=@_buttonVisible Click=@(async ()=> await DoStuff(true))>Generate</RadzenButton>
|
||||||
|
|
||||||
<RadzenPanel AllowCollapse="true" Style="width: 500px;" Text="Zeige Prompt">
|
<RadzenPanel AllowCollapse="true" Style="width: 500px;" Text="Zeige Prompt">
|
||||||
<ChildContent>
|
<ChildContent>
|
||||||
<RadzenCard class="rz-mt-4">
|
<RadzenCard class="rz-mt-4">
|
||||||
<RadzenStack Orientation="Orientation.Horizontal"
|
<RadzenStack Orientation="Orientation.Horizontal"
|
||||||
MouseEnter="@(args => ShowTemperatureTooltip(args))"
|
MouseEnter="@(args => ShowTemperatureTooltip(args))"
|
||||||
MouseLeave="TooltipService.Close"
|
MouseLeave="TooltipService.Close"
|
||||||
AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
|
AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
|
||||||
<RadzenText>@_imagePromptEnglish</RadzenText>
|
<RadzenText>@_imagePromptEnglish</RadzenText>
|
||||||
</RadzenStack>
|
</RadzenStack>
|
||||||
</RadzenCard>
|
</RadzenCard>
|
||||||
</ChildContent>
|
</ChildContent>
|
||||||
</RadzenPanel>
|
</RadzenPanel>
|
||||||
|
|
||||||
<RadzenText TextStyle="TextStyle.H4">Die Idee, die gemalt wird:</RadzenText>
|
<RadzenText TextStyle="TextStyle.H4">Die Idee, die gemalt wird:</RadzenText>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -60,42 +62,43 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<RadzenProgressBarCircular Visible=@_progressVisible ProgressBarStyle="ProgressBarStyle.Secondary" Value="100" ShowValue="false" Mode="ProgressBarMode.Indeterminate" />
|
<RadzenProgressBarCircular Visible=@_progressVisible ProgressBarStyle="ProgressBarStyle.Secondary" Value="100" ShowValue="false" Mode="ProgressBarMode.Indeterminate" />
|
||||||
<RadzenText Visible=@_progressVisible TextStyle="TextStyle.H6" Text=@BusyMessage></RadzenText>
|
<RadzenText Visible=@_progressVisible TextStyle="TextStyle.H6" Text=@BusyMessage></RadzenText>
|
||||||
|
|
||||||
<RadzenImage Path=@_imageUrl></RadzenImage>
|
<RadzenImage Path=@_imageUrl></RadzenImage>
|
||||||
|
|
||||||
<RadzenText Visible=@_addonsVisible TextStyle="TextStyle.H2">Verändere hier dein Bild durch Worte:</RadzenText>
|
<RadzenText Visible=@_addonsVisible TextStyle="TextStyle.H2">Verändere hier dein Bild durch Worte:</RadzenText>
|
||||||
<RadzenTextBox Visible=@_addonsVisible @bind-Value=@addons Placeholder="z.B. Mehr Farben" />
|
<RadzenTextBox Visible=@_addonsVisible @bind-Value=@addons Placeholder="z.B. Mehr Farben" />
|
||||||
<RadzenButton Visible=@_bothVisible Click=@(async ()=> await DoStuff(false))>Generate</RadzenButton>
|
<RadzenButton Visible=@_bothVisible Click=@(async ()=> await DoStuff(false))>Generate</RadzenButton>
|
||||||
|
|
||||||
<RadzenCard>
|
<RadzenCard>
|
||||||
<RadzenRow Style="width:24.5em" Gap="0.5rem" RowGap="0.5rem">
|
<RadzenRow Style="width:24.5em" Gap="0.5rem" RowGap="0.5rem">
|
||||||
<RadzenColumn Size="6">
|
<RadzenColumn Size="6">
|
||||||
<FlippingImage ImageUrl="@_imageUrls[0]" HideImage="false"
|
<FlippingImage ImageUrl="@_imageUrls[0]" HideImage="false"
|
||||||
Show="@(_imageStates[0] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Up"
|
Show="@(_imageStates[0] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Up"
|
||||||
Click="() => ShowImageDialog(_imageUrls[0])" />
|
Click="() => ShowImageDialog(_imageUrls[0])" />
|
||||||
</RadzenColumn>
|
</RadzenColumn>
|
||||||
<RadzenColumn Size="6">
|
<RadzenColumn Size="6">
|
||||||
<FlippingImage ImageUrl="@_imageUrls[1]" HideImage="false"
|
<FlippingImage ImageUrl="@_imageUrls[1]" HideImage="false"
|
||||||
Show="@(_imageStates[1] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Right" FlipDelay="200"
|
Show="@(_imageStates[1] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Right" FlipDelay="200"
|
||||||
Click="() => ShowImageDialog(_imageUrls[1])" />
|
Click="() => ShowImageDialog(_imageUrls[1])" />
|
||||||
</RadzenColumn>
|
</RadzenColumn>
|
||||||
<RadzenColumn Size="6">
|
<RadzenColumn Size="6">
|
||||||
<FlippingImage ImageUrl="@_imageUrls[2]" HideImage="false"
|
<FlippingImage ImageUrl="@_imageUrls[2]" HideImage="false"
|
||||||
Show="@(_imageStates[2] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Left" FlipDelay="600"
|
Show="@(_imageStates[2] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Left" FlipDelay="600"
|
||||||
Click="() => ShowImageDialog(_imageUrls[2])" />
|
Click="() => ShowImageDialog(_imageUrls[2])" />
|
||||||
</RadzenColumn>
|
</RadzenColumn>
|
||||||
<RadzenColumn Size="6">
|
<RadzenColumn Size="6">
|
||||||
<FlippingImage ImageUrl="@_imageUrls[3]" HideImage="false"
|
<FlippingImage ImageUrl="@_imageUrls[3]" HideImage="false"
|
||||||
Show="@(_imageStates[3] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Down" FlipDelay="400"
|
Show="@(_imageStates[3] == ImageState.FadeIn)" FlipTo="FlippingImage.FlipDirection.Down" FlipDelay="400"
|
||||||
Click="() => ShowImageDialog(_imageUrls[3])" />
|
Click="() => ShowImageDialog(_imageUrls[3])" />
|
||||||
</RadzenColumn>
|
</RadzenColumn>
|
||||||
</RadzenRow>
|
</RadzenRow>
|
||||||
</RadzenCard>
|
</RadzenCard>
|
||||||
|
|
||||||
</RadzenStack>
|
</RadzenStack>
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
private int maxAddons = 2;
|
private int maxAddons = 2;
|
||||||
|
|
|
||||||
|
|
@ -3,12 +3,6 @@
|
||||||
<PageTitle>KIKunstKirstenKlöckner</PageTitle>
|
<PageTitle>KIKunstKirstenKlöckner</PageTitle>
|
||||||
|
|
||||||
<div class="page">
|
<div class="page">
|
||||||
@*
|
|
||||||
<div class="sidebar">
|
|
||||||
<NavMenu />
|
|
||||||
</div>
|
|
||||||
*@
|
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<!-- header section strats -->
|
<!-- header section strats -->
|
||||||
<header class="header_section">
|
<header class="header_section">
|
||||||
|
|
@ -29,24 +23,21 @@
|
||||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
<div class="d-flex ml-auto flex-column flex-lg-row align-items-center">
|
<div class="d-flex ml-auto flex-column flex-lg-row align-items-center">
|
||||||
<ul class="navbar-nav ">
|
<ul class="navbar-nav ">
|
||||||
<li class="nav-item active">
|
<NavLink class="nav-item" href="" Match="NavLinkMatch.All">
|
||||||
<a class="nav-link" href="/">Home </a>
|
<span class="nav-link">Home</span>
|
||||||
</li>
|
</NavLink>
|
||||||
<li class="nav-item">
|
<NavLink class="nav-item" href="aiart" Match="NavLinkMatch.All">
|
||||||
<a class="nav-link" href="/aiart"> Bilder generieren</a>
|
<span class="nav-link">Bilder generieren</span>
|
||||||
</li>
|
</NavLink>
|
||||||
<li class="nav-item">
|
<NavLink class="nav-item" href="wunschprogramm" Match="NavLinkMatch.All">
|
||||||
<a class="nav-link" href="/wunschprogramm"> Wunschprogramm </a>
|
<span class="nav-link">Wunschprogramm</span>
|
||||||
</li>
|
</NavLink>
|
||||||
<li class="nav-item">
|
<NavLink class="nav-item" href="kirstenkloeckner" Match="NavLinkMatch.All">
|
||||||
<a class="nav-link" href="/kirstenkloeckner"> Über Kirsten Klöckner </a>
|
<span class="nav-link">Über Kirsten Klöckner</span>
|
||||||
</li>
|
</NavLink>
|
||||||
<li class="nav-item">
|
<NavLink class="nav-item" href="gallery" Match="NavLinkMatch.All">
|
||||||
<a class="nav-link" href="/projekt"> Das Projekt </a>
|
<span class="nav-link">Galerier</span>
|
||||||
</li>
|
</NavLink>
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="gallery">Galerie </a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -54,12 +45,12 @@
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
|
||||||
<!-- end header section -->
|
<!-- end header section -->
|
||||||
|
|
||||||
<article class="content px-4">
|
<article class="content px-4">
|
||||||
@Body
|
@Body
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<!-- info section -->
|
<!-- info section -->
|
||||||
|
|
||||||
<section class="info_section layout_padding">
|
<section class="info_section layout_padding">
|
||||||
|
|
@ -129,7 +120,7 @@
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-lg-7 col-md-9 mx-auto">
|
<div class="col-lg-7 col-md-9 mx-auto">
|
||||||
<p>
|
<p>
|
||||||
© 2023 All Rights Reserved By Nackenbox
|
© 2022 All Rights Reserved By Nackenbox GMBH und Co. KG
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue