|
23 | 23 | <section> |
24 | 24 | <div class="k-animation-container k-animation-container-shown"> |
25 | 25 | <div class="k-child-animation-container"> |
26 | | - <div class="k-toolbar-popup k-menu-popup k-popup"> |
| 26 | + <div class="k-menu-popup k-toolbar-popup k-popup"> |
27 | 27 | <ul class="k-menu-group k-menu-group-sm"> |
28 | 28 | <li class="k-menu-item k-item"> |
29 | 29 | <span class="k-link k-menu-link"> |
30 | | - <span class="k-menu-link-text">Normal</span> |
| 30 | + <span class="k-menu-link-text">Item 1</span> |
31 | 31 | </span> |
32 | 32 | </li> |
33 | 33 | <li class="k-menu-item k-item"> |
34 | | - <span class="k-link k-menu-link k-hover"> |
35 | | - <span class="k-menu-link-text">Hover</span> |
36 | | - </span> |
37 | | - </li> |
38 | | - <li class="k-menu-item k-item k-focus"> |
39 | 34 | <span class="k-link k-menu-link"> |
40 | | - <span class="k-menu-link-text">Focus</span> |
| 35 | + <span class="k-menu-link-text">Item 2</span> |
41 | 36 | </span> |
42 | 37 | </li> |
43 | 38 | <li class="k-menu-item k-item"> |
44 | | - <span class="k-link k-menu-link k-active"> |
45 | | - <span class="k-menu-link-text">Active</span> |
46 | | - </span> |
47 | | - </li> |
48 | | - <li class="k-menu-item k-item k-disabled"> |
49 | | - <span class="k-link k-menu-link k-disabled"> |
50 | | - <span class="k-menu-link-text">Disabled</span> |
51 | | - </span> |
52 | | - </li> |
53 | | - <li class="k-menu-item k-item k-focus k-disabled"> |
54 | | - <span class="k-link k-menu-link k-disabled"> |
55 | | - <span class="k-menu-link-text">Disabled focus</span> |
| 39 | + <span class="k-link k-menu-link"> |
| 40 | + <span class="k-menu-link-text">Item 3</span> |
56 | 41 | </span> |
57 | 42 | </li> |
58 | 43 | <li class="k-item k-separator k-separator-horizontal"></li> |
59 | 44 | <li class="k-menu-item k-item"> |
60 | 45 | <span class="k-link k-menu-link"> |
| 46 | + <span class="k-menu-link-icon k-svg-icon k-svg-i-plus"> |
| 47 | + <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> |
| 48 | + <path d="M288 224V96h-64v128H96v64h128v128h64V288h128v-64H288z"></path> |
| 49 | + </svg> |
| 50 | + </span> |
61 | 51 | <span class="k-menu-link-text">Item after separator</span> |
62 | 52 | </span> |
63 | 53 | </li> |
|
69 | 59 | <section> |
70 | 60 | <div class="k-animation-container k-animation-container-shown"> |
71 | 61 | <div class="k-child-animation-container"> |
72 | | - <div class="k-toolbar-popup k-menu-popup k-popup"> |
| 62 | + <div class="k-menu-popup k-toolbar-popup k-popup"> |
73 | 63 | <ul class="k-menu-group k-menu-group-md"> |
74 | 64 | <li class="k-menu-item k-item"> |
75 | 65 | <span class="k-link k-menu-link"> |
76 | | - <span class="k-menu-link-text">Normal</span> |
| 66 | + <span class="k-menu-link-text">Item 1</span> |
77 | 67 | </span> |
78 | 68 | </li> |
79 | 69 | <li class="k-menu-item k-item"> |
80 | | - <span class="k-link k-menu-link k-hover"> |
81 | | - <span class="k-menu-link-text">Hover</span> |
82 | | - </span> |
83 | | - </li> |
84 | | - <li class="k-menu-item k-item k-focus"> |
85 | 70 | <span class="k-link k-menu-link"> |
86 | | - <span class="k-menu-link-text">Focus</span> |
| 71 | + <span class="k-menu-link-text">Item 2</span> |
87 | 72 | </span> |
88 | 73 | </li> |
89 | 74 | <li class="k-menu-item k-item"> |
90 | | - <span class="k-link k-menu-link k-active"> |
91 | | - <span class="k-menu-link-text">Active</span> |
92 | | - </span> |
93 | | - </li> |
94 | | - <li class="k-menu-item k-item k-disabled"> |
95 | | - <span class="k-link k-menu-link k-disabled"> |
96 | | - <span class="k-menu-link-text">Disabled</span> |
97 | | - </span> |
98 | | - </li> |
99 | | - <li class="k-menu-item k-item k-focus k-disabled"> |
100 | | - <span class="k-link k-menu-link k-disabled"> |
101 | | - <span class="k-menu-link-text">Disabled focus</span> |
| 75 | + <span class="k-link k-menu-link"> |
| 76 | + <span class="k-menu-link-text">Item 3</span> |
102 | 77 | </span> |
103 | 78 | </li> |
104 | 79 | <li class="k-item k-separator k-separator-horizontal"></li> |
105 | 80 | <li class="k-menu-item k-item"> |
106 | 81 | <span class="k-link k-menu-link"> |
| 82 | + <span class="k-menu-link-icon k-svg-icon k-svg-i-plus"> |
| 83 | + <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> |
| 84 | + <path d="M288 224V96h-64v128H96v64h128v128h64V288h128v-64H288z"></path> |
| 85 | + </svg> |
| 86 | + </span> |
107 | 87 | <span class="k-menu-link-text">Item after separator</span> |
108 | 88 | </span> |
109 | 89 | </li> |
|
115 | 95 | <section> |
116 | 96 | <div class="k-animation-container k-animation-container-shown"> |
117 | 97 | <div class="k-child-animation-container"> |
118 | | - <div class="k-toolbar-popup k-menu-popup k-popup"> |
| 98 | + <div class="k-menu-popup k-toolbar-popup k-popup"> |
119 | 99 | <ul class="k-menu-group k-menu-group-lg"> |
120 | 100 | <li class="k-menu-item k-item"> |
121 | 101 | <span class="k-link k-menu-link"> |
122 | | - <span class="k-menu-link-text">Normal</span> |
| 102 | + <span class="k-menu-link-text">Item 1</span> |
123 | 103 | </span> |
124 | 104 | </li> |
125 | 105 | <li class="k-menu-item k-item"> |
126 | | - <span class="k-link k-menu-link k-hover"> |
127 | | - <span class="k-menu-link-text">Hover</span> |
128 | | - </span> |
129 | | - </li> |
130 | | - <li class="k-menu-item k-item k-focus"> |
131 | 106 | <span class="k-link k-menu-link"> |
132 | | - <span class="k-menu-link-text">Focus</span> |
| 107 | + <span class="k-menu-link-text">Item 2</span> |
133 | 108 | </span> |
134 | 109 | </li> |
135 | 110 | <li class="k-menu-item k-item"> |
136 | | - <span class="k-link k-menu-link k-active"> |
137 | | - <span class="k-menu-link-text">Active</span> |
138 | | - </span> |
139 | | - </li> |
140 | | - <li class="k-menu-item k-item k-disabled"> |
141 | | - <span class="k-link k-menu-link k-disabled"> |
142 | | - <span class="k-menu-link-text">Disabled</span> |
143 | | - </span> |
144 | | - </li> |
145 | | - <li class="k-menu-item k-item k-focus k-disabled"> |
146 | | - <span class="k-link k-menu-link k-disabled"> |
147 | | - <span class="k-menu-link-text">Disabled focus</span> |
| 111 | + <span class="k-link k-menu-link"> |
| 112 | + <span class="k-menu-link-text">Item 3</span> |
148 | 113 | </span> |
149 | 114 | </li> |
150 | 115 | <li class="k-item k-separator k-separator-horizontal"></li> |
151 | 116 | <li class="k-menu-item k-item"> |
152 | 117 | <span class="k-link k-menu-link"> |
| 118 | + <span class="k-menu-link-icon k-svg-icon k-svg-i-plus"> |
| 119 | + <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> |
| 120 | + <path d="M288 224V96h-64v128H96v64h128v128h64V288h128v-64H288z"></path> |
| 121 | + </svg> |
| 122 | + </span> |
153 | 123 | <span class="k-menu-link-text">Item after separator</span> |
154 | 124 | </span> |
155 | 125 | </li> |
|
0 commit comments