├── .gitignore ├── README.md ├── images ├── ui-icons_21759b_256x240.png ├── ui-icons_333333_256x240.png ├── ui-icons_999999_256x240.png └── ui-icons_cc0000_256x240.png ├── jquery-ui-classic.css ├── jquery-ui-demo.css ├── jquery-ui-demo.js ├── jquery-ui-fresh.css └── wp-admin-jquery-ui.php /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | WP Admin jQuery UI 2 | ========================= 3 | 4 | As proposed in Trac ticket [#18909](http://core.trac.wordpress.org/ticket/18909), there should be some sort of matching CSS for the WordPress admin now that all jQuery UI components are bundled. While decisions would have to be made about how these are bundled, if at all, this is at least a start to having [a] matching stylesheet[s] for the WordPress admin and jQuery UI. 5 | 6 | This is a plugin that will create a jQuery UI demo page under the Tools menu. Color scheme will change based on the user's setting. Scripts and stylesheets are enqueued on the demo screen only. -------------------------------------------------------------------------------- /images/ui-icons_21759b_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/helen/wp-admin-jquery-ui/6b41c74898eeedd3794eaaa08f6f6c988f4f4ea9/images/ui-icons_21759b_256x240.png -------------------------------------------------------------------------------- /images/ui-icons_333333_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/helen/wp-admin-jquery-ui/6b41c74898eeedd3794eaaa08f6f6c988f4f4ea9/images/ui-icons_333333_256x240.png -------------------------------------------------------------------------------- /images/ui-icons_999999_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/helen/wp-admin-jquery-ui/6b41c74898eeedd3794eaaa08f6f6c988f4f4ea9/images/ui-icons_999999_256x240.png -------------------------------------------------------------------------------- /images/ui-icons_cc0000_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/helen/wp-admin-jquery-ui/6b41c74898eeedd3794eaaa08f6f6c988f4f4ea9/images/ui-icons_cc0000_256x240.png -------------------------------------------------------------------------------- /jquery-ui-classic.css: -------------------------------------------------------------------------------- 1 | /* 2 | * jQuery UI CSS Framework 1.8.16 3 | * 4 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 5 | * Dual licensed under the MIT or GPL Version 2 licenses. 6 | * http://jquery.org/license 7 | * 8 | * http://docs.jquery.com/UI/Theming/API 9 | */ 10 | 11 | /* Layout helpers 12 | ----------------------------------*/ 13 | .ui-helper-hidden { display: none; } 14 | .ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } 15 | .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } 16 | .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } 17 | .ui-helper-clearfix { display: inline-block; } 18 | /* required comment for clearfix to work in Opera \*/ 19 | * html .ui-helper-clearfix { height:1%; } 20 | .ui-helper-clearfix { display:block; } 21 | /* end clearfix */ 22 | .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } 23 | 24 | 25 | /* Interaction Cues 26 | ----------------------------------*/ 27 | .ui-state-disabled { cursor: default !important; } 28 | 29 | 30 | /* Icons 31 | ----------------------------------*/ 32 | 33 | /* states and images */ 34 | .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } 35 | 36 | 37 | /* Misc visuals 38 | ----------------------------------*/ 39 | 40 | /* Overlays */ 41 | .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } 42 | 43 | 44 | /* 45 | * jQuery UI CSS Framework 1.8.16 46 | * 47 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 48 | * Dual licensed under the MIT or GPL Version 2 licenses. 49 | * http://jquery.org/license 50 | * 51 | * http://docs.jquery.com/UI/Theming/API 52 | * 53 | * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=sans-serif&fwDefault=normal&fsDefault=12px&cornerRadius=3px&bgColorHeader=eff8ff&bgTextureHeader=04_highlight_hard.png&bgImgOpacityHeader=75&borderColorHeader=d1e5ee&fcHeader=333333&iconColorHeader=21759b&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=d1e5ee&fcContent=333333&iconColorContent=333333&bgColorDefault=eff8ff&bgTextureDefault=04_highlight_hard.png&bgImgOpacityDefault=75&borderColorDefault=d1e5ee&fcDefault=333333&iconColorDefault=333333&bgColorHover=f7fcfe&bgTextureHover=06_inset_hard.png&bgImgOpacityHover=75&borderColorHover=b8d7e5&fcHover=000000&iconColorHover=333333&bgColorActive=ffffff&bgTextureActive=01_flat.png&bgImgOpacityActive=65&borderColorActive=d1e5ee&fcActive=333333&iconColorActive=333333&bgColorHighlight=ffffe0&bgTextureHighlight=01_flat.png&bgImgOpacityHighlight=55&borderColorHighlight=e6db55&fcHighlight=333333&iconColorHighlight=21759b&bgColorError=ffebe8&bgTextureError=01_flat.png&bgImgOpacityError=95&borderColorError=cc0000&fcError=cc0000&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=3px 54 | */ 55 | 56 | 57 | /* Component containers 58 | ----------------------------------*/ 59 | .ui-widget { font-family: sans-serif; font-size: 12px; } 60 | .ui-widget .ui-widget { font-size: 1em; } 61 | .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: sans-serif; font-size: 1em; } 62 | .ui-widget-content { border: 1px solid #d1e5ee; background: #ffffff; color: #333333; } 63 | .ui-widget-header { border: 1px solid #d1e5ee; background-color: #f5fafd; background-image: -ms-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -moz-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -o-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -webkit-gradient(linear, left top, left bottom, from(#f7fcfe), to(#eff8ff)); background-image: -webkit-linear-gradient(top, #f7fcfe, #eff8ff); background-image: linear-gradient(top, #f7fcfe, #eff8ff); color: #333333; font-weight: bold; } 64 | .ui-widget-header a { color: #333333; } 65 | 66 | /* Interaction states 67 | ----------------------------------*/ 68 | .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d1e5ee; background-color: #f5fafd; background-image: -ms-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -moz-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -o-linear-gradient(top, #f7fcfe, #eff8ff); background-image: -webkit-gradient(linear, left top, left bottom, from(#f7fcfe), to(#eff8ff)); background-image: -webkit-linear-gradient(top, #f7fcfe, #eff8ff); background-image: linear-gradient(top, #f7fcfe, #eff8ff); font-weight: normal; color: #333333; } 69 | .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #333333; text-decoration: none; } 70 | .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #b8d7e5; background-color: #f7fcfe; background-image: -ms-linear-gradient(top, #eff8ff, #f7fcfe); background-image: -moz-linear-gradient(top, #eff8ff, #f7fcfe); background-image: -o-linear-gradient(top, #eff8ff, #f7fcfe); background-image: -webkit-gradient(linear, left top, left bottom, from(#eff8ff), to(#f7fcfe)); background-image: -webkit-linear-gradient(top, #eff8ff, #f7fcfe); background-image: linear-gradient(top, #eff8ff, #f7fcfe);; font-weight: normal; color: #000000; } 71 | .ui-state-hover a, .ui-state-hover a:hover { color: #000000; text-decoration: none; } 72 | .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #d1e5ee; background: #ffffff; font-weight: normal; color: #333333; } 73 | .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #333333; text-decoration: none; } 74 | .ui-widget :active { outline: none; } 75 | 76 | /* Interaction Cues 77 | ----------------------------------*/ 78 | .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #e6db55; background: #ffffe0; color: #333333; } 79 | .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #333333; } 80 | .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cc0000; background: #ffebe8; color: #cc0000; } 81 | .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cc0000; } 82 | .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cc0000; } 83 | .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } 84 | .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } 85 | .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } 86 | 87 | /* Icons 88 | ----------------------------------*/ 89 | 90 | /* states and images */ 91 | .ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_333333_256x240.png); } 92 | .ui-widget-content .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 93 | .ui-widget-header .ui-icon {background-image: url(images/ui-icons_999999_256x240.png); } 94 | .ui-state-default .ui-icon { background-image: url(images/ui-icons_333333_256x240.png); } 95 | .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 96 | .ui-state-active .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 97 | .ui-state-highlight .ui-icon {background-image: url(images/ui-icons_21759b_256x240.png); } 98 | .ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cc0000_256x240.png); } 99 | 100 | /* positioning */ 101 | .ui-icon-carat-1-n { background-position: 0 0; } 102 | .ui-icon-carat-1-ne { background-position: -16px 0; } 103 | .ui-icon-carat-1-e { background-position: -32px 0; } 104 | .ui-icon-carat-1-se { background-position: -48px 0; } 105 | .ui-icon-carat-1-s { background-position: -64px 0; } 106 | .ui-icon-carat-1-sw { background-position: -80px 0; } 107 | .ui-icon-carat-1-w { background-position: -96px 0; } 108 | .ui-icon-carat-1-nw { background-position: -112px 0; } 109 | .ui-icon-carat-2-n-s { background-position: -128px 0; } 110 | .ui-icon-carat-2-e-w { background-position: -144px 0; } 111 | .ui-icon-triangle-1-n { background-position: 0 -16px; } 112 | .ui-icon-triangle-1-ne { background-position: -16px -16px; } 113 | .ui-icon-triangle-1-e { background-position: -32px -16px; } 114 | .ui-icon-triangle-1-se { background-position: -48px -16px; } 115 | .ui-icon-triangle-1-s { background-position: -64px -16px; } 116 | .ui-icon-triangle-1-sw { background-position: -80px -16px; } 117 | .ui-icon-triangle-1-w { background-position: -96px -16px; } 118 | .ui-icon-triangle-1-nw { background-position: -112px -16px; } 119 | .ui-icon-triangle-2-n-s { background-position: -128px -16px; } 120 | .ui-icon-triangle-2-e-w { background-position: -144px -16px; } 121 | .ui-icon-arrow-1-n { background-position: 0 -32px; } 122 | .ui-icon-arrow-1-ne { background-position: -16px -32px; } 123 | .ui-icon-arrow-1-e { background-position: -32px -32px; } 124 | .ui-icon-arrow-1-se { background-position: -48px -32px; } 125 | .ui-icon-arrow-1-s { background-position: -64px -32px; } 126 | .ui-icon-arrow-1-sw { background-position: -80px -32px; } 127 | .ui-icon-arrow-1-w { background-position: -96px -32px; } 128 | .ui-icon-arrow-1-nw { background-position: -112px -32px; } 129 | .ui-icon-arrow-2-n-s { background-position: -128px -32px; } 130 | .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } 131 | .ui-icon-arrow-2-e-w { background-position: -160px -32px; } 132 | .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } 133 | .ui-icon-arrowstop-1-n { background-position: -192px -32px; } 134 | .ui-icon-arrowstop-1-e { background-position: -208px -32px; } 135 | .ui-icon-arrowstop-1-s { background-position: -224px -32px; } 136 | .ui-icon-arrowstop-1-w { background-position: -240px -32px; } 137 | .ui-icon-arrowthick-1-n { background-position: 0 -48px; } 138 | .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } 139 | .ui-icon-arrowthick-1-e { background-position: -32px -48px; } 140 | .ui-icon-arrowthick-1-se { background-position: -48px -48px; } 141 | .ui-icon-arrowthick-1-s { background-position: -64px -48px; } 142 | .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } 143 | .ui-icon-arrowthick-1-w { background-position: -96px -48px; } 144 | .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } 145 | .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } 146 | .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } 147 | .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } 148 | .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } 149 | .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } 150 | .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } 151 | .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } 152 | .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } 153 | .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } 154 | .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } 155 | .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } 156 | .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } 157 | .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } 158 | .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } 159 | .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } 160 | .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } 161 | .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } 162 | .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } 163 | .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } 164 | .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } 165 | .ui-icon-arrow-4 { background-position: 0 -80px; } 166 | .ui-icon-arrow-4-diag { background-position: -16px -80px; } 167 | .ui-icon-extlink { background-position: -32px -80px; } 168 | .ui-icon-newwin { background-position: -48px -80px; } 169 | .ui-icon-refresh { background-position: -64px -80px; } 170 | .ui-icon-shuffle { background-position: -80px -80px; } 171 | .ui-icon-transfer-e-w { background-position: -96px -80px; } 172 | .ui-icon-transferthick-e-w { background-position: -112px -80px; } 173 | .ui-icon-folder-collapsed { background-position: 0 -96px; } 174 | .ui-icon-folder-open { background-position: -16px -96px; } 175 | .ui-icon-document { background-position: -32px -96px; } 176 | .ui-icon-document-b { background-position: -48px -96px; } 177 | .ui-icon-note { background-position: -64px -96px; } 178 | .ui-icon-mail-closed { background-position: -80px -96px; } 179 | .ui-icon-mail-open { background-position: -96px -96px; } 180 | .ui-icon-suitcase { background-position: -112px -96px; } 181 | .ui-icon-comment { background-position: -128px -96px; } 182 | .ui-icon-person { background-position: -144px -96px; } 183 | .ui-icon-print { background-position: -160px -96px; } 184 | .ui-icon-trash { background-position: -176px -96px; } 185 | .ui-icon-locked { background-position: -192px -96px; } 186 | .ui-icon-unlocked { background-position: -208px -96px; } 187 | .ui-icon-bookmark { background-position: -224px -96px; } 188 | .ui-icon-tag { background-position: -240px -96px; } 189 | .ui-icon-home { background-position: 0 -112px; } 190 | .ui-icon-flag { background-position: -16px -112px; } 191 | .ui-icon-calendar { background-position: -32px -112px; } 192 | .ui-icon-cart { background-position: -48px -112px; } 193 | .ui-icon-pencil { background-position: -64px -112px; } 194 | .ui-icon-clock { background-position: -80px -112px; } 195 | .ui-icon-disk { background-position: -96px -112px; } 196 | .ui-icon-calculator { background-position: -112px -112px; } 197 | .ui-icon-zoomin { background-position: -128px -112px; } 198 | .ui-icon-zoomout { background-position: -144px -112px; } 199 | .ui-icon-search { background-position: -160px -112px; } 200 | .ui-icon-wrench { background-position: -176px -112px; } 201 | .ui-icon-gear { background-position: -192px -112px; } 202 | .ui-icon-heart { background-position: -208px -112px; } 203 | .ui-icon-star { background-position: -224px -112px; } 204 | .ui-icon-link { background-position: -240px -112px; } 205 | .ui-icon-cancel { background-position: 0 -128px; } 206 | .ui-icon-plus { background-position: -16px -128px; } 207 | .ui-icon-plusthick { background-position: -32px -128px; } 208 | .ui-icon-minus { background-position: -48px -128px; } 209 | .ui-icon-minusthick { background-position: -64px -128px; } 210 | .ui-icon-close { background-position: -80px -128px; } 211 | .ui-icon-closethick { background-position: -96px -128px; } 212 | .ui-icon-key { background-position: -112px -128px; } 213 | .ui-icon-lightbulb { background-position: -128px -128px; } 214 | .ui-icon-scissors { background-position: -144px -128px; } 215 | .ui-icon-clipboard { background-position: -160px -128px; } 216 | .ui-icon-copy { background-position: -176px -128px; } 217 | .ui-icon-contact { background-position: -192px -128px; } 218 | .ui-icon-image { background-position: -208px -128px; } 219 | .ui-icon-video { background-position: -224px -128px; } 220 | .ui-icon-script { background-position: -240px -128px; } 221 | .ui-icon-alert { background-position: 0 -144px; } 222 | .ui-icon-info { background-position: -16px -144px; } 223 | .ui-icon-notice { background-position: -32px -144px; } 224 | .ui-icon-help { background-position: -48px -144px; } 225 | .ui-icon-check { background-position: -64px -144px; } 226 | .ui-icon-bullet { background-position: -80px -144px; } 227 | .ui-icon-radio-off { background-position: -96px -144px; } 228 | .ui-icon-radio-on { background-position: -112px -144px; } 229 | .ui-icon-pin-w { background-position: -128px -144px; } 230 | .ui-icon-pin-s { background-position: -144px -144px; } 231 | .ui-icon-play { background-position: 0 -160px; } 232 | .ui-icon-pause { background-position: -16px -160px; } 233 | .ui-icon-seek-next { background-position: -32px -160px; } 234 | .ui-icon-seek-prev { background-position: -48px -160px; } 235 | .ui-icon-seek-end { background-position: -64px -160px; } 236 | .ui-icon-seek-start { background-position: -80px -160px; } 237 | /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ 238 | .ui-icon-seek-first { background-position: -80px -160px; } 239 | .ui-icon-stop { background-position: -96px -160px; } 240 | .ui-icon-eject { background-position: -112px -160px; } 241 | .ui-icon-volume-off { background-position: -128px -160px; } 242 | .ui-icon-volume-on { background-position: -144px -160px; } 243 | .ui-icon-power { background-position: 0 -176px; } 244 | .ui-icon-signal-diag { background-position: -16px -176px; } 245 | .ui-icon-signal { background-position: -32px -176px; } 246 | .ui-icon-battery-0 { background-position: -48px -176px; } 247 | .ui-icon-battery-1 { background-position: -64px -176px; } 248 | .ui-icon-battery-2 { background-position: -80px -176px; } 249 | .ui-icon-battery-3 { background-position: -96px -176px; } 250 | .ui-icon-circle-plus { background-position: 0 -192px; } 251 | .ui-icon-circle-minus { background-position: -16px -192px; } 252 | .ui-icon-circle-close { background-position: -32px -192px; } 253 | .ui-icon-circle-triangle-e { background-position: -48px -192px; } 254 | .ui-icon-circle-triangle-s { background-position: -64px -192px; } 255 | .ui-icon-circle-triangle-w { background-position: -80px -192px; } 256 | .ui-icon-circle-triangle-n { background-position: -96px -192px; } 257 | .ui-icon-circle-arrow-e { background-position: -112px -192px; } 258 | .ui-icon-circle-arrow-s { background-position: -128px -192px; } 259 | .ui-icon-circle-arrow-w { background-position: -144px -192px; } 260 | .ui-icon-circle-arrow-n { background-position: -160px -192px; } 261 | .ui-icon-circle-zoomin { background-position: -176px -192px; } 262 | .ui-icon-circle-zoomout { background-position: -192px -192px; } 263 | .ui-icon-circle-check { background-position: -208px -192px; } 264 | .ui-icon-circlesmall-plus { background-position: 0 -208px; } 265 | .ui-icon-circlesmall-minus { background-position: -16px -208px; } 266 | .ui-icon-circlesmall-close { background-position: -32px -208px; } 267 | .ui-icon-squaresmall-plus { background-position: -48px -208px; } 268 | .ui-icon-squaresmall-minus { background-position: -64px -208px; } 269 | .ui-icon-squaresmall-close { background-position: -80px -208px; } 270 | .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } 271 | .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } 272 | .ui-icon-grip-solid-vertical { background-position: -32px -224px; } 273 | .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } 274 | .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } 275 | .ui-icon-grip-diagonal-se { background-position: -80px -224px; } 276 | 277 | 278 | /* Misc visuals 279 | ----------------------------------*/ 280 | 281 | /* Corner radius */ 282 | .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; -khtml-border-top-left-radius: 3px; border-top-left-radius: 3px; } 283 | .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; -khtml-border-top-right-radius: 3px; border-top-right-radius: 3px; } 284 | .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; -khtml-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; } 285 | .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; -khtml-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; } 286 | 287 | /* Overlays */ 288 | .ui-widget-overlay { background: #000000; opacity: .6;filter:Alpha(Opacity=60); } 289 | .ui-widget-shadow { box-shadow: 0 0 16px rgba(0, 0, 0, 0.3); }/* 290 | * jQuery UI Resizable 1.8.16 291 | * 292 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 293 | * Dual licensed under the MIT or GPL Version 2 licenses. 294 | * http://jquery.org/license 295 | * 296 | * http://docs.jquery.com/UI/Resizable#theming 297 | */ 298 | .ui-resizable { position: relative;} 299 | .ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block; } 300 | .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } 301 | .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } 302 | .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } 303 | .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } 304 | .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } 305 | .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } 306 | .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } 307 | .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } 308 | .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}/* 309 | * jQuery UI Selectable 1.8.16 310 | * 311 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 312 | * Dual licensed under the MIT or GPL Version 2 licenses. 313 | * http://jquery.org/license 314 | * 315 | * http://docs.jquery.com/UI/Selectable#theming 316 | */ 317 | .ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; } 318 | /* 319 | * jQuery UI Accordion 1.8.16 320 | * 321 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 322 | * Dual licensed under the MIT or GPL Version 2 licenses. 323 | * http://jquery.org/license 324 | * 325 | * http://docs.jquery.com/UI/Accordion#theming 326 | */ 327 | /* IE/Win - Fix animation bug - #4615 */ 328 | .ui-accordion { width: 100%; } 329 | .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } 330 | .ui-accordion .ui-accordion-li-fix { display: inline; } 331 | .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } 332 | .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } 333 | .ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } 334 | .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } 335 | .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } 336 | .ui-accordion .ui-accordion-content-active { display: block; } 337 | /* 338 | * jQuery UI Autocomplete 1.8.16 339 | * 340 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 341 | * Dual licensed under the MIT or GPL Version 2 licenses. 342 | * http://jquery.org/license 343 | * 344 | * http://docs.jquery.com/UI/Autocomplete#theming 345 | */ 346 | .ui-autocomplete { position: absolute; cursor: default; } 347 | 348 | /* workarounds */ 349 | * html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ 350 | 351 | /* 352 | * jQuery UI Menu 1.8.16 353 | * 354 | * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about) 355 | * Dual licensed under the MIT or GPL Version 2 licenses. 356 | * http://jquery.org/license 357 | * 358 | * http://docs.jquery.com/UI/Menu#theming 359 | */ 360 | .ui-menu { 361 | list-style:none; 362 | padding: 2px; 363 | margin: 0; 364 | display:block; 365 | float: left; 366 | } 367 | .ui-menu .ui-menu { 368 | margin-top: -3px; 369 | } 370 | .ui-menu .ui-menu-item { 371 | margin:0; 372 | padding: 0; 373 | zoom: 1; 374 | float: left; 375 | clear: left; 376 | width: 100%; 377 | } 378 | .ui-menu .ui-menu-item a { 379 | text-decoration:none; 380 | display:block; 381 | padding:.2em .4em; 382 | line-height:1.5; 383 | zoom:1; 384 | } 385 | .ui-menu .ui-menu-item a.ui-state-hover, 386 | .ui-menu .ui-menu-item a.ui-state-active { 387 | font-weight: normal; 388 | margin: -1px; 389 | } 390 | /* 391 | * jQuery UI Button 1.8.16 392 | * 393 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 394 | * Dual licensed under the MIT or GPL Version 2 licenses. 395 | * http://jquery.org/license 396 | * 397 | * http://docs.jquery.com/UI/Button#theming 398 | */ 399 | .ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */ 400 | .ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */ 401 | button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */ 402 | .ui-button-icons-only { width: 3.4em; } 403 | button.ui-button-icons-only { width: 3.7em; } 404 | 405 | /*button text element */ 406 | .ui-button .ui-button-text { display: block; line-height: 1.4; } 407 | .ui-button-text-only .ui-button-text { padding: .4em 1em; } 408 | .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; } 409 | .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; } 410 | .ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; } 411 | .ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; } 412 | /* no icon support for input elements, provide padding by default */ 413 | input.ui-button { padding: .4em 1em; } 414 | 415 | /*button icon element(s) */ 416 | .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } 417 | .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } 418 | .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; } 419 | .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } 420 | .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } 421 | 422 | /*button sets*/ 423 | .ui-buttonset { margin-right: 7px; } 424 | .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } 425 | 426 | /* workarounds */ 427 | button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */ 428 | /* 429 | * jQuery UI Dialog 1.8.16 430 | * 431 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 432 | * Dual licensed under the MIT or GPL Version 2 licenses. 433 | * http://jquery.org/license 434 | * 435 | * http://docs.jquery.com/UI/Dialog#theming 436 | */ 437 | .ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; } 438 | .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } 439 | .ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } 440 | .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; } 441 | .ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; } 442 | .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; } 443 | .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; } 444 | .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; } 445 | .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } 446 | .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } 447 | .ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; } 448 | .ui-draggable .ui-dialog-titlebar { cursor: move; } 449 | /* 450 | * jQuery UI Slider 1.8.16 451 | * 452 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 453 | * Dual licensed under the MIT or GPL Version 2 licenses. 454 | * http://jquery.org/license 455 | * 456 | * http://docs.jquery.com/UI/Slider#theming 457 | */ 458 | .ui-slider { position: relative; text-align: left; } 459 | .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; } 460 | .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } 461 | 462 | .ui-slider-horizontal { height: .8em; } 463 | .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } 464 | .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } 465 | .ui-slider-horizontal .ui-slider-range-min { left: 0; } 466 | .ui-slider-horizontal .ui-slider-range-max { right: 0; } 467 | 468 | .ui-slider-vertical { width: .8em; height: 100px; } 469 | .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } 470 | .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } 471 | .ui-slider-vertical .ui-slider-range-min { bottom: 0; } 472 | .ui-slider-vertical .ui-slider-range-max { top: 0; }/* 473 | * jQuery UI Tabs 1.8.16 474 | * 475 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 476 | * Dual licensed under the MIT or GPL Version 2 licenses. 477 | * http://jquery.org/license 478 | * 479 | * http://docs.jquery.com/UI/Tabs#theming 480 | */ 481 | .ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ 482 | .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } 483 | .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; } 484 | .ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } 485 | .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; } 486 | .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } 487 | .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ 488 | .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } 489 | .ui-tabs .ui-tabs-hide { display: none !important; } 490 | /* 491 | * jQuery UI Datepicker 1.8.16 492 | * 493 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 494 | * Dual licensed under the MIT or GPL Version 2 licenses. 495 | * http://jquery.org/license 496 | * 497 | * http://docs.jquery.com/UI/Datepicker#theming 498 | */ 499 | .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } 500 | .ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } 501 | .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } 502 | .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } 503 | .ui-datepicker .ui-datepicker-prev { left:2px; } 504 | .ui-datepicker .ui-datepicker-next { right:2px; } 505 | .ui-datepicker .ui-datepicker-prev-hover { left:1px; } 506 | .ui-datepicker .ui-datepicker-next-hover { right:1px; } 507 | .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } 508 | .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } 509 | .ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } 510 | .ui-datepicker select.ui-datepicker-month-year {width: 100%;} 511 | .ui-datepicker select.ui-datepicker-month, 512 | .ui-datepicker select.ui-datepicker-year { width: 49%;} 513 | .ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } 514 | .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } 515 | .ui-datepicker td { border: 0; padding: 1px; } 516 | .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } 517 | .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } 518 | .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } 519 | .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } 520 | 521 | /* with multiple calendars */ 522 | .ui-datepicker.ui-datepicker-multi { width:auto; } 523 | .ui-datepicker-multi .ui-datepicker-group { float:left; } 524 | .ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } 525 | .ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } 526 | .ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } 527 | .ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } 528 | .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } 529 | .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } 530 | .ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } 531 | .ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } 532 | 533 | /* RTL support */ 534 | .ui-datepicker-rtl { direction: rtl; } 535 | .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } 536 | .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } 537 | .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } 538 | .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } 539 | .ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } 540 | .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } 541 | .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } 542 | .ui-datepicker-rtl .ui-datepicker-group { float:right; } 543 | .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } 544 | .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } 545 | 546 | /* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ 547 | .ui-datepicker-cover { 548 | display: none; /*sorry for IE5*/ 549 | display/**/: block; /*sorry for IE5*/ 550 | position: absolute; /*must have*/ 551 | z-index: -1; /*must have*/ 552 | filter: mask(); /*must have*/ 553 | top: -4px; /*must have*/ 554 | left: -4px; /*must have*/ 555 | width: 200px; /*must have*/ 556 | height: 200px; /*must have*/ 557 | }/* 558 | * jQuery UI Progressbar 1.8.16 559 | * 560 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 561 | * Dual licensed under the MIT or GPL Version 2 licenses. 562 | * http://jquery.org/license 563 | * 564 | * http://docs.jquery.com/UI/Progressbar#theming 565 | */ 566 | .ui-progressbar { height:2em; text-align: left; } 567 | .ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; } 568 | .ui-progressbar .ui-widget-header { 569 | background-color: #83B4D8; 570 | background-image: linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 571 | background-image: -o-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 572 | background-image: -moz-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 573 | background-image: -webkit-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 574 | background-image: -ms-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 575 | } -------------------------------------------------------------------------------- /jquery-ui-demo.css: -------------------------------------------------------------------------------- 1 | #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;} 2 | #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;} 3 | ul#icons {margin: 0; padding: 0;} 4 | ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;} 5 | ul#icons span.ui-icon {float: left; margin: 0 4px;} -------------------------------------------------------------------------------- /jquery-ui-demo.js: -------------------------------------------------------------------------------- 1 | jQuery(document).ready(function($) { 2 | 3 | // Accordion 4 | $("#accordion").accordion({ header: "h3" }); 5 | 6 | // Tabs 7 | $('#tabs').tabs(); 8 | 9 | 10 | // Dialog 11 | $('#dialog').dialog({ 12 | autoOpen: false, 13 | width: 600, 14 | modal: true, 15 | buttons: { 16 | "Ok": function() { 17 | $(this).dialog("close"); 18 | }, 19 | "Cancel": function() { 20 | $(this).dialog("close"); 21 | } 22 | } 23 | }); 24 | 25 | // Dialog Link 26 | $('#dialog_link').click(function(){ 27 | $('#dialog').dialog('open'); 28 | return false; 29 | }); 30 | 31 | // Datepicker 32 | $('#datepicker').datepicker({ 33 | inline: true 34 | }); 35 | 36 | // Slider 37 | $('#slider').slider({ 38 | range: true, 39 | values: [17, 67] 40 | }); 41 | 42 | // Progressbar 43 | $("#progressbar").progressbar({ 44 | value: 20 45 | }); 46 | 47 | //hover states on the static widgets 48 | $('#dialog_link, ul#icons li').hover( 49 | function() { $(this).addClass('ui-state-hover'); }, 50 | function() { $(this).removeClass('ui-state-hover'); } 51 | ); 52 | 53 | // autocomplete 54 | var availableTags = [ 55 | "ActionScript", 56 | "AppleScript", 57 | "Asp", 58 | "BASIC", 59 | "C", 60 | "C++", 61 | "Clojure", 62 | "COBOL", 63 | "ColdFusion", 64 | "Erlang", 65 | "Fortran", 66 | "Groovy", 67 | "Haskell", 68 | "Java", 69 | "JavaScript", 70 | "Lisp", 71 | "Perl", 72 | "PHP", 73 | "Python", 74 | "Ruby", 75 | "Scala", 76 | "Scheme" 77 | ]; 78 | $( "#autocomplete" ).autocomplete({ 79 | source: availableTags 80 | }); 81 | $( "#autocomplete-core" ).autocomplete({ 82 | source: availableTags, 83 | position: ( 'undefined' !== typeof isRtl && isRtl ) ? { my: 'right top', at: 'right bottom', offset: '0, -1' } : { offset: '0, -1' }, 84 | open: function() { $(this).addClass('open'); }, 85 | close: function() { $(this).removeClass('open'); } 86 | }); 87 | 88 | }); -------------------------------------------------------------------------------- /jquery-ui-fresh.css: -------------------------------------------------------------------------------- 1 | /* 2 | * jQuery UI CSS Framework 1.8.16 3 | * 4 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 5 | * Dual licensed under the MIT or GPL Version 2 licenses. 6 | * http://jquery.org/license 7 | * 8 | * http://docs.jquery.com/UI/Theming/API 9 | */ 10 | 11 | /* Layout helpers 12 | ----------------------------------*/ 13 | .ui-helper-hidden { display: none; } 14 | .ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } 15 | .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } 16 | .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } 17 | .ui-helper-clearfix { display: inline-block; } 18 | /* required comment for clearfix to work in Opera \*/ 19 | * html .ui-helper-clearfix { height:1%; } 20 | .ui-helper-clearfix { display:block; } 21 | /* end clearfix */ 22 | .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } 23 | 24 | 25 | /* Interaction Cues 26 | ----------------------------------*/ 27 | .ui-state-disabled { cursor: default !important; } 28 | 29 | 30 | /* Icons 31 | ----------------------------------*/ 32 | 33 | /* states and images */ 34 | .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } 35 | 36 | 37 | /* Misc visuals 38 | ----------------------------------*/ 39 | 40 | /* Overlays */ 41 | .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } 42 | 43 | 44 | /* 45 | * jQuery UI CSS Framework 1.8.16 46 | * 47 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 48 | * Dual licensed under the MIT or GPL Version 2 licenses. 49 | * http://jquery.org/license 50 | * 51 | * http://docs.jquery.com/UI/Theming/API 52 | * 53 | * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=sans-serif&fwDefault=normal&fsDefault=12px&cornerRadius=4px&bgColorHeader=ececec&bgTextureHeader=04_highlight_hard.png&bgImgOpacityHeader=75&borderColorHeader=dfdfdf&fcHeader=333333&iconColorHeader=999999&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=dfdfdf&fcContent=333333&iconColorContent=333333&bgColorDefault=ececec&bgTextureDefault=04_highlight_hard.png&bgImgOpacityDefault=75&borderColorDefault=dfdfdf&fcDefault=333333&iconColorDefault=333333&bgColorHover=ececec&bgTextureHover=06_inset_hard.png&bgImgOpacityHover=75&borderColorHover=ccc&fcHover=000000&iconColorHover=333333&bgColorActive=ffffff&bgTextureActive=01_flat.png&bgImgOpacityActive=65&borderColorActive=dfdfdf&fcActive=333333&iconColorActive=333333&bgColorHighlight=ffffe0&bgTextureHighlight=01_flat.png&bgImgOpacityHighlight=55&borderColorHighlight=e6db55&fcHighlight=333333&iconColorHighlight=21759b&bgColorError=ffebe8&bgTextureError=01_flat.png&bgImgOpacityError=95&borderColorError=cc0000&fcError=cc0000&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=3px 54 | */ 55 | 56 | 57 | /* Component containers 58 | ----------------------------------*/ 59 | .ui-widget { font-family: sans-serif; font-size: 12px; } 60 | .ui-widget .ui-widget { font-size: 1em; } 61 | .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: sans-serif; font-size: 1em; } 62 | .ui-widget-content { border: 1px solid #dfdfdf; background: #ffffff; color: #333333; } 63 | .ui-widget-header { border: 1px solid #dfdfdf; color: #333333; font-weight: bold; background-color: #f1f1f1; background-image: -ms-linear-gradient(top, #f9f9f9, #ececec); background-image: -moz-linear-gradient(top, #f9f9f9, #ececec); background-image: -o-linear-gradient(top, #f9f9f9, #ececec); background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec)); background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec); background-image: linear-gradient(top, #f9f9f9, #ececec); } 64 | .ui-widget-header a { color: #333333; } 65 | 66 | /* Interaction states 67 | ----------------------------------*/ 68 | .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #dfdfdf; background-color: #f1f1f1; background-image: -ms-linear-gradient(top, #f9f9f9, #ececec); background-image: -moz-linear-gradient(top, #f9f9f9, #ececec); background-image: -o-linear-gradient(top, #f9f9f9, #ececec); background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ececec)); background-image: -webkit-linear-gradient(top, #f9f9f9, #ececec); background-image: linear-gradient(top, #f9f9f9, #ececec); font-weight: normal; color: #333333; } 69 | .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #333333; text-decoration: none; } 70 | .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #ccc; background-color: #ececec; background-image: -ms-linear-gradient(top, #ececec, #f9f9f9); background-image: -moz-linear-gradient(top, #ececec, #f9f9f9); background-image: -o-linear-gradient(top, #ececec, #f9f9f9); background-image: -webkit-gradient(linear, left top, left bottom, from(#ececec), to(#f9f9f9)); background-image: -webkit-linear-gradient(top, #ececec, #f9f9f9); background-image: linear-gradient(top, #ececec, #f9f9f9); font-weight: normal; color: #000000; } 71 | .ui-state-hover a, .ui-state-hover a:hover { color: #000000; text-decoration: none; } 72 | .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #dfdfdf; background: #ffffff; font-weight: normal; color: #333333; } 73 | .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #333333; text-decoration: none; } 74 | .ui-widget :active { outline: none; } 75 | 76 | /* Interaction Cues 77 | ----------------------------------*/ 78 | .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #e6db55; background: #ffffe0; color: #333333; } 79 | .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #333333; } 80 | .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cc0000; background: #ffebe8; color: #cc0000; } 81 | .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cc0000; } 82 | .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cc0000; } 83 | .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } 84 | .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } 85 | .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } 86 | 87 | /* Icons 88 | ----------------------------------*/ 89 | 90 | /* states and images */ 91 | .ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_333333_256x240.png); } 92 | .ui-widget-content .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 93 | .ui-widget-header .ui-icon {background-image: url(images/ui-icons_999999_256x240.png); } 94 | .ui-state-default .ui-icon { background-image: url(images/ui-icons_333333_256x240.png); } 95 | .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 96 | .ui-state-active .ui-icon {background-image: url(images/ui-icons_333333_256x240.png); } 97 | .ui-state-highlight .ui-icon {background-image: url(images/ui-icons_21759b_256x240.png); } 98 | .ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cc0000_256x240.png); } 99 | 100 | /* positioning */ 101 | .ui-icon-carat-1-n { background-position: 0 0; } 102 | .ui-icon-carat-1-ne { background-position: -16px 0; } 103 | .ui-icon-carat-1-e { background-position: -32px 0; } 104 | .ui-icon-carat-1-se { background-position: -48px 0; } 105 | .ui-icon-carat-1-s { background-position: -64px 0; } 106 | .ui-icon-carat-1-sw { background-position: -80px 0; } 107 | .ui-icon-carat-1-w { background-position: -96px 0; } 108 | .ui-icon-carat-1-nw { background-position: -112px 0; } 109 | .ui-icon-carat-2-n-s { background-position: -128px 0; } 110 | .ui-icon-carat-2-e-w { background-position: -144px 0; } 111 | .ui-icon-triangle-1-n { background-position: 0 -16px; } 112 | .ui-icon-triangle-1-ne { background-position: -16px -16px; } 113 | .ui-icon-triangle-1-e { background-position: -32px -16px; } 114 | .ui-icon-triangle-1-se { background-position: -48px -16px; } 115 | .ui-icon-triangle-1-s { background-position: -64px -16px; } 116 | .ui-icon-triangle-1-sw { background-position: -80px -16px; } 117 | .ui-icon-triangle-1-w { background-position: -96px -16px; } 118 | .ui-icon-triangle-1-nw { background-position: -112px -16px; } 119 | .ui-icon-triangle-2-n-s { background-position: -128px -16px; } 120 | .ui-icon-triangle-2-e-w { background-position: -144px -16px; } 121 | .ui-icon-arrow-1-n { background-position: 0 -32px; } 122 | .ui-icon-arrow-1-ne { background-position: -16px -32px; } 123 | .ui-icon-arrow-1-e { background-position: -32px -32px; } 124 | .ui-icon-arrow-1-se { background-position: -48px -32px; } 125 | .ui-icon-arrow-1-s { background-position: -64px -32px; } 126 | .ui-icon-arrow-1-sw { background-position: -80px -32px; } 127 | .ui-icon-arrow-1-w { background-position: -96px -32px; } 128 | .ui-icon-arrow-1-nw { background-position: -112px -32px; } 129 | .ui-icon-arrow-2-n-s { background-position: -128px -32px; } 130 | .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } 131 | .ui-icon-arrow-2-e-w { background-position: -160px -32px; } 132 | .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } 133 | .ui-icon-arrowstop-1-n { background-position: -192px -32px; } 134 | .ui-icon-arrowstop-1-e { background-position: -208px -32px; } 135 | .ui-icon-arrowstop-1-s { background-position: -224px -32px; } 136 | .ui-icon-arrowstop-1-w { background-position: -240px -32px; } 137 | .ui-icon-arrowthick-1-n { background-position: 0 -48px; } 138 | .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } 139 | .ui-icon-arrowthick-1-e { background-position: -32px -48px; } 140 | .ui-icon-arrowthick-1-se { background-position: -48px -48px; } 141 | .ui-icon-arrowthick-1-s { background-position: -64px -48px; } 142 | .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } 143 | .ui-icon-arrowthick-1-w { background-position: -96px -48px; } 144 | .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } 145 | .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } 146 | .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } 147 | .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } 148 | .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } 149 | .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } 150 | .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } 151 | .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } 152 | .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } 153 | .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } 154 | .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } 155 | .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } 156 | .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } 157 | .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } 158 | .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } 159 | .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } 160 | .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } 161 | .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } 162 | .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } 163 | .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } 164 | .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } 165 | .ui-icon-arrow-4 { background-position: 0 -80px; } 166 | .ui-icon-arrow-4-diag { background-position: -16px -80px; } 167 | .ui-icon-extlink { background-position: -32px -80px; } 168 | .ui-icon-newwin { background-position: -48px -80px; } 169 | .ui-icon-refresh { background-position: -64px -80px; } 170 | .ui-icon-shuffle { background-position: -80px -80px; } 171 | .ui-icon-transfer-e-w { background-position: -96px -80px; } 172 | .ui-icon-transferthick-e-w { background-position: -112px -80px; } 173 | .ui-icon-folder-collapsed { background-position: 0 -96px; } 174 | .ui-icon-folder-open { background-position: -16px -96px; } 175 | .ui-icon-document { background-position: -32px -96px; } 176 | .ui-icon-document-b { background-position: -48px -96px; } 177 | .ui-icon-note { background-position: -64px -96px; } 178 | .ui-icon-mail-closed { background-position: -80px -96px; } 179 | .ui-icon-mail-open { background-position: -96px -96px; } 180 | .ui-icon-suitcase { background-position: -112px -96px; } 181 | .ui-icon-comment { background-position: -128px -96px; } 182 | .ui-icon-person { background-position: -144px -96px; } 183 | .ui-icon-print { background-position: -160px -96px; } 184 | .ui-icon-trash { background-position: -176px -96px; } 185 | .ui-icon-locked { background-position: -192px -96px; } 186 | .ui-icon-unlocked { background-position: -208px -96px; } 187 | .ui-icon-bookmark { background-position: -224px -96px; } 188 | .ui-icon-tag { background-position: -240px -96px; } 189 | .ui-icon-home { background-position: 0 -112px; } 190 | .ui-icon-flag { background-position: -16px -112px; } 191 | .ui-icon-calendar { background-position: -32px -112px; } 192 | .ui-icon-cart { background-position: -48px -112px; } 193 | .ui-icon-pencil { background-position: -64px -112px; } 194 | .ui-icon-clock { background-position: -80px -112px; } 195 | .ui-icon-disk { background-position: -96px -112px; } 196 | .ui-icon-calculator { background-position: -112px -112px; } 197 | .ui-icon-zoomin { background-position: -128px -112px; } 198 | .ui-icon-zoomout { background-position: -144px -112px; } 199 | .ui-icon-search { background-position: -160px -112px; } 200 | .ui-icon-wrench { background-position: -176px -112px; } 201 | .ui-icon-gear { background-position: -192px -112px; } 202 | .ui-icon-heart { background-position: -208px -112px; } 203 | .ui-icon-star { background-position: -224px -112px; } 204 | .ui-icon-link { background-position: -240px -112px; } 205 | .ui-icon-cancel { background-position: 0 -128px; } 206 | .ui-icon-plus { background-position: -16px -128px; } 207 | .ui-icon-plusthick { background-position: -32px -128px; } 208 | .ui-icon-minus { background-position: -48px -128px; } 209 | .ui-icon-minusthick { background-position: -64px -128px; } 210 | .ui-icon-close { background-position: -80px -128px; } 211 | .ui-icon-closethick { background-position: -96px -128px; } 212 | .ui-icon-key { background-position: -112px -128px; } 213 | .ui-icon-lightbulb { background-position: -128px -128px; } 214 | .ui-icon-scissors { background-position: -144px -128px; } 215 | .ui-icon-clipboard { background-position: -160px -128px; } 216 | .ui-icon-copy { background-position: -176px -128px; } 217 | .ui-icon-contact { background-position: -192px -128px; } 218 | .ui-icon-image { background-position: -208px -128px; } 219 | .ui-icon-video { background-position: -224px -128px; } 220 | .ui-icon-script { background-position: -240px -128px; } 221 | .ui-icon-alert { background-position: 0 -144px; } 222 | .ui-icon-info { background-position: -16px -144px; } 223 | .ui-icon-notice { background-position: -32px -144px; } 224 | .ui-icon-help { background-position: -48px -144px; } 225 | .ui-icon-check { background-position: -64px -144px; } 226 | .ui-icon-bullet { background-position: -80px -144px; } 227 | .ui-icon-radio-off { background-position: -96px -144px; } 228 | .ui-icon-radio-on { background-position: -112px -144px; } 229 | .ui-icon-pin-w { background-position: -128px -144px; } 230 | .ui-icon-pin-s { background-position: -144px -144px; } 231 | .ui-icon-play { background-position: 0 -160px; } 232 | .ui-icon-pause { background-position: -16px -160px; } 233 | .ui-icon-seek-next { background-position: -32px -160px; } 234 | .ui-icon-seek-prev { background-position: -48px -160px; } 235 | .ui-icon-seek-end { background-position: -64px -160px; } 236 | .ui-icon-seek-start { background-position: -80px -160px; } 237 | /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ 238 | .ui-icon-seek-first { background-position: -80px -160px; } 239 | .ui-icon-stop { background-position: -96px -160px; } 240 | .ui-icon-eject { background-position: -112px -160px; } 241 | .ui-icon-volume-off { background-position: -128px -160px; } 242 | .ui-icon-volume-on { background-position: -144px -160px; } 243 | .ui-icon-power { background-position: 0 -176px; } 244 | .ui-icon-signal-diag { background-position: -16px -176px; } 245 | .ui-icon-signal { background-position: -32px -176px; } 246 | .ui-icon-battery-0 { background-position: -48px -176px; } 247 | .ui-icon-battery-1 { background-position: -64px -176px; } 248 | .ui-icon-battery-2 { background-position: -80px -176px; } 249 | .ui-icon-battery-3 { background-position: -96px -176px; } 250 | .ui-icon-circle-plus { background-position: 0 -192px; } 251 | .ui-icon-circle-minus { background-position: -16px -192px; } 252 | .ui-icon-circle-close { background-position: -32px -192px; } 253 | .ui-icon-circle-triangle-e { background-position: -48px -192px; } 254 | .ui-icon-circle-triangle-s { background-position: -64px -192px; } 255 | .ui-icon-circle-triangle-w { background-position: -80px -192px; } 256 | .ui-icon-circle-triangle-n { background-position: -96px -192px; } 257 | .ui-icon-circle-arrow-e { background-position: -112px -192px; } 258 | .ui-icon-circle-arrow-s { background-position: -128px -192px; } 259 | .ui-icon-circle-arrow-w { background-position: -144px -192px; } 260 | .ui-icon-circle-arrow-n { background-position: -160px -192px; } 261 | .ui-icon-circle-zoomin { background-position: -176px -192px; } 262 | .ui-icon-circle-zoomout { background-position: -192px -192px; } 263 | .ui-icon-circle-check { background-position: -208px -192px; } 264 | .ui-icon-circlesmall-plus { background-position: 0 -208px; } 265 | .ui-icon-circlesmall-minus { background-position: -16px -208px; } 266 | .ui-icon-circlesmall-close { background-position: -32px -208px; } 267 | .ui-icon-squaresmall-plus { background-position: -48px -208px; } 268 | .ui-icon-squaresmall-minus { background-position: -64px -208px; } 269 | .ui-icon-squaresmall-close { background-position: -80px -208px; } 270 | .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } 271 | .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } 272 | .ui-icon-grip-solid-vertical { background-position: -32px -224px; } 273 | .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } 274 | .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } 275 | .ui-icon-grip-diagonal-se { background-position: -80px -224px; } 276 | 277 | 278 | /* Misc visuals 279 | ----------------------------------*/ 280 | 281 | /* Corner radius */ 282 | .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; } 283 | .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; } 284 | .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; } 285 | .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; } 286 | 287 | /* Overlays */ 288 | .ui-widget-overlay { background: #000000; opacity: .6;filter:Alpha(Opacity=60); } 289 | .ui-widget-shadow { box-shadow: 0 0 16px rgba(0, 0, 0, 0.3); }/* 290 | * jQuery UI Resizable 1.8.16 291 | * 292 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 293 | * Dual licensed under the MIT or GPL Version 2 licenses. 294 | * http://jquery.org/license 295 | * 296 | * http://docs.jquery.com/UI/Resizable#theming 297 | */ 298 | .ui-resizable { position: relative;} 299 | .ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block; } 300 | .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } 301 | .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } 302 | .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } 303 | .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } 304 | .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } 305 | .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } 306 | .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } 307 | .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } 308 | .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}/* 309 | * jQuery UI Selectable 1.8.16 310 | * 311 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 312 | * Dual licensed under the MIT or GPL Version 2 licenses. 313 | * http://jquery.org/license 314 | * 315 | * http://docs.jquery.com/UI/Selectable#theming 316 | */ 317 | .ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; } 318 | /* 319 | * jQuery UI Accordion 1.8.16 320 | * 321 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 322 | * Dual licensed under the MIT or GPL Version 2 licenses. 323 | * http://jquery.org/license 324 | * 325 | * http://docs.jquery.com/UI/Accordion#theming 326 | */ 327 | /* IE/Win - Fix animation bug - #4615 */ 328 | .ui-accordion { width: 100%; } 329 | .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } 330 | .ui-accordion .ui-accordion-li-fix { display: inline; } 331 | .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } 332 | .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } 333 | .ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } 334 | .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } 335 | .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } 336 | .ui-accordion .ui-accordion-content-active { display: block; } 337 | /* 338 | * jQuery UI Autocomplete 1.8.16 339 | * 340 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 341 | * Dual licensed under the MIT or GPL Version 2 licenses. 342 | * http://jquery.org/license 343 | * 344 | * http://docs.jquery.com/UI/Autocomplete#theming 345 | */ 346 | .ui-autocomplete { position: absolute; cursor: default; } 347 | 348 | /* workarounds */ 349 | * html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ 350 | 351 | /* 352 | * jQuery UI Menu 1.8.16 353 | * 354 | * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about) 355 | * Dual licensed under the MIT or GPL Version 2 licenses. 356 | * http://jquery.org/license 357 | * 358 | * http://docs.jquery.com/UI/Menu#theming 359 | */ 360 | .ui-menu { 361 | list-style:none; 362 | padding: 2px; 363 | margin: 0; 364 | display:block; 365 | float: left; 366 | } 367 | .ui-menu .ui-menu { 368 | margin-top: -3px; 369 | } 370 | .ui-menu .ui-menu-item { 371 | margin:0; 372 | padding: 0; 373 | zoom: 1; 374 | float: left; 375 | clear: left; 376 | width: 100%; 377 | } 378 | .ui-menu .ui-menu-item a { 379 | text-decoration:none; 380 | display:block; 381 | padding:.2em .4em; 382 | line-height:1.5; 383 | zoom:1; 384 | } 385 | .ui-menu .ui-menu-item a.ui-state-hover, 386 | .ui-menu .ui-menu-item a.ui-state-active { 387 | font-weight: normal; 388 | margin: -1px; 389 | } 390 | /* 391 | * jQuery UI Button 1.8.16 392 | * 393 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 394 | * Dual licensed under the MIT or GPL Version 2 licenses. 395 | * http://jquery.org/license 396 | * 397 | * http://docs.jquery.com/UI/Button#theming 398 | */ 399 | .ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */ 400 | .ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */ 401 | button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */ 402 | .ui-button-icons-only { width: 3.4em; } 403 | button.ui-button-icons-only { width: 3.7em; } 404 | 405 | /*button text element */ 406 | .ui-button .ui-button-text { display: block; line-height: 1.4; } 407 | .ui-button-text-only .ui-button-text { padding: .4em 1em; } 408 | .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; } 409 | .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; } 410 | .ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; } 411 | .ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; } 412 | /* no icon support for input elements, provide padding by default */ 413 | input.ui-button { padding: .4em 1em; } 414 | 415 | /*button icon element(s) */ 416 | .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } 417 | .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } 418 | .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; } 419 | .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } 420 | .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } 421 | 422 | /*button sets*/ 423 | .ui-buttonset { margin-right: 7px; } 424 | .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } 425 | 426 | /* workarounds */ 427 | button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */ 428 | /* 429 | * jQuery UI Dialog 1.8.16 430 | * 431 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 432 | * Dual licensed under the MIT or GPL Version 2 licenses. 433 | * http://jquery.org/license 434 | * 435 | * http://docs.jquery.com/UI/Dialog#theming 436 | */ 437 | .ui-dialog { position: fixed; padding: .2em; width: 300px; overflow: hidden; } 438 | .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } 439 | .ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } 440 | .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; } 441 | .ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; } 442 | .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; } 443 | .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; } 444 | .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; } 445 | .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } 446 | .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } 447 | .ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; } 448 | .ui-draggable .ui-dialog-titlebar { cursor: move; } 449 | /* 450 | * jQuery UI Slider 1.8.16 451 | * 452 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 453 | * Dual licensed under the MIT or GPL Version 2 licenses. 454 | * http://jquery.org/license 455 | * 456 | * http://docs.jquery.com/UI/Slider#theming 457 | */ 458 | .ui-slider { position: relative; text-align: left; } 459 | .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; } 460 | .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } 461 | 462 | .ui-slider-horizontal { height: .8em; } 463 | .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } 464 | .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } 465 | .ui-slider-horizontal .ui-slider-range-min { left: 0; } 466 | .ui-slider-horizontal .ui-slider-range-max { right: 0; } 467 | 468 | .ui-slider-vertical { width: .8em; height: 100px; } 469 | .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } 470 | .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } 471 | .ui-slider-vertical .ui-slider-range-min { bottom: 0; } 472 | .ui-slider-vertical .ui-slider-range-max { top: 0; }/* 473 | * jQuery UI Tabs 1.8.16 474 | * 475 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 476 | * Dual licensed under the MIT or GPL Version 2 licenses. 477 | * http://jquery.org/license 478 | * 479 | * http://docs.jquery.com/UI/Tabs#theming 480 | */ 481 | .ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ 482 | .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } 483 | .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; } 484 | .ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } 485 | .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; } 486 | .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } 487 | .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ 488 | .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } 489 | .ui-tabs .ui-tabs-hide { display: none !important; } 490 | /* 491 | * jQuery UI Datepicker 1.8.16 492 | * 493 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 494 | * Dual licensed under the MIT or GPL Version 2 licenses. 495 | * http://jquery.org/license 496 | * 497 | * http://docs.jquery.com/UI/Datepicker#theming 498 | */ 499 | .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } 500 | .ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } 501 | .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } 502 | .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } 503 | .ui-datepicker .ui-datepicker-prev { left:2px; } 504 | .ui-datepicker .ui-datepicker-next { right:2px; } 505 | .ui-datepicker .ui-datepicker-prev-hover { left:1px; } 506 | .ui-datepicker .ui-datepicker-next-hover { right:1px; } 507 | .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } 508 | .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } 509 | .ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } 510 | .ui-datepicker select.ui-datepicker-month-year {width: 100%;} 511 | .ui-datepicker select.ui-datepicker-month, 512 | .ui-datepicker select.ui-datepicker-year { width: 49%;} 513 | .ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } 514 | .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } 515 | .ui-datepicker td { border: 0; padding: 1px; } 516 | .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } 517 | .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } 518 | .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } 519 | .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } 520 | 521 | /* with multiple calendars */ 522 | .ui-datepicker.ui-datepicker-multi { width:auto; } 523 | .ui-datepicker-multi .ui-datepicker-group { float:left; } 524 | .ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } 525 | .ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } 526 | .ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } 527 | .ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } 528 | .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } 529 | .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } 530 | .ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } 531 | .ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } 532 | 533 | /* RTL support */ 534 | .ui-datepicker-rtl { direction: rtl; } 535 | .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } 536 | .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } 537 | .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } 538 | .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } 539 | .ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } 540 | .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } 541 | .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } 542 | .ui-datepicker-rtl .ui-datepicker-group { float:right; } 543 | .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } 544 | .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } 545 | 546 | /* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ 547 | .ui-datepicker-cover { 548 | display: none; /*sorry for IE5*/ 549 | display/**/: block; /*sorry for IE5*/ 550 | position: absolute; /*must have*/ 551 | z-index: -1; /*must have*/ 552 | filter: mask(); /*must have*/ 553 | top: -4px; /*must have*/ 554 | left: -4px; /*must have*/ 555 | width: 200px; /*must have*/ 556 | height: 200px; /*must have*/ 557 | }/* 558 | * jQuery UI Progressbar 1.8.16 559 | * 560 | * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) 561 | * Dual licensed under the MIT or GPL Version 2 licenses. 562 | * http://jquery.org/license 563 | * 564 | * http://docs.jquery.com/UI/Progressbar#theming 565 | */ 566 | .ui-progressbar { height:2em; text-align: left; } 567 | .ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; } 568 | .ui-progressbar .ui-widget-header { 569 | background-color: #83B4D8; 570 | background-image: linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 571 | background-image: -o-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 572 | background-image: -moz-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 573 | background-image: -webkit-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 574 | background-image: -ms-linear-gradient(bottom, rgb(114,167,207) 0%, rgb(144,197,238) 100%); 575 | } -------------------------------------------------------------------------------- /wp-admin-jquery-ui.php: -------------------------------------------------------------------------------- 1 | 42 |
43 |

jQuery UI Demo

44 | 45 | 46 |

Accordion

47 |
48 |
49 |

First

50 |
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
51 |
52 |
53 |

Second

54 |
Phasellus mattis tincidunt nibh.
55 |
56 |
57 |

Third

58 |
Nam dui erat, auctor a, dignissim quis.
59 |
60 |
61 | 62 | 63 |

Tabs

64 |
65 | 70 |
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
71 |
Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.
72 |
Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.
73 |
74 | 75 | 76 |

Dialog

77 |

Open Dialog

78 | 79 | 80 |

Overlay and Shadow Classes (not currently used in UI widgets)

81 |
82 |

Lorem ipsum dolor sit amet, Nulla nec tortor. Donec id elit quis purus consectetur consequat.

Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci.

Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat.

Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam.

Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante.

Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi.

83 | 84 | 85 |
86 |
87 |
88 |

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

89 |
90 |
91 | 92 |
93 | 94 | 95 | 96 |
97 |

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

98 |
99 | 100 | 101 | 102 |

Framework Icons (content color preview)

103 | 298 | 299 | 300 | 301 |

Slider

302 |
303 | 304 | 305 |

Datepicker

306 |
307 | 308 | 309 |

Autocomplete

310 | 311 | 312 | 313 | 314 |

Autocomplete (Core style) - needs work

315 | 316 | 317 | 318 | 319 |

Progressbar

320 |
321 | 322 | 323 |

Highlight / Error

324 |
325 |
326 |

327 | Hey! Sample ui-state-highlight style.

328 |
329 |
330 |
331 |
332 |
333 |

334 | Alert: Sample ui-state-error style.

335 |
336 |
337 |
338 | 341 | --------------------------------------------------------------------------------