--- panopoly-jquery-ui-theme-orig-beautified.css 2015-06-15 13:45:06.217875171 -0500 +++ panopoly-jquery-ui-theme-beautified.css 2015-06-15 13:43:58.049876391 -0500 @@ -84,14 +84,14 @@ * * http://docs.jquery.com/UI/Theming/API * - * To view and modify this theme, visit http://jqueryui.com/themeroller/ + * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=\\'Open%20Sans\\',%20\\'Lucida%20Grande\\',%20Tahoma,%20Verdana,%20sans-serif;&fwDefault=normal&fsDefault=13px&cornerRadius=5px&bgColorHeader=333333&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=50&borderColorHeader=0&fcHeader=ffffff&iconColorHeader=000000&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=cccccc&fcContent=333333&iconColorContent=222222&bgColorDefault=cccccc&bgTextureDefault=02_glass.png&bgImgOpacityDefault=0&borderColorDefault=0&fcDefault=333333&iconColorDefault=888888&bgColorHover=ffffff&bgTextureHover=02_glass.png&bgImgOpacityHover=0&borderColorHover=999999&fcHover=333333&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=02_glass.png&bgImgOpacityActive=0&borderColorActive=aaaaaa&fcActive=333333&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=05_inset_soft.png&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=000000&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=100&opacityOverlay=80&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=0&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px */ /* Component containers ----------------------------------*/ .ui-widget { - font-family: Verdana, Arial, sans-serif; - font-size: 1.1em; + font-family: 'Open Sans', 'Lucida Grande', Tahoma, Verdana, sans-serif; + font-size: 13px; } .ui-widget .ui-widget { font-size: 1em; @@ -100,25 +100,34 @@ .ui-widget select, .ui-widget textarea, .ui-widget button { - font-family: Verdana, Arial, sans-serif; + font-family: 'Open Sans', 'Lucida Grande', Tahoma, Verdana, sans-serif; font-size: 1em; } .ui-widget-content { - border: 1px solid #aaaaaa; - background: #ffffff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; - color: #222222; + border: none; + background: #FFF; + color: #333333; } .ui-widget-content a { - color: #222222; + color: #333333; } .ui-widget-header { - border: 1px solid #aaaaaa; - background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x; - color: #222222; - font-weight: bold; + border: none; + background: #666; + background-image: linear-gradient(bottom, #333333 0%, #666666 100%); + background-image: -o-linear-gradient(bottom, #333333 0%, #666666 100%); + background-image: -moz-linear-gradient(bottom, #333333 0%, #666666 100%); + background-image: -webkit-linear-gradient(bottom, #333333 0%, #666666 100%); + background-image: -ms-linear-gradient(bottom, #333333 0%, #666666 100%); + background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #333333), color-stop(1, #666666)); + color: #fff; + font: bold 13px/25px 'Open Sans', 'Lucida Sans', 'Lucida Grande', verdana sans-serif; + vertical-align: middle; + padding: 0 14px 0 24px; + min-height: 25px; } .ui-widget-header a { - color: #222222; + color: #ffffff; } /* Interaction states ----------------------------------*/ @@ -126,15 +135,15 @@ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { - border: 1px solid #d3d3d3; - background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; + border: none; + background: #cccccc; font-weight: normal; - color: #555555; + color: #333333; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { - color: #555555; + color: #333333; text-decoration: none; } .ui-state-hover, @@ -144,27 +153,27 @@ .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #999999; - background: #dadada url(images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x; + background: #ffffff; font-weight: normal; - color: #212121; + color: #333333; } .ui-state-hover a, .ui-state-hover a:hover { - color: #212121; + color: #333333; text-decoration: none; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa; - background: #ffffff url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; + background: #ffffff; font-weight: normal; - color: #212121; + color: #333333; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { - color: #212121; + color: #333333; text-decoration: none; } .ui-widget:active { @@ -177,7 +186,7 @@ .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #fcefa1; - background: #fbf9ee url(images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; + background: #fbf9ee url(../images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; color: #363636; } .ui-state-highlight a, @@ -189,7 +198,7 @@ .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #cd0a0a; - background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; + background: #fef1ec url(../images/ui-bg_inset-soft_95_fef1ec_1x100.png) 50% bottom repeat-x; color: #cd0a0a; } .ui-state-error a, @@ -228,30 +237,30 @@ .ui-icon { width: 16px; height: 16px; - background-image: url(images/ui-icons_222222_256x240.png); + background-image: url(../images/ui-icons_222222_256x240.png); } .ui-widget-content .ui-icon { - background-image: url(images/ui-icons_222222_256x240.png); + background-image: url(../images/ui-icons_222222_256x240.png); } .ui-widget-header .ui-icon { - background-image: url(images/ui-icons_222222_256x240.png); + background-image: url(../images/ui-icons_000000_256x240.png); } .ui-state-default .ui-icon { - background-image: url(images/ui-icons_888888_256x240.png); + background-image: url(../images/ui-icons_888888_256x240.png); } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon { - background-image: url(images/ui-icons_454545_256x240.png); + background-image: url(../images/ui-icons_454545_256x240.png); } .ui-state-active .ui-icon { - background-image: url(images/ui-icons_454545_256x240.png); + background-image: url(../images/ui-icons_454545_256x240.png); } .ui-state-highlight .ui-icon { - background-image: url(images/ui-icons_2e83ff_256x240.png); + background-image: url(../images/ui-icons_2e83ff_256x240.png); } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon { - background-image: url(images/ui-icons_cd0a0a_256x240.png); + background-image: url(../images/ui-icons_cd0a0a_256x240.png); } /* positioning */ @@ -787,51 +796,95 @@ .ui-corner-top, .ui-corner-left, .ui-corner-tl { - -moz-border-radius-topleft: 4px; - -webkit-border-top-left-radius: 4px; - -khtml-border-top-left-radius: 4px; - border-top-left-radius: 4px; + -moz-border-radius-topleft: 5px; + -webkit-border-top-left-radius: 5px; + -khtml-border-top-left-radius: 5px; + border-top-left-radius: 5px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { - -moz-border-radius-topright: 4px; - -webkit-border-top-right-radius: 4px; - -khtml-border-top-right-radius: 4px; - border-top-right-radius: 4px; + -moz-border-radius-topright: 5px; + -webkit-border-top-right-radius: 5px; + -khtml-border-top-right-radius: 5px; + border-top-right-radius: 5px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { - -moz-border-radius-bottomleft: 4px; - -webkit-border-bottom-left-radius: 4px; - -khtml-border-bottom-left-radius: 4px; - border-bottom-left-radius: 4px; + -moz-border-radius-bottomleft: 0; + -webkit-border-bottom-left-radius: 0; + -khtml-border-bottom-left-radius: 0; + border-bottom-left-radius: 0; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { - -moz-border-radius-bottomright: 4px; - -webkit-border-bottom-right-radius: 4px; - -khtml-border-bottom-right-radius: 4px; - border-bottom-right-radius: 4px; + -moz-border-radius-bottomright: 0; + -webkit-border-bottom-right-radius: 0; + -khtml-border-bottom-right-radius: 0; + border-bottom-right-radius: 0; +} +/* Remove Corner Radius for Media Browser */ + +#media-browser-page-wrapper .ui-corner-all, +.media-wrapper, +.media-wrapper .ui-corner-all, +.media-wrapper .ui-corner-top, +.media-wrapper .ui-corner-left, +.media-wrapper .ui-corner-tl { + -moz-border-radius-topleft: 0; + -webkit-border-top-left-radius: 0; + -khtml-border-top-left-radius: 0; + border-top-left-radius: 0; +} +#media-browser-page-wrapper .ui-corner-all, +.media-wrapper, +.media-wrapper .ui-corner-all, +.media-wrapper .ui-corner-top, +.media-wrapper .ui-corner-right, +.media-wrapper .ui-corner-tl { + -moz-border-radius-topright: 0; + -webkit-border-top-right-radius: 0; + -khtml-border-top-right-radius: 0; + border-top-right-radius: 0; +} +/* Restore Corner Radius for Media Tabs */ + +#media-browser-tab.ui-corner-all, +#media-browser-tab.ui-corner-top, +#media-browser-tab.ui-corner-left, +#media-browser-tab.ui-corner-tl { + -moz-border-radius-topleft: 5px; + -webkit-border-top-left-radius: 5px; + -khtml-border-top-left-radius: 5px; + border-top-left-radius: 5px; +} +#media-browser-tab.ui-corner-all, +#media-browser-tab.ui-corner-top, +#media-browser-tab.ui-corner-right, +#media-browser-tab.ui-corner-tr { + -moz-border-radius-topright: 5px; + -webkit-border-top-right-radius: 5px; + -khtml-border-top-right-radius: 5px; + border-top-right-radius: 5px; } /* Overlays */ .ui-widget-overlay { - background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; - opacity: .3; - filter: Alpha(Opacity=30); + background: #000000 url(../images/ui-bg_flat_100_000000_40x100.png) 50% 50% repeat-x; + opacity: .80; + filter: Alpha(Opacity=80); } .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; - background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; - opacity: .3; - filter: Alpha(Opacity=30); + background: #aaaaaa url(../images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; + opacity: 0; + filter: Alpha(Opacity=0); -moz-border-radius: 8px; -khtml-border-radius: 8px; -webkit-border-radius: 8px; @@ -943,30 +996,51 @@ .ui-dialog { position: absolute; - padding: .2em; + padding: 0; + border: 0; width: 300px; overflow: hidden; } .ui-dialog .ui-dialog-titlebar { - padding: .4em 1em; position: relative; + height: 50px; + font-size: 16px; + line-height: 50px; } .ui-dialog .ui-dialog-title { float: left; - margin: .1em 16px .1em 0; + margin: 0; } -.ui-dialog .ui-dialog-titlebar-close { +.ui-dialog a.ui-dialog-titlebar-close { position: absolute; - right: .3em; - top: 50%; - width: 19px; - margin: -10px 0 0 0; - padding: 1px; - height: 18px; + right: 15px; + top: 0; + background: none; + border: none; +} +.ui-dialog a.ui-dialog-titlebar-close:hover, +.ui-dialog a.ui-dialog-titlebar-close:focus, +.ui-dialog a.ui-dialog-titlebar-close:active { + background: none; + border: none; +} +.ui-dialog a.ui-dialog-titlebar-close span.ui-icon { + display: block; + padding: 0; + height: 15px; + width: 16px; + margin: 15px 0 0 0; + background: url(../images/close-popup.png) no-repeat left top; +} +.ui-dialog a.ui-dialog-titlebar-close:hover span.ui-icon, +.ui-dialog a.ui-dialog-titlebar-close:focus span.ui-icon, +.ui-dialog a.ui-dialog-titlebar-close:active span.ui-icon { + background-image: url(../images/close-popup.png); + background-position: left -15px; } .ui-dialog .ui-dialog-titlebar-close span { display: block; - margin: 1px; + margin: 0; } .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { @@ -975,7 +1049,7 @@ .ui-dialog .ui-dialog-content { position: relative; border: 0; - padding: .5em 1em; + padding: 0; background: none; overflow: auto; zoom: 1; @@ -1015,14 +1089,15 @@ .ui-tabs { position: relative; - padding: .2em; + padding: 0; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ .ui-tabs .ui-tabs-nav { margin: 0; - padding: .2em .2em 0; + padding: 5px 5px 0; + border: none !important; } .ui-tabs .ui-tabs-nav li { list-style: none; @@ -1031,14 +1106,34 @@ top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; - padding: 0; + padding: 0 0 1px; white-space: nowrap; } +.ui-tabs .ui-tabs-nav li.ui-state-default { + background: #CCC; + background-image: linear-gradient(bottom, #ABABAB 0%, #CCCCCC 13%); + background-image: -o-linear-gradient(bottom, #ABABAB 0%, #CCCCCC 13%); + background-image: -moz-linear-gradient(bottom, #ABABAB 0%, #CCCCCC 13%); + background-image: -webkit-linear-gradient(bottom, #ABABAB 0%, #CCCCCC 13%); + background-image: -ms-linear-gradient(bottom, #ABABAB 0%, #CCCCCC 13%); + background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #ABABAB), color-stop(0.13, #CCCCCC)); +} +.ui-tabs .ui-tabs-nav li.ui-state-active, +.ui-tabs .ui-tabs-nav li.ui-state-hover, +.ui-tabs .ui-tabs-nav li.ui-tabs-selected { + background: #FFF; + background-image: none; +} .ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } +.ui-tabs .ui-tabs-nav li.ui-state-hover, +.ui-tabs .ui-tabs-nav li.ui-state-active, +.ui-tabs .ui-tabs-nav li.ui-tabs-selected { + border: none; +} .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px;