You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: pages/classNames.html
+13-12Lines changed: 13 additions & 12 deletions
Original file line number
Diff line number
Diff line change
@@ -1,28 +1,29 @@
1
-
<p>The following CSS class names used by jQuery UI are designed to achieve visual consistency across an application and allow components to be themeable by <ahref="http://jqueryui.com/themeroller/">jQuery UI ThemeRoller.</a> The class names are split between ui.core.css and ui.theme.css, depending on whether styles are fixed and structural, or themeable (colors, fonts, backgrounds, etc) respectively.</p>
1
+
<script>{
2
+
"title": "Class Names"
3
+
}</script>
4
+
5
+
<p>The following is a list of the CSS class names used by jQuery UI. They are designed to achieve visual consistency across an application and allow components to be themeable by <ahref="http://jqueryui.com/themeroller/">jQuery UI ThemeRoller.</a> The class names are split between ui.core.css and ui.theme.css, depending on whether styles are fixed and structural, or themeable (colors, fonts, backgrounds, etc) respectively.</p>
2
6
3
7
<h3>Layout Helpers</h3>
4
8
<ul>
5
9
<li>
6
-
<code>.ui-helper-hidden</code>: Applies display: none to elements.
10
+
<code>.ui-helper-hidden</code>: Hides content visually and from assistive technologies, such as screen readers.
7
11
</li>
8
12
<li>
9
-
<code>.ui-helper-hidden-accessible</code>: Applies accessible hiding to elements (via absolute positioning off the page).
13
+
<code>.ui-helper-hidden-accessible</code>: Hides content visually, but leaves it available to assistive technologies.
10
14
</li>
11
15
<li>
12
-
<code>.ui-helper-reset</code>: A basic style reset for UI elements. Resets things such as padding, margins, text-decoration, list-style, etc.
16
+
<code>.ui-helper-reset</code>: A basic style reset for DOM nodes. Resets padding, margins, text-decoration, list-style, etc.
13
17
</li>
14
18
<li>
15
19
<code>.ui-helper-clearfix</code>: Applies float wrapping properties to parent elements.
16
20
</li>
17
-
<li>
18
-
<code>.ui-helper-zfix</code>: Applies iframe "fix" css to iframe elements when needed in overlays.
19
-
</li>
20
21
</ul>
21
22
22
23
<h3>Widget Containers</h3>
23
24
<ul>
24
25
<li>
25
-
<code>.ui-widget</code>: Class to be applied on outer container of all widgets. Applies fontfamily and font size to widget. Also applies same family and 1em font size to child form elements, specifically to combat inheritance issues in Windows browsers.
26
+
<code>.ui-widget</code>: Class to be applied on outer container of all widgets. Applies font-family and font size to widgets.
26
27
</li>
27
28
<li>
28
29
<code>.ui-widget-header</code>: Class to be applied to header containers. Applies header container styles to an element and its child text, links, and icons.
@@ -41,7 +42,7 @@ <h3>Interaction States</h3>
41
42
<code>.ui-state-hover</code>: Class to be applied on mouseover to clickable button-like elements. Applies "clickable hover" container styles to an element and its child text, links, and icons.
42
43
</li>
43
44
<li>
44
-
<code>.ui-state-focus</code>: Class to be applied on keyboard focus to clickable button-like elements. Applies "clickable hover" container styles to an element and its child text, links, and icons.
45
+
<code>.ui-state-focus</code>: Class to be applied on keyboard focus to clickable button-like elements. Applies "clickable focus" container styles to an element and its child text, links, and icons.
45
46
</li>
46
47
<li>
47
48
<code>.ui-state-active</code>: Class to be applied on mousedown to clickable button-like elements. Applies "clickable active" container styles to an element and its child text, links, and icons.
@@ -63,10 +64,10 @@ <h3>Interaction Cues</h3>
63
64
<code>.ui-state-disabled</code>: Applies a dimmed opacity to disabled UI elements. Meant to be added in addition to an already-styled element.
64
65
</li>
65
66
<li>
66
-
<code>.ui-priority-primary</code>: Class to be applied to a priority-1 button in situations where button hierarchy is needed. Applies bold text.
67
+
<code>.ui-priority-primary</code>: Class to be applied to a priority-1 button in situations where button hierarchy is needed.
67
68
</li>
68
69
<li>
69
-
<code>.ui-priority-secondary</code>: Class to be applied to a priority-2 button in situations where button hierarchy is needed. Applies normal weight text and slight transparency to element.
70
+
<code>.ui-priority-secondary</code>: Class to be applied to a priority-2 button in situations where button hierarchy is needed.
0 commit comments