Skip to content

Commit 86f8bba

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent 1254d9d commit 86f8bba

21 files changed

+584
-1
lines changed

docs/_config.yml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2049,7 +2049,6 @@ intro_columns:
20492049
-
20502050
title: "Navigation"
20512051
items:
2052-
"AppBar": "overview_kendoui_appbar_widget"
20532052
"Breadcrumb": "overview_kendoui_breadcrumb_widget"
20542053
"Button": "overview_kendoui_button_widget"
20552054
"ButtonGroup": "overview_kendoui_buttongroup_widget"
Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
.k-imageeditor {
2+
margin: @imageeditor-margin-y @imageeditor-margin-x;
3+
padding: @imageeditor-padding-y @imageeditor-padding-x;
4+
border-width: @imageeditor-border-width;
5+
border-style: solid;
6+
box-sizing: border-box;
7+
outline: 0;
8+
font-family: @imageeditor-font-family;
9+
font-size: @imageeditor-font-size;
10+
line-height: @imageeditor-line-height;
11+
-webkit-touch-callout: none;
12+
-webkit-tap-highlight-color: rgba( 0, 0, 0, 0 );
13+
}
14+
15+
// Content
16+
.k-imageeditor-content {
17+
display: flex;
18+
flex-direction: row;
19+
flex-wrap: nowrap;
20+
}
21+
22+
// Canvas
23+
.k-imageeditor-canvas-container {
24+
flex: 1 1 100%;
25+
display: flex;
26+
flex-direction: row;
27+
flex-wrap: nowrap;
28+
overflow: auto;
29+
}
30+
31+
.k-imageeditor-canvas {
32+
margin: auto;
33+
display: flex;
34+
flex-direction: column;
35+
position: relative;
36+
}
37+
38+
// Action Pane
39+
.k-imageeditor-action-pane {
40+
border-width: @imageeditor-content-border-width;
41+
border-top-width: 0;
42+
border-style: solid;
43+
flex-shrink: 0;
44+
overflow-y: auto;
45+
}
46+
.k-imageeditor-action-pane > .k-form {
47+
padding: 0 @imageeditor-action-pane-padding-x @imageeditor-action-pane-padding-y @imageeditor-action-pane-padding-x;
48+
}
49+
50+
// Crop Tool
51+
.k-imageeditor-crop-overlay {
52+
width: 100%;
53+
height: 100%;
54+
position: absolute;
55+
top: 0;
56+
left: 0;
57+
}
58+
59+
.k-imageeditor-crop {
60+
width: 100%;
61+
height: 100%;
62+
border-width: @imageeditor-crop-border-width;
63+
border-style: @imageeditor-crop-border-style;
64+
box-sizing: border-box;
65+
position: absolute;
66+
67+
.k-resize-handle {
68+
margin: @imageeditor-resize-handle-margin-y @imageeditor-resize-handle-margin-x;
69+
border-style: solid;
70+
border-width: @imageeditor-resize-handle-border-width;
71+
}
72+
73+
.k-resize-sw,
74+
.k-resize-se,
75+
.k-resize-nw,
76+
.k-resize-ne {
77+
width: @imageeditor-resize-handle-size;
78+
height: @imageeditor-resize-handle-size;
79+
}
80+
81+
.k-resize-n,
82+
.k-resize-s {
83+
left: calc( 50% - (@imageeditor-resize-handle-size / 2) );
84+
width: @imageeditor-resize-handle-size;
85+
height: 0;
86+
}
87+
88+
.k-resize-w,
89+
.k-resize-e {
90+
top: calc( 50% - (@imageeditor-resize-handle-size / 2) );
91+
width: 0;
92+
height: @imageeditor-resize-handle-size;
93+
}
94+
95+
.k-resize-ne {
96+
transform: rotate(-90deg);
97+
}
98+
99+
.k-resize-nw {
100+
transform: rotate(-180deg);
101+
}
102+
103+
104+
.k-resize-sw {
105+
transform: rotate(90deg);
106+
}
107+
108+
.k-resize-n,
109+
.k-resize-nw,
110+
.k-resize-ne {
111+
top: 0;
112+
}
113+
114+
.k-resize-s,
115+
.k-resize-sw,
116+
.k-resize-se {
117+
bottom: 0;
118+
}
119+
120+
.k-resize-w,
121+
.k-resize-nw,
122+
.k-resize-sw {
123+
left: 0;
124+
}
125+
126+
.k-resize-e,
127+
.k-resize-ne,
128+
.k-resize-se {
129+
right: 0;
130+
}
131+
}
132+
133+
// IE
134+
.k-ie {
135+
.k-imageeditor-canvas {
136+
flex-direction: row;
137+
align-self: flex-start;
138+
}
139+
140+
.k-imageeditor-action-pane {
141+
min-width: 200px;
142+
flex: 0 0 auto;
143+
}
144+
}
Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
// Image Editor
2+
.k-imageeditor {
3+
.fill(
4+
@imageeditor-text,
5+
@imageeditor-bg,
6+
@imageeditor-border
7+
);
8+
}
9+
10+
// Content
11+
.k-imageeditor-content {
12+
.fill(
13+
@imageeditor-content-text,
14+
@imageeditor-content-bg,
15+
@imageeditor-content-border
16+
);
17+
}
18+
19+
// Canvas
20+
.k-imageeditor-canvas {
21+
.checkerboard-gradient()
22+
}
23+
24+
// Action Pane
25+
.k-imageeditor-action-pane {
26+
.fill(
27+
@imageeditor-action-pane-text,
28+
@imageeditor-action-pane-bg,
29+
@imageeditor-action-pane-border
30+
);
31+
}
32+
33+
// Crop Tool
34+
.k-imageeditor-crop {
35+
.fill(
36+
@imageeditor-crop-text,
37+
@imageeditor-crop-bg,
38+
@imageeditor-crop-border
39+
);
40+
}
41+
42+
// Resize Handle
43+
.k-imageeditor-crop .k-resize-handle {
44+
.fill(
45+
@imageeditor-resize-handle-text,
46+
@imageeditor-resize-handle-bg,
47+
@imageeditor-resize-handle-border
48+
);
49+
}

