-
Notifications
You must be signed in to change notification settings - Fork 213
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #315 from Blazor-Diagrams/new-site
3.0.0 beta 6
- Loading branch information
Showing
100 changed files
with
5,054 additions
and
126 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| <Router AppAssembly="@typeof(App).Assembly"> | ||
| <Found Context="routeData"> | ||
| <RouteView RouteData="@routeData" DefaultLayout="@typeof(LandingLayout)"/> | ||
| <FocusOnNavigate RouteData="@routeData" Selector="h1"/> | ||
| </Found> | ||
| <NotFound> | ||
| <PageTitle>Not found</PageTitle> | ||
| <LayoutView Layout="@typeof(LandingLayout)"> | ||
| <p role="alert">Sorry, there's nothing at this address.</p> | ||
| </LayoutView> | ||
| </NotFound> | ||
| </Router> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| <div class="diagram-container"> | ||
| <CascadingValue Value="Diagram" IsFixed="true"> | ||
| <DiagramCanvas></DiagramCanvas> | ||
| </CascadingValue> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| using Blazor.Diagrams; | ||
| using Blazor.Diagrams.Core.Anchors; | ||
| using Blazor.Diagrams.Core.Geometry; | ||
| using Blazor.Diagrams.Core.Models; | ||
| using Blazor.Diagrams.Core.PathGenerators; | ||
| using Blazor.Diagrams.Core.Routers; | ||
| using Blazor.Diagrams.Options; | ||
|
|
||
| namespace Site.Components.Documentation; | ||
|
|
||
| public partial class MyDiagram | ||
| { | ||
| private BlazorDiagram Diagram { get; set; } = null!; | ||
|
|
||
| protected override void OnInitialized() | ||
| { | ||
| var options = new BlazorDiagramOptions | ||
| { | ||
| AllowMultiSelection = true, | ||
| Zoom = | ||
| { | ||
| Enabled = false, | ||
| }, | ||
| Links = | ||
| { | ||
| DefaultRouter = new NormalRouter(), | ||
| DefaultPathGenerator = new SmoothPathGenerator() | ||
| }, | ||
| }; | ||
|
|
||
| Diagram = new BlazorDiagram(options); | ||
|
|
||
| var firstNode = Diagram.Nodes.Add(new NodeModel(position: new Point(50, 50)) | ||
| { | ||
| Title = "Node 1" | ||
| }); | ||
| var secondNode = Diagram.Nodes.Add(new NodeModel(position: new Point(200, 100)) | ||
| { | ||
| Title = "Node 2" | ||
| }); | ||
| var leftPort = secondNode.AddPort(PortAlignment.Left); | ||
| var rightPort = secondNode.AddPort(PortAlignment.Right); | ||
|
|
||
| // The connection point will be the intersection of | ||
| // a line going from the target to the center of the source | ||
| var sourceAnchor = new ShapeIntersectionAnchor(firstNode); | ||
| // The connection point will be the port's position | ||
| var targetAnchor = new SinglePortAnchor(leftPort); | ||
| var link = Diagram.Links.Add(new LinkModel(sourceAnchor, targetAnchor)); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| .diagram-container { | ||
| width: 100%; | ||
| height: 400px; | ||
| border: 1px solid black; | ||
| } |
33 changes: 33 additions & 0 deletions
33
site/Site/Components/Documentation/NavigationButtons.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| <div class="mt-10 mb-6 text-slate-700 font-semibold flex items-center"> | ||
|
|
||
| @if (PreviousTitle != null) | ||
| { | ||
| <a href="@PreviousLink" class="bg-gray-700 text-white rounded-l-md border-r border-gray-100 py-2 hover:bg-palette-main hover:text-white px-3"> | ||
| <div class="flex flex-row align-middle"> | ||
| <svg class="w-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> | ||
| <path fill-rule="evenodd" d="M7.707 14.707a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l2.293 2.293a1 1 0 010 1.414z" clip-rule="evenodd"></path> | ||
| </svg> | ||
| <span class="ml-2">@PreviousTitle</span> | ||
| </div> | ||
| </a> | ||
| } | ||
|
|
||
| @if (NextTitle != null) | ||
| { | ||
| <a href="@NextLink" class="ml-auto bg-gray-700 text-white rounded-r-md py-2 border-l border-gray-100 py-2 hover:bg-palette-main hover:text-white px-3"> | ||
| <div class="flex flex-row align-middle"> | ||
| <span class="mr-2">@NextTitle</span> | ||
| <svg class="w-5 ml-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> | ||
| <path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd"></path> | ||
| </svg> | ||
| </div> | ||
| </a> | ||
| } | ||
| </div> | ||
|
|
||
| @code { | ||
| [Parameter] public string? PreviousTitle { get; set; } | ||
| [Parameter] public string? PreviousLink { get; set; } | ||
| [Parameter] public string? NextTitle { get; set; } | ||
| [Parameter] public string? NextLink { get; set; } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| <footer class="bg-white"> | ||
| <div class="container mx-auto px-8"> | ||
| <div class="w-full flex flex-col md:flex-row py-6"> | ||
| <div class="flex-1 mb-6 text-black"> | ||
| <a class="text-pink-600 no-underline hover:no-underline font-bold text-2xl lg:text-4xl" href="#"> | ||
| <!--Icon from: http://www.potlabicons.com/ --> | ||
| <svg class="h-8 fill-current inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.005 512.005"> | ||
| <rect fill="#2a2a31" x="16.539" y="425.626" width="479.767" height="50.502" transform="matrix(1,0,0,1,0,0)" /> | ||
| <path class="plane-take-off" | ||
| d=" M 510.7 189.151 C 505.271 168.95 484.565 156.956 464.365 162.385 L 330.156 198.367 L 155.924 35.878 L 107.19 49.008 L 211.729 230.183 L 86.232 263.767 L 36.614 224.754 L 0 234.603 L 45.957 314.27 L 65.274 347.727 L 105.802 336.869 L 240.011 300.886 L 349.726 271.469 L 483.935 235.486 C 504.134 230.057 516.129 209.352 510.7 189.151 Z " /> | ||
| </svg> | ||
| LANDING | ||
| </a> | ||
| </div> | ||
| <div class="flex-1"> | ||
| <p class="uppercase text-gray-500 md:mb-6">Links</p> | ||
| <ul class="list-reset mb-6"> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">FAQ</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Help</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Support</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="flex-1"> | ||
| <p class="uppercase text-gray-500 md:mb-6">Legal</p> | ||
| <ul class="list-reset mb-6"> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Terms</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Privacy</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="flex-1"> | ||
| <p class="uppercase text-gray-500 md:mb-6">Social</p> | ||
| <ul class="list-reset mb-6"> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Facebook</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Linkedin</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Twitter</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="flex-1"> | ||
| <p class="uppercase text-gray-500 md:mb-6">Company</p> | ||
| <ul class="list-reset mb-6"> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Official Blog</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">About Us</a> | ||
| </li> | ||
| <li class="mt-2 inline-block mr-2 md:block md:mr-0"> | ||
| <a href="#" class="no-underline hover:underline text-gray-800 hover:text-pink-500">Contact</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <a href="https://www.freepik.com/free-photos-vectors/background" class="text-gray-500">Background vector created by freepik - www.freepik.com</a> | ||
| </footer> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| <div class="drop-shadow-lg bg-white border"> | ||
| <div class="bg-main p-2 pr-6 font-semibold text-white uppercase"> | ||
| <svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="inline"> | ||
| <path d="M11.883 3.007 12 3a1 1 0 0 1 .993.883L13 4v7h7a1 1 0 0 1 .993.883L21 12a1 1 0 0 1-.883.993L20 13h-7v7a1 1 0 0 1-.883.993L12 21a1 1 0 0 1-.993-.883L11 20v-7H4a1 1 0 0 1-.993-.883L3 12a1 1 0 0 1 .883-.993L4 11h7V4a1 1 0 0 1 .883-.993L12 3l-.117.007Z" fill="#ffffff"/> | ||
| </svg> | ||
| Add | ||
| </div> | ||
| <div class="py-4 px-8 relative"> | ||
| @Node.Value | ||
| <PortRenderer Port="@Node.Ports[0]" | ||
| Class="rounded-full bg-main p-2 absolute" | ||
| Style="left: -8px; top: 33%; transform: translateY(-50%);"/> | ||
| <PortRenderer Port="@Node.Ports[1]" | ||
| Class="rounded-full bg-main p-2 absolute" | ||
| Style="left: -8px; top: 66%; transform: translateY(-50%);"/> | ||
| <PortRenderer Port="@Node.Ports[2]" | ||
| Class="rounded-full bg-main p-2 absolute" | ||
| Style="right: -8px; top: 50%; transform: translateY(-50%);"/> | ||
| </div> | ||
| </div> | ||
|
|
||
| @code { | ||
|
|
||
| [Parameter] | ||
| public AddNodeModel Node { get; set; } = null!; | ||
|
|
||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| @using System.Text; | ||
| @using Blazor.Diagrams.Extensions; | ||
| @{ | ||
| var borderColor = Node.Selected ? $"outline-{Node.Color}-darker" : $"outline-{Node.Color}"; | ||
| var extraClasses = new StringBuilder().Append($"bg-{Node.Color}").AppendIf(" rounded-full", Node.Round); | ||
| } | ||
|
|
||
| <div class="drop-shadow-lg @borderColor flex items-center justify-center font-bold @extraClasses" style="width: @(Node.Round ? 80 : 120)px; height: @(Node.Round ? 80 : 60)px;"> | ||
| @Node.Title | ||
|
|
||
| @foreach (var port in Node.Ports) | ||
| { | ||
| var classes = new StringBuilder("absolute -translate-y-1/2 ") | ||
| .Append(extraClasses) | ||
| .AppendIf(" top-1/2 -right-3", port.Alignment == PortAlignment.Right) | ||
| .AppendIf(" top-1/2 -left-3", port.Alignment == PortAlignment.Left); | ||
|
|
||
| <PortRenderer Port="port" Class="@classes.ToString()" Style="width: 10px; height: 10px;" /> | ||
| } | ||
| </div> | ||
|
|
||
| @code { | ||
|
|
||
| [Parameter] | ||
| public ColoredNodeModel Node { get; set; } = null!; | ||
|
|
||
| } |
Oops, something went wrong.