Skip to content

Commit 59dad07

Browse files
Merge pull request SyncfusionExamples#8 from Backiaraj/UG
Prepared UG samples for ASP.NET Core controls
2 parents 3b70009 + 109d140 commit 59dad07

File tree

1,131 files changed

+897097
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

1,131 files changed

+897097
-0
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
2+
3+
<PropertyGroup>
4+
<TargetFramework>net6.0</TargetFramework>
5+
<Nullable>enable</Nullable>
6+
<ImplicitUsings>enable</ImplicitUsings>
7+
</PropertyGroup>
8+
9+
<ItemGroup>
10+
<PackageReference Include="Syncfusion.EJ2.AspNet.Core" Version="20.2.0.40" />
11+
</ItemGroup>
12+
13+
</Project>

Card/CardUGSample/CardUGSample.sln

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
2+
Microsoft Visual Studio Solution File, Format Version 12.00
3+
# Visual Studio Version 17
4+
VisualStudioVersion = 17.0.32112.339
5+
MinimumVisualStudioVersion = 10.0.40219.1
6+
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "CardUGSample", "CardUGSample.csproj", "{CC5413E6-0EF6-4297-98BB-83781C43C5E3}"
7+
EndProject
8+
Global
9+
GlobalSection(SolutionConfigurationPlatforms) = preSolution
10+
Debug|Any CPU = Debug|Any CPU
11+
Release|Any CPU = Release|Any CPU
12+
EndGlobalSection
13+
GlobalSection(ProjectConfigurationPlatforms) = postSolution
14+
{CC5413E6-0EF6-4297-98BB-83781C43C5E3}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
15+
{CC5413E6-0EF6-4297-98BB-83781C43C5E3}.Debug|Any CPU.Build.0 = Debug|Any CPU
16+
{CC5413E6-0EF6-4297-98BB-83781C43C5E3}.Release|Any CPU.ActiveCfg = Release|Any CPU
17+
{CC5413E6-0EF6-4297-98BB-83781C43C5E3}.Release|Any CPU.Build.0 = Release|Any CPU
18+
EndGlobalSection
19+
GlobalSection(SolutionProperties) = preSolution
20+
HideSolutionNode = FALSE
21+
EndGlobalSection
22+
GlobalSection(ExtensibilityGlobals) = postSolution
23+
SolutionGuid = {C3E12445-7EF8-4B8C-9484-ED03E363C380}
24+
EndGlobalSection
25+
EndGlobal
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
@page
2+
@model CardUGSample.Pages.ActionButtonsModel
3+
@{
4+
}
5+
<div class="e-card" style="max-width:400px">
6+
<div class="e-card-header-title">Eiffel Tower</div>
7+
<div class="e-card-content">
8+
The Eiffel Tower is acknowledged as the universal symbol of Paris and France.
9+
</div>
10+
<div class="e-card-actions e-card-vertical">
11+
<button class="e-card-btn">LIKE</button>
12+
<button class="e-card-btn">SHARE</button>
13+
</div>
14+
</div>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.Mvc.RazorPages;
3+
4+
namespace CardUGSample.Pages
5+
{
6+
public class ActionButtonsModel : PageModel
7+
{
8+
public void OnGet()
9+
{
10+
}
11+
}
12+
}
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
@page
2+
@model CardUGSample.Pages.CardContentModel
3+
@{
4+
}
5+
<div tabindex="0" class="e-card">
6+
<div class="e-card-header">
7+
<div class="e-card-header-image football"></div>
8+
<div class="e-card-header-caption">
9+
<div class="e-card-header-title"> Laura Callahan</div>
10+
<div class="e-card-sub-title">Sales Coordinator and Representative</div>
11+
</div>
12+
</div>
13+
<div class="e-card-content">
14+
Laura received a BA in psychology from the University of Washington. She has also completed a course in business French. She reads and writes French.
15+
</div>
16+
</div>
17+
18+
<style>
19+
.e-card .e-card-header .e-card-header-image.football {
20+
background-image: url(@Url.Content("~/css/football.png"));
21+
}
22+
23+
.e-card {
24+
width: 300px
25+
}
26+
</style>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.Mvc.RazorPages;
3+
4+
namespace CardUGSample.Pages
5+
{
6+
public class CardContentModel : PageModel
7+
{
8+
public void OnGet()
9+
{
10+
}
11+
}
12+
}
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
@page
2+
@model CardUGSample.Pages.CardTitleModel
3+
@{
4+
}
5+
<div class="e-card">
6+
<div class="e-card-image">
7+
<div class="e-card-title">JavaScript </div>
8+
</div>
9+
<div class="e-card-content"> JavaScript Succinctly was written to give readers an accurate, concise examination of JavaScript objects and their supporting nuances, such as complex values, primitive values, scope, inheritance, the head object, and more. </div>
10+
</div>
11+
12+
<style>
13+
.e-card-image {
14+
background-image: url(@Url.Content("~/css/football.png"));
15+
height: 160px;
16+
width: 160px;
17+
}
18+
19+
.e-card {
20+
width: 300px;
21+
margin: auto;
22+
}
23+
</style>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.Mvc.RazorPages;
3+
4+
namespace CardUGSample.Pages
5+
{
6+
public class CardTitleModel : PageModel
7+
{
8+
public void OnGet()
9+
{
10+
}
11+
}
12+
}
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
@page
2+
@model CardUGSample.Pages.CustomCardImageTitlepositionModel
3+
@{
4+
var dataSource = new string[] { "bottom-left", "top-left", "top-right", "bottom-right" };
5+
}
6+
<div id="container">
7+
<!--element which is going to render the Card-->
8+
<div class="e-card">
9+
<div class="e-card-image">
10+
<div class="e-card-title">Node.js</div>
11+
</div>
12+
<div class="e-card-content">
13+
Node.js is a wildly popular platform for writing web applications that has revolutionized web development in many ways, enjoying
14+
support across the open source community as well as industry.
15+
</div>
16+
</div>
17+
</div>
18+
19+
<div style="Margin: 5px 0;width:300px">
20+
<ejs-dropdownlist id="title_position" dataSource="@dataSource" placeholder="Select Position" change="changed"></ejs-dropdownlist>
21+
</div>
22+
23+
<style>
24+
.e-card-image {
25+
background-image: url(@Url.Content("~/css/football.png"));
26+
height: 164px;
27+
}
28+
29+
.e-card {
30+
width: 200px;
31+
margin: auto;
32+
}
33+
</style>
34+
35+
<script>
36+
function changed(e) {
37+
let cardEle = document.querySelector('.e-card');
38+
let titleEle = cardEle.querySelector('.e-card-image .e-card-title');
39+
titleEle.className = ''
40+
titleEle.classList.add('e-card-title');
41+
titleEle.classList.add('e-card-' + e.value.toLowerCase());
42+
}
43+
</script>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.Mvc.RazorPages;
3+
4+
namespace CardUGSample.Pages
5+
{
6+
public class CustomCardImageTitlepositionModel : PageModel
7+
{
8+
public void OnGet()
9+
{
10+
}
11+
}
12+
}

0 commit comments

Comments
 (0)