Skip to content

Commit 1389800

Browse files
authored
Merge pull request #26005 from abpframework/maliming/replace-owl-carousel-with-swiper
Replace owl.carousel with Swiper
2 parents 7d262a6 + 3e6d0b1 commit 1389800

8 files changed

Lines changed: 189 additions & 44 deletions

File tree

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using System.Collections.Generic;
2+
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
3+
4+
namespace Volo.Abp.AspNetCore.Mvc.UI.Packages.Swiper;
5+
6+
public class SwiperScriptContributor : BundleContributor
7+
{
8+
public override void ConfigureBundle(BundleConfigurationContext context)
9+
{
10+
context.Files.AddIfNotContains("/libs/swiper/swiper-bundle.min.js");
11+
}
12+
}
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using System.Collections.Generic;
2+
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
3+
4+
namespace Volo.Abp.AspNetCore.Mvc.UI.Packages.Swiper;
5+
6+
public class SwiperStyleContributor : BundleContributor
7+
{
8+
public override void ConfigureBundle(BundleConfigurationContext context)
9+
{
10+
context.Files.AddIfNotContains("/libs/swiper/swiper-bundle.min.css");
11+
}
12+
}

modules/blogging/src/Volo.Blogging.Web/Pages/Blogs/Posts/Index.cshtml

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
@page
22
@using Microsoft.AspNetCore.Authorization
33
@using Volo.Blogging.Areas.Blog.Helpers.TagHelpers
4-
@using Volo.Abp.AspNetCore.Mvc.UI.Packages.OwlCarousel
54
@using Volo.Blogging
65
@inject IAuthorizationService Authorization
76
@model IndexModel
@@ -19,13 +18,11 @@
1918
@section scripts {
2019
<abp-script-bundle name="@typeof(IndexModel).FullName">
2120
<abp-script src="/client-proxies/blogging-proxy.js" />
22-
<abp-script type="@typeof(OwlCarouselScriptContributor)" />
2321
<abp-script src="/Pages/Blogs/Shared/Scripts/blog.js" />
2422
</abp-script-bundle>
2523
}
2624
@section styles {
2725
<abp-style-bundle name="@typeof(IndexModel).FullName">
28-
<abp-script type="@typeof(OwlCarouselStyleContributor)" />
2926
<abp-style src="/Pages/Blogs/Shared/Styles/blog.css" />
3027
</abp-style-bundle>
3128
}
Lines changed: 0 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,4 @@
11
(function () {
2-
function handleArrows() {
3-
var herosWidth = $('.hero-articles').width();
4-
var arrowsPosition = herosWidth / 2 - 90;
5-
$('.owl-next').css('right', arrowsPosition);
6-
$('.owl-prev').css('left', arrowsPosition);
7-
}
8-
92
function handleImages() {
103
//if ($(window).width() > 767) {
114
// $(".box-articles .img-container").each(function () {
@@ -18,50 +11,17 @@
1811
//}
1912
}
2013

21-
function handleOwlCarousel() {
22-
$('.hero-section .owl-carousel').owlCarousel({
23-
loop: true,
24-
margin: 0,
25-
nav: false,
26-
dots: false,
27-
//center: true,
28-
autoplay: true,
29-
autoHeight: true,
30-
autoplaySpeed: 1000,
31-
items: 1,
32-
});
33-
$('.card-article-container .owl-carousel').owlCarousel({
34-
loop: true,
35-
margin: 0,
36-
nav: false,
37-
dots: false,
38-
autoplay: true,
39-
autoplaySpeed: 1000,
40-
responsive: {
41-
0: {
42-
items: 1,
43-
},
44-
},
45-
});
46-
}
47-
4814
$(function () {
4915
handleImages();
50-
handleOwlCarousel();
5116

5217
$('.nav-link').on('click', function () {
5318
$(this).parent().parent();
5419
});
5520

5621
$(window).resize(function () {
5722
setTimeout(function () {
58-
handleArrows();
5923
handleImages();
6024
}, 500);
6125
});
62-
63-
setTimeout(function () {
64-
handleArrows();
65-
}, 500);
6626
});
6727
})();

npm/packs/blogging/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66
},
77
"dependencies": {
88
"@abp/aspnetcore.mvc.ui.theme.shared": "~10.7.0-rc.3",
9-
"@abp/owl.carousel": "~10.7.0-rc.3",
109
"@abp/prismjs": "~10.7.0-rc.3",
1110
"@abp/tui-editor": "~10.7.0-rc.3"
1211
},