styles/web/common/all.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@
6565
@import "editor.less";
6666
@import "../Default/appbar/_layout.less";
6767
@import "../Default/loader/_layout.less";
68+
@import "../Default/imageeditor/_layout.less";
6869

6970

7071
// Default fonts for PDF export

styles/web/common/grid.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -419,6 +419,7 @@ form.k-filter-menu .k-textbox
419419
margin-bottom: 3px;
420420
}
421421

422+
.k-column-menu,
422423
.k-filter-menu {
423424
font-size: 14px;
424425
}

styles/web/kendo.common-bootstrap.less

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -737,6 +737,33 @@
737737
@gantt-planned-duration-height: @gantt-planned-border-width;
738738
@gantt-planned-duration-hover-height: calc( @gantt-planned-border-width + 1px );
739739

740+
// ImageEditor
741+
@imageeditor-spacer: 8px;
742+
743+
@imageeditor-margin-y: 0px;
744+
@imageeditor-margin-x: 0px;
745+
@imageeditor-padding-y: 0px;
746+
@imageeditor-padding-x: 0px;
747+
748+
@imageeditor-border-width: 0px;
749+
@imageeditor-font-size: inherit;
750+
@imageeditor-line-height: @line-height;
751+
@imageeditor-font-family: inherit;
752+
753+
@imageeditor-content-border-width: 1px;
754+
755+
@imageeditor-action-pane-padding-y: calc( @imageeditor-spacer * 4 );
756+
@imageeditor-action-pane-padding-x: calc( @imageeditor-spacer * 2 );
757+
758+
@imageeditor-crop-border-width: 1px;
759+
@imageeditor-crop-border-style: dashed;
760+
761+
@imageeditor-resize-handle-margin-x: 1px;
762+
@imageeditor-resize-handle-margin-y: 1px;
763+
@imageeditor-resize-handle-border-width: 0px 2px 2px 0px;
764+
@imageeditor-resize-handle-size: 15px;
765+
766+
740767
@import "common/all.less";
741768

742769
.k-widget.k-tabstrip

styles/web/kendo.common-fiori.less

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -737,6 +737,33 @@
737737
@gantt-planned-duration-hover-height: calc( @gantt-planned-border-width + 1px );
738738

739739

740+
// ImageEditor
741+
@imageeditor-spacer: 8px;
742+
743+
@imageeditor-margin-y: 0px;
744+
@imageeditor-margin-x: 0px;
745+
@imageeditor-padding-y: 0px;
746+
@imageeditor-padding-x: 0px;
747+
748+
@imageeditor-border-width: 0px;
749+
@imageeditor-font-size: inherit;
750+
@imageeditor-line-height: @line-height;
751+
@imageeditor-font-family: inherit;
752+
753+
@imageeditor-content-border-width: 1px;
754+
755+
@imageeditor-action-pane-padding-y: calc( @imageeditor-spacer * 4 );
756+
@imageeditor-action-pane-padding-x: calc( @imageeditor-spacer * 2 );
757+
758+
@imageeditor-crop-border-width: 1px;
759+
@imageeditor-crop-border-style: dashed;
760+
761+
@imageeditor-resize-handle-margin-x: 1px;
762+
@imageeditor-resize-handle-margin-y: 1px;
763+
@imageeditor-resize-handle-border-width: 0px 2px 2px 0px;
764+
@imageeditor-resize-handle-size: 15px;
765+
766+
740767
@import "common/all.less";
741768

