Skip to content

Commit ef81988

Browse files
GoodDayForSurfGoodDayForSurf
committed
Merge branch '25_1' of https://github.com/DevExpress/DevExtreme into 25_1_demos_vue_ts_in_tpl
2 parents 3bf2c40 + 826bb83 commit ef81988

219 files changed

Lines changed: 4330 additions & 3265 deletions

File tree

Some content is hidden

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

‎.github/workflows/packages_publishing.yml‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -113,12 +113,6 @@ jobs:
113113
steps:
114114
- name: Get sources
115115
uses: actions/checkout@v4
116-
with:
117-
sparse-checkout: |
118-
/tools
119-
/packages/devextreme-monorepo-tools
120-
package.json
121-
sparse-checkout-cone-mode: false
122116

123117
- name: Download artifacts
124118
uses: actions/download-artifact@v4

‎apps/demos/Demos/ColorBox/Overview/Angular/app/app.component.css‎

Lines changed: 14 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
.color-block {
1414
width: 360px;
1515
height: 254px;
16-
background-color: #f05b41;
1716
position: relative;
1817
}
1918

@@ -24,7 +23,8 @@
2423
top: 110px;
2524
}
2625

27-
.color-block .superhero {
26+
.superhero,
27+
.brush {
2828
position: absolute;
2929
height: 100%;
3030
width: 100%;
@@ -34,34 +34,26 @@
3434
position: relative;
3535
}
3636

37-
.superhero {
38-
background-image: url("../../../../images/hero_white.png");
39-
}
40-
41-
::ng-deep .dx-color-scheme-dark .superhero {
42-
background-image: url("../../../../images/hero_black.png");
43-
}
44-
45-
::ng-deep .dx-color-scheme-darkmoon .superhero {
46-
background-image: url("../../../../images/hero_darkmoon.png");
47-
}
48-
49-
::ng-deep .dx-color-scheme-darkviolet .superhero {
50-
background-image: url("../../../../images/hero_darkviolet.png");
37+
.brush {
38+
color: #f05b41;
5139
}
5240

41+
.superhero,
5342
::ng-deep .dx-color-scheme-greenmist .superhero {
54-
background-image: url("../../../../images/hero_greenmist.png");
55-
}
56-
57-
::ng-deep .dx-color-scheme-contrast .superhero {
58-
background-image: url("../../../../images/hero_contrast.png");
43+
color: #404041;
5944
}
6045

46+
::ng-deep .dx-color-scheme-dark .superhero,
47+
::ng-deep .dx-color-scheme-darkmoon .superhero,
48+
::ng-deep .dx-color-scheme-darkviolet .superhero,
6149
::ng-deep .dx-color-scheme-blue-dark .superhero,
6250
::ng-deep .dx-color-scheme-orange-dark .superhero,
6351
::ng-deep .dx-color-scheme-teal-dark .superhero,
6452
::ng-deep .dx-color-scheme-lime-dark .superhero,
6553
::ng-deep .dx-color-scheme-purple-dark .superhero {
66-
background-image: url("../../../../images/hero_material_dark.png");
54+
color: #a8a8a8;
55+
}
56+
57+
::ng-deep .dx-color-scheme-contrast .superhero {
58+
color: #fff;
6759
}

‎apps/demos/Demos/ColorBox/Overview/Angular/app/app.component.html‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,8 +54,18 @@
5454
<div class="dx-fieldset">
5555
<div class="dx-fieldset-header">Event Handling</div>
5656
<div class="hero-block">
57-
<div class="color-block" [style.background-color]="currentColor">
58-
<div class="superhero"></div>
57+
<div class="color-block">
58+
<svg
59+
class="brush"
60+
width="360"
61+
height="254"
62+
[style.color]="currentColor"
63+
>
64+
<use href="../../../../images/Brush.svg#brush"></use>
65+
</svg>
66+
<svg class="superhero" width="360" height="254">
67+
<use href="../../../../images/Hero.svg#hero"></use>
68+
</svg>
5969
</div>
6070
<div class="hero-color-box">
6171
<dx-color-box

‎apps/demos/Demos/ColorBox/Overview/React/App.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -72,11 +72,13 @@ function App() {
7272
<div className="dx-fieldset">
7373
<div className="dx-fieldset-header">Event Handling</div>
7474
<div className="hero-block">
75-
<div
76-
className="color-block"
77-
style={{ backgroundColor: color }}
78-
>
79-
<div className="superhero"></div>
75+
<div className="color-block">
76+
<svg className="brush" width="360" height="254" style={{ color }}>
77+
<use href="../../../../images/Brush.svg#brush"></use>
78+
</svg>
79+
<svg className="superhero" width="360" height="254">
80+
<use href="../../../../images/Hero.svg#hero"></use>
81+
</svg>
8082
</div>
8183
<div className="hero-color-box">
8284
<ColorBox

‎apps/demos/Demos/ColorBox/Overview/React/styles.css‎

Lines changed: 14 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
.color-block {
1414
width: 360px;
1515
height: 254px;
16-
background-color: #f05b41;
1716
position: relative;
1817
}
1918

@@ -24,7 +23,8 @@
2423
top: 110px;
2524
}
2625

27-
.color-block .superhero {
26+
.superhero,
27+
.brush {
2828
position: absolute;
2929
height: 100%;
3030
width: 100%;
@@ -34,34 +34,26 @@
3434
position: relative;
3535
}
3636

37-
.superhero {
38-
background-image: url("../../../../images/hero_white.png");
39-
}
40-
41-
.dx-color-scheme-dark .superhero {
42-
background-image: url("../../../../images/hero_black.png");
43-
}
44-
45-
.dx-color-scheme-darkmoon .superhero {
46-
background-image: url("../../../../images/hero_darkmoon.png");
47-
}
48-
49-
.dx-color-scheme-darkviolet .superhero {
50-
background-image: url("../../../../images/hero_darkviolet.png");
37+
.brush {
38+
color: #f05b41;
5139
}
5240

41+
.superhero,
5342
.dx-color-scheme-greenmist .superhero {
54-
background-image: url("../../../../images/hero_greenmist.png");
55-
}
56-
57-
.dx-color-scheme-contrast .superhero {
58-
background-image: url("../../../../images/hero_contrast.png");
43+
color: #404041;
5944
}
6045

46+
.dx-color-scheme-dark .superhero,
47+
.dx-color-scheme-darkmoon .superhero,
48+
.dx-color-scheme-darkviolet .superhero,
6149
.dx-color-scheme-blue-dark .superhero,
6250
.dx-color-scheme-orange-dark .superhero,
6351
.dx-color-scheme-teal-dark .superhero,
6452
.dx-color-scheme-lime-dark .superhero,
6553
.dx-color-scheme-purple-dark .superhero {
66-
background-image: url("../../../../images/hero_material_dark.png");
54+
color: #a8a8a8;
55+
}
56+
57+
.dx-color-scheme-contrast .superhero {
58+
color: #fff;
6759
}

‎apps/demos/Demos/ColorBox/Overview/ReactJs/App.js‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -69,11 +69,22 @@ function App() {
6969
<div className="dx-fieldset">
7070
<div className="dx-fieldset-header">Event Handling</div>
7171
<div className="hero-block">
72-
<div
73-
className="color-block"
74-
style={{ backgroundColor: color }}
75-
>
76-
<div className="superhero"></div>
72+
<div className="color-block">
73+
<svg
74+
className="brush"
75+
width="360"
76+
height="254"
77+
style={{ color }}
78+
>
79+
<use href="../../../../images/Brush.svg#brush"></use>
80+
</svg>
81+
<svg
82+
className="superhero"
83+
width="360"
84+
height="254"
85+
>
86+
<use href="../../../../images/Hero.svg#hero"></use>
87+
</svg>
7788
</div>
7889
<div className="hero-color-box">
7990
<ColorBox

‎apps/demos/Demos/ColorBox/Overview/ReactJs/styles.css‎

Lines changed: 14 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
.color-block {
1414
width: 360px;
1515
height: 254px;
16-
background-color: #f05b41;
1716
position: relative;
1817
}
1918

@@ -24,7 +23,8 @@
2423
top: 110px;
2524
}
2625

27-
.color-block .superhero {
26+
.superhero,
27+
.brush {
2828
position: absolute;
2929
height: 100%;
3030
width: 100%;
@@ -34,34 +34,26 @@
3434
position: relative;
3535
}
3636

37-
.superhero {
38-
background-image: url("../../../../images/hero_white.png");
39-
}
40-
41-
.dx-color-scheme-dark .superhero {
42-
background-image: url("../../../../images/hero_black.png");
43-
}
44-
45-
.dx-color-scheme-darkmoon .superhero {
46-
background-image: url("../../../../images/hero_darkmoon.png");
47-
}
48-
49-
.dx-color-scheme-darkviolet .superhero {
50-
background-image: url("../../../../images/hero_darkviolet.png");
37+
.brush {
38+
color: #f05b41;
5139
}
5240

41+
.superhero,
5342
.dx-color-scheme-greenmist .superhero {
54-
background-image: url("../../../../images/hero_greenmist.png");
55-
}
56-
57-
.dx-color-scheme-contrast .superhero {
58-
background-image: url("../../../../images/hero_contrast.png");
43+
color: #404041;
5944
}
6045

46+
.dx-color-scheme-dark .superhero,
47+
.dx-color-scheme-darkmoon .superhero,
48+
.dx-color-scheme-darkviolet .superhero,
6149
.dx-color-scheme-blue-dark .superhero,
6250
.dx-color-scheme-orange-dark .superhero,
6351
.dx-color-scheme-teal-dark .superhero,
6452
.dx-color-scheme-lime-dark .superhero,
6553
.dx-color-scheme-purple-dark .superhero {
66-
background-image: url("../../../../images/hero_material_dark.png");
54+
color: #a8a8a8;
55+
}
56+
57+
.dx-color-scheme-contrast .superhero {
58+
color: #fff;
6759
}

‎apps/demos/Demos/ColorBox/Overview/Vue/App.vue‎

Lines changed: 21 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -55,11 +55,13 @@
5555
<div class="dx-fieldset">
5656
<div class="dx-fieldset-header">Event Handling</div>
5757
<div class="hero-block">
58-
<div
59-
:style="{ backgroundColor: color }"
60-
class="color-block"
61-
>
62-
<div class="superhero"/>
58+
<div class="color-block">
59+
<svg class="brush" width="360" height="254" :style="{ color }">
60+
<use :href='"../../../../images/Brush.svg#brush"'></use>
61+
</svg>
62+
<svg class="superhero" width="360" height="254">
63+
<use :href='"../../../../images/Hero.svg#hero"'></use>
64+
</svg>
6365
</div>
6466
<div class="hero-color-box">
6567
<DxColorBox
@@ -101,7 +103,6 @@ const eventHandlingLabel = { 'aria-label': 'Event Handling' };
101103
.color-block {
102104
width: 360px;
103105
height: 254px;
104-
background-color: #f05b41;
105106
position: relative;
106107
}
107108
@@ -112,7 +113,8 @@ const eventHandlingLabel = { 'aria-label': 'Event Handling' };
112113
top: 110px;
113114
}
114115
115-
.color-block .superhero {
116+
.superhero,
117+
.brush {
116118
position: absolute;
117119
height: 100%;
118120
width: 100%;
@@ -122,35 +124,27 @@ const eventHandlingLabel = { 'aria-label': 'Event Handling' };
122124
position: relative;
123125
}
124126
125-
.superhero {
126-
background-image: url("../../../../images/hero_white.png");
127-
}
128-
129-
.dx-color-scheme-dark .superhero {
130-
background-image: url("../../../../images/hero_black.png");
131-
}
132-
133-
.dx-color-scheme-darkmoon .superhero {
134-
background-image: url("../../../../images/hero_darkmoon.png");
135-
}
136-
137-
.dx-color-scheme-darkviolet .superhero {
138-
background-image: url("../../../../images/hero_darkviolet.png");
127+
.brush {
128+
color: #f05b41;
139129
}
140130
131+
.superhero,
141132
.dx-color-scheme-greenmist .superhero {
142-
background-image: url("../../../../images/hero_greenmist.png");
143-
}
144-
145-
.dx-color-scheme-contrast .superhero {
146-
background-image: url("../../../../images/hero_contrast.png");
133+
color: #404041;
147134
}
148135
136+
.dx-color-scheme-dark .superhero,
137+
.dx-color-scheme-darkmoon .superhero,
138+
.dx-color-scheme-darkviolet .superhero,
149139
.dx-color-scheme-blue-dark .superhero,
150140
.dx-color-scheme-orange-dark .superhero,
151141
.dx-color-scheme-teal-dark .superhero,
152142
.dx-color-scheme-lime-dark .superhero,
153143
.dx-color-scheme-purple-dark .superhero {
154-
background-image: url("../../../../images/hero_material_dark.png");
144+
color: #a8a8a8;
145+
}
146+
147+
.dx-color-scheme-contrast .superhero {
148+
color: #fff;
155149
}
156150
</style>

‎apps/demos/Demos/ColorBox/Overview/jQuery/index.html‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,12 @@
5050
<div class="dx-fieldset-header">Event Handling</div>
5151
<div class="hero-block">
5252
<div class="color-block">
53-
<div class="superhero"></div>
53+
<svg class="brush" width="360" height="254">
54+
<use href="../../../../images/Brush.svg#brush"></use>
55+
</svg>
56+
<svg class="superhero" width="360" height="254">
57+
<use href="../../../../images/Hero.svg#hero"></use>
58+
</svg>
5459
</div>
5560
<div class="hero-color-box">
5661
<div id="color-box-with-change-value"></div>

‎apps/demos/Demos/ColorBox/Overview/jQuery/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,10 +46,10 @@ $(() => {
4646
'aria-label': 'Event Handling',
4747
},
4848
onValueChanged(e) {
49-
$('.color-block').css('background-color', e.component.option('value'));
49+
$('.brush').css('color', e.component.option('value'));
5050
},
5151
onInput(e) {
52-
$('.color-block').css('background-color', e.event.target.value);
52+
$('.brush').css('color', e.event.target.value);
5353
},
5454
});
5555
});

0 commit comments

Comments
 (0)