npm/packs/swiper/README.md

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
## ℹ️ Description
2+
3+
ABP Framework is a complete open-source infrastructure to create modern web applications by following the best practices and conventions of software development. This package is a part of the [ABP Framework](https://abp.io) and contains client-side files.
4+
For more information, check out the below links:
5+
6+
🔗Official Website: https://abp.io
7+
8+
🔗Commercial Website: https://commercial.abp.io
9+
10+
🔗Commercial Demo: https://commercial.abp.io/demo
11+
12+
🔗GitHub Repository: https://github.com/abpframework/abp
13+
14+
🔗Official Theme: https://www.LeptonTheme.com
15+
16+
🔗Documentation: https://docs.abp.io
17+
18+
🔗Community: https://community.abp.io
19+
20+
🔗Blog: https://blog.abp.io
21+
22+
🔗Books: https://abp.io/books
23+
24+
🔗Twitter: https://twitter.com/abpframework
25+
26+
🔗Discord: https://community.abp.io/discord
27+
28+
🔗Stackoverflow: https://stackoverflow.com/questions/tagged/abp
29+
30+
🔗YouTube: https://www.youtube.com/@Volosoft
31+
32+
33+
## 🤔 Why ABP Platform?
34+
35+
Why should you use the ABP.IO Platform instead of creating a new solution from scratch?
36+
37+
You can find the answer here 👉🏻 [Why ABP Platform?](https://docs.abp.io/en/commercial/latest/why-abp-io-platform)
38+
39+
## 🚀 Key Features of the ABP Framework
40+
41+
🟡 Modularity
42+
43+
🟡 Multi-Tenancy
44+
45+
🟡 Bootstrap Tag Helpers
46+
47+
🟡 Dynamic Forms
48+
49+
🟡 Authentication
50+
51+
🟡 Authorization
52+
53+
🟡 Distributed Event Bus
54+
55+
🟡 BLOB Storing
56+
57+
🟡 Text Templating
58+
59+
🟡 Tooling: ABP CLI
60+
61+
🟡 Cross-Cutting Concerns
62+
63+
🟡 Bundling & Minification
64+
65+
🟡 Virtual File System
66+
67+
🟡 Theming
68+
69+
🟡 Background Jobs
70+
71+
🟡 DDD Infrastructure
72+
73+
🟡 Auto REST APIs
74+
75+
🟡 Dynamic Client Proxies
76+
77+
🟡 Multiple Database Providers
78+
79+
🟡 Data filtering
80+
81+
🟡 Test Infrastructure
82+
83+
🟡 Audit Logging
84+
85+
🟡 Object to Object Mapping
86+
87+
🟡 Email & SMS Abstractions
88+
89+
🟡 Localization
90+
91+
🟡 Setting Management
92+
93+
🟡 Extension Methods
94+
95+
🟡 Aspect Oriented Programming
96+
97+
🟡 Dependency Injection
98+
99+
100+
## 🧐 How It Works?
101+
102+
The following page explains how you use the ABP.IO Platform as a .NET developer 👉 [How it works?](https://commercial.abp.io/how-it-works)
103+
104+
105+
### 📘 Supported Database Providers
106+
107+
🔵 Entity Framework Core
108+
109+
🔵 MongoDB
110+
111+
🔵 Dapper
112+
113+
114+
### 🎴 Supported UI Frameworks
115+
116+
🔵 Angular
117+
118+
🔵 Razor Pages
119+
120+
🔵 Blazor Web Assembly
121+
122+
🔵 Blazor Server
123+
124+
🔵 MAUI with Blazor Hybrid
125+
126+
127+
## 📫 Bug & Support
128+
129+
Support for open-source ABP Framework client-side packages is available at [GitHub Issues](https://github.com/abpframework/abp/issues), and the commercial support is available at [support.abp.io](https://support.abp.io).
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
mappings: {
3+
"@node_modules/swiper/swiper-bundle.min.js*": "@libs/swiper/",
4+
"@node_modules/swiper/swiper-bundle.min.css": "@libs/swiper/"
5+
}
6+
}

npm/packs/swiper/package.json

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{
2+
"version": "10.7.0-rc.3",
3+
"name": "@abp/swiper",
4+
"publishConfig": {
5+
"access": "public"
6+
},
7+
"dependencies": {
8+
"swiper": "^14.1.0"
9+
},
10+
"gitHead": "bb4ea17d5996f01889134c138d00b6c8f858a431",
11+
"homepage": "https://abp.io",
12+
"repository": {
13+
"type": "git",
14+
"url": "https://github.com/abpframework/abp.git"
15+
},
16+
"license": "LGPL-3.0",
17+
"keywords": [
18+
"aspnetcore",
19+
"boilerplate",
20+
"framework",
21+
"web",
22+
"best-practices",
23+
"angular",
24+
"maui",
25+
"blazor",
26+
"mvc",
27+
"csharp",
28+
"webapp"
29+
]
30+
}

0 commit comments

Comments
 (0)