742769
.k-textbox > input,

styles/web/kendo.common-material.less

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -738,6 +738,33 @@
738738
@gantt-planned-duration-hover-height: calc( @gantt-planned-border-width + 1px );
739739

740740

741+
// ImageEditor
742+
@imageeditor-spacer: 8px;
743+
744+
@imageeditor-margin-y: 0px;
745+
@imageeditor-margin-x: 0px;
746+
@imageeditor-padding-y: 0px;
747+
@imageeditor-padding-x: 0px;
748+
749+
@imageeditor-border-width: 0px;
750+
@imageeditor-font-size: inherit;
751+
@imageeditor-line-height: @line-height;
752+
@imageeditor-font-family: inherit;
753+
754+
@imageeditor-content-border-width: 1px;
755+
756+
@imageeditor-action-pane-padding-y: calc( @imageeditor-spacer * 4 );
757+
@imageeditor-action-pane-padding-x: calc( @imageeditor-spacer * 2 );
758+
759+
@imageeditor-crop-border-width: 1px;
760+
@imageeditor-crop-border-style: dashed;
761+
762+
@imageeditor-resize-handle-margin-x: 1px;
763+
@imageeditor-resize-handle-margin-y: 1px;
764+
@imageeditor-resize-handle-border-width: 0px 2px 2px 0px;
765+
@imageeditor-resize-handle-size: 15px;
766+
767+
741768
@import "common/all.less";
742769

743770
@spreadsheet-first-tool-offset: 0;

styles/web/kendo.common-nova.less

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -746,6 +746,33 @@
746746
@gantt-planned-duration-hover-height: calc( @gantt-planned-border-width + 1px );
747747

748748

749+
// ImageEditor
750+
@imageeditor-spacer: 8px;
751+
752+
@imageeditor-margin-y: 0px;
753+
@imageeditor-margin-x: 0px;
754+
@imageeditor-padding-y: 0px;
755+
@imageeditor-padding-x: 0px;
756+
757+
@imageeditor-border-width: 0px;
758+
@imageeditor-font-size: inherit;
759+
@imageeditor-line-height: @line-height;
760+
@imageeditor-font-family: inherit;
761+
762+
@imageeditor-content-border-width: 1px;
763+
764+
@imageeditor-action-pane-padding-y: calc( @imageeditor-spacer * 4 );
765+
@imageeditor-action-pane-padding-x: calc( @imageeditor-spacer * 2 );
766+
767+
@imageeditor-crop-border-width: 1px;
768+
@imageeditor-crop-border-style: dashed;
769+
770+
@imageeditor-resize-handle-margin-x: 1px;
771+
@imageeditor-resize-handle-margin-y: 1px;
772+
@imageeditor-resize-handle-border-width: 0px 2px 2px 0px;
773+
@imageeditor-resize-handle-size: 15px;
774+
775+
749776
@import "common/all.less";
750777

751778
.k-button {

styles/web/kendo.common-office365.less

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -735,6 +735,33 @@
735735
@gantt-planned-duration-hover-height: calc( @gantt-planned-border-width + 1px );
736736

737737

738+
// ImageEditor
739+
@imageeditor-spacer: 8px;
740+
741+
@imageeditor-margin-y: 0px;
742+
@imageeditor-margin-x: 0px;
743+
@imageeditor-padding-y: 0px;
744+
@imageeditor-padding-x: 0px;
745+
746+
@imageeditor-border-width: 0px;
747+
@imageeditor-font-size: inherit;
748+
@imageeditor-line-height: @line-height;
749+
@imageeditor-font-family: inherit;
750+
751+
@imageeditor-content-border-width: 1px;
752+
753+
@imageeditor-action-pane-padding-y: calc( @imageeditor-spacer * 4 );
754+
@imageeditor-action-pane-padding-x: calc( @imageeditor-spacer * 2 );
755+
756+
@imageeditor-crop-border-width: 1px;
757+
@imageeditor-crop-border-style: dashed;
758+
759+
@imageeditor-resize-handle-margin-x: 1px;
760+
@imageeditor-resize-handle-margin-y: 1px;
761+
@imageeditor-resize-handle-border-width: 0px 2px 2px 0px;
762+
@imageeditor-resize-handle-size: 15px;
763+
764+
738765
@import "common/all.less";
739766

740767
.k-grid .k-header,

0 commit comments

Comments
 (0)