-
Notifications
You must be signed in to change notification settings - Fork 97
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'heidi/FLUID-4331'
* heidi/FLUID-4331: FLUID-4331: Fixed js parse error. Added theming for panel bar, fixed font sizing FLUID-4331: FPanel styling FLUID-4331: Splitting frame and non-frame css for FatPanel FLUID-4331: removed duplicate class name FLUID-4331: cleaned up the iframe renderer
- Loading branch information
Showing
6 changed files
with
239 additions
and
235 deletions.
There are no files selected for viewing
19 changes: 0 additions & 19 deletions
19
src/webapp/components/uiOptions/css/FatPanelSlidingPanel.css
This file was deleted.
Oops, something went wrong.
230 changes: 23 additions & 207 deletions
230
src/webapp/components/uiOptions/css/FatPanelUIOptions.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,222 +1,38 @@ | ||
/* UI Options Fat Panel styles */ | ||
|
||
.fl-uiOptions-fatPanel { | ||
border: 0; | ||
min-width: 960px; | ||
background-color: #fff; | ||
} | ||
|
||
/* Panel bar */ | ||
/* Top bar and show/hide button */ | ||
.fl-uiOptions-fatPanel .fl-panelBar { | ||
width: 100%; | ||
height: 5px; | ||
border-bottom: 1px solid #ccc; | ||
width: 100%; | ||
height: 5px; | ||
background-color: #fff; | ||
border-bottom: 1px solid #ccc; | ||
} | ||
|
||
/* Show/hide panel toggle button */ | ||
.fl-uiOptions-fatPanel .fl-toggleButton { | ||
float:right; | ||
text-transform: uppercase; | ||
font-weight: bold; | ||
border: 0px; | ||
background-color: white; | ||
padding: 5px; | ||
margin-right: 10px; | ||
border-radius: 8px; | ||
border-bottom: 1px solid #ccc; | ||
} | ||
|
||
/* Reset link */ | ||
.fl-uiOptions-fatPanel #reset { | ||
background-color: #333333; | ||
color: #fff; | ||
text-transform: uppercase; | ||
font-weight: bold; | ||
display: block; | ||
padding: 0.75em 1.5em 0.7em 3em; | ||
} | ||
|
||
/* Tabs */ | ||
.fl-uiOptions-fatPanel ul.fl-tabs { | ||
background-color: #333333; | ||
color: #fff; | ||
margin-top: 0px; | ||
border-bottom: none; | ||
} | ||
|
||
.fl-uiOptions-fatPanel .fl-tabs li a { | ||
background-color: #333333; | ||
color: #fff; | ||
text-transform: uppercase; | ||
font-weight: bold; | ||
border: 0px; | ||
} | ||
.fl-uiOptions-fatPanel ul.fl-tabs li:first-child a { | ||
margin-left: -10px; | ||
} | ||
|
||
.fl-uiOptions-fatPanel .fl-tabs .ui-tabs-selected a { | ||
float:right; | ||
text-transform: uppercase; | ||
font-weight: bold; | ||
border: 0px; | ||
background-color: white; | ||
padding: 5px; | ||
margin-right: 10px; | ||
border-radius: 8px; | ||
border-bottom: 1px solid #ccc; | ||
} | ||
|
||
/* IFrame */ | ||
.fl-uiOptions-fatPanel-iframe { | ||
border: 0; | ||
background-color: #fff; | ||
color: #000; | ||
} | ||
|
||
/* jQuery UI Tabs styles */ | ||
.fl-uiOptions-fatPanel.ui-tabs { position: relative; zoom: 1; padding:0px; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-hide { display: none !important; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-nav { padding: 0px; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-nav li { top: 0px; margin: 0px; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-nav li a { float: left; padding: 1em 1.5em 1em 3em; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-state-default { border: none; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-helper-reset { line-height: 1em; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 0px; } | ||
.fl-uiOptions-fatPanel .ui-corner-top { -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 0px; } | ||
.fl-uiOptions-fatPanel .ui-corner-all { -moz-border-radius: 0px; } | ||
.fl-uiOptions-fatPanel.ui-widget { font-family: "Myriad Pro",Helvetica,Arial,sans-serif; font-size: 1em; } /* fix a jquery theme bugs where font-size was set to 1.1em or 1.2em. */ | ||
.fl-uiOptions-fatPanel.ui-widget-content { border: none; } | ||
.fl-uiOptions-fatPanel.ui-tabs .ui-widget-header { background: none; border: 0px; background-color: #333333; } | ||
|
||
/* Tab images */ | ||
.fl-uiOptions-fatPanel .fl-tab-text, .fl-uiOptions-fatPanel .fl-tab-layout, .fl-uiOptions-fatPanel .fl-tab-links, .fl-uiOptions-fatPanel #reset { | ||
background-repeat: no-repeat; | ||
background-position: 1.1em 0.6em; | ||
} | ||
|
||
.fl-uiOptions-fatPanel .fl-tab-text { background-image: url('../images/default/uio_icon_textanddisplay_defaultInverted_16x16.png'); } | ||
.fl-uiOptions-fatPanel .fl-tab-layout { background-image: url('../images/default/uio_icon_layoutandnavigation_defaultInverted_16x16.png'); } | ||
.fl-uiOptions-fatPanel .fl-tab-links { background-image: url('../images/default/uio_icon_linksandbuttons_defaultInverted_16x16.png'); } | ||
.fl-uiOptions-fatPanel #reset { background-image: url('../images/default/uio_icon_reset_defaultInverted_16x16.png'); } | ||
.fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-text { background-image: url('../images/default/uio_icon_textanddisplay_default_16x16.png'); } | ||
.fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-layout { background-image: url('../images/default/uio_icon_layoutandnavigation_default_16x16.png'); } | ||
.fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-links { background-image: url('../images/default/uio_icon_linksandbuttons_default_16x16.png'); } | ||
|
||
/* Tab Pane */ | ||
ul.fl-pane li { | ||
float:left; | ||
padding-left: 10px; | ||
margin-right: 30px; | ||
} | ||
|
||
/* Controls */ | ||
.fl-uiOptions-fatPanel .fl-uiOptions-text li { | ||
float: left; | ||
} | ||
.fl-uiOptions-fatPanel .fl-uiOptions-layout li, .fl-uiOptions-fatPanel .fl-uiOptions-links li { | ||
clear: both; | ||
} | ||
|
||
.fl-uiOptions-fatPanel .fl-uiOptions label { | ||
text-transform: uppercase; | ||
padding-bottom: 15px; | ||
width: 200px; | ||
} | ||
|
||
.fl-uiOptions-fatPanel .fl-inputs { | ||
clear:both; | ||
} | ||
|
||
/* Sliders */ | ||
.fl-uiOptions .fl-slider-horz { | ||
width: 100px; | ||
} | ||
|
||
.fl-uiOptions .fl-slider-input { | ||
clear: both; | ||
float:left; | ||
margin-top: 1em; | ||
} | ||
|
||
/* Theming */ | ||
/* Override theme tab rounding */ | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-corner-all, | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-corner-all, | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-corner-all, | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-corner-all { -moz-border-radius: 0px; border: 0px; } | ||
|
||
/* Tab images - black on white */ | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-tab-text { background-image: url('../images/hc/uio_icon_textanddisplay_hcInverted_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-tab-layout { background-image: url('../images/hc/uio_icon_layoutandnavigation_hcInverted_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-tab-links { background-image: url('../images/hc/uio_icon_linksandbuttons_hcInverted_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel #reset { background-image: url('../images/hc/uio_icon_reset_hcInverted_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-text, | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-text { background-image: url('../images/hc/uio_icon_textanddisplay_hc_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-layout, | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-layout { background-image: url('../images/hc/uio_icon_layoutandnavigation_hc_16x16.png'); } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-links, | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-links { background-image: url('../images/hc/uio_icon_linksandbuttons_hc_16x16.png'); } | ||
|
||
/* Tab images - white on black */ | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-tab-text { background-image: url('../images/hci/uio_icon_textanddisplay_hciInverted_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-tab-layout { background-image: url('../images/hci/uio_icon_layoutandnavigation_hciInverted_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-tab-links { background-image: url('../images/hci/uio_icon_linksandbuttons_hciInverted_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel #reset { background-image: url('../images/hci/uio_icon_reset_hciInverted_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-text, | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-text { background-image: url('../images/hci/uio_icon_textanddisplay_hci_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-layout, | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-layout { background-image: url('../images/hci/uio_icon_layoutandnavigation_hci_16x16.png'); } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-links, | ||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-links { background-image: url('../images/hci/uio_icon_linksandbuttons_hci_16x16.png'); } | ||
|
||
/* Tab images - black on yellow */ | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-tab-text { background-image: url('../images/blackYellow/uio_icon_textanddisplay_blackYellowInverted_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-tab-layout { background-image: url('../images/blackYellow/uio_icon_layoutandnavigation_blackYellowInverted_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-tab-links { background-image: url('../images/blackYellow/uio_icon_linksandbuttons_blackYellowInverted_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel #reset { background-image: url('../images/blackYellow/uio_icon_reset_blackYellowInverted_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-text, | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-text { background-image: url('../images/blackYellow/uio_icon_textanddisplay_blackYellow_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-layout, | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-layout { background-image: url('../images/blackYellow/uio_icon_layoutandnavigation_blackYellow_16x16.png'); } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-links, | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-links { background-image: url('../images/blackYellow/uio_icon_linksandbuttons_blackYellow_16x16.png'); } | ||
|
||
/* Tab images - yellow on black */ | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-tab-text { background-image: url('../images/yellowBlack/uio_icon_textanddisplay_yellowBlackInverted_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-tab-layout { background-image: url('../images/yellowBlack/uio_icon_layoutandnavigation_yellowBlackInverted_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-tab-links { background-image: url('../images/yellowBlack/uio_icon_linksandbuttons_yellowBlackInverted_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel #reset { background-image: url('../images/yellowBlack/uio_icon_reset_yellowBlackInverted_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-text, | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-text { background-image: url('../images/yellowBlack/uio_icon_textanddisplay_yellowBlack_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-layout, | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-layout { background-image: url('../images/yellowBlack/uio_icon_layoutandnavigation_yellowBlack_16x16.png'); } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-tabs-selected .fl-tab-links, | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-state-hover .fl-tab-links { background-image: url('../images/yellowBlack/uio_icon_linksandbuttons_yellowBlack_16x16.png'); } | ||
|
||
/* Adjust colours for specific themes */ | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-widget-header { background: 0;} | ||
.fl-theme-hc .fl-uiOptions-fatPanel ul.fl-tabs { background-color: #000; } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-tabs a { background-color: #000; color: #fff;} | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-tabs .ui-tabs-selected a { background-color: #fff; color: #000; } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .ui-widget-header .ui-state-active { background: none no-repeat scroll 0% 0% #fff; } /* Override a background image that was making the tab larger than necessary. */ | ||
.fl-theme-hc .fl-uiOptions-fatPanel #reset { background-color: #000; } | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-panelBar, | ||
.fl-theme-hc .fl-uiOptions-fatPanel .fl-toggleButton { background-color: #fff; border-color: #000; } | ||
|
||
.fl-theme-hci .fl-uiOptions-fatPanel .ui-widget-header { background: 0;} | ||
.fl-theme-hci .fl-uiOptions-fatPanel ul.fl-tabs { background-color: #fff; } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-tabs a { background-color: #fff; color: #000; } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-tabs .ui-tabs-selected a { background-color: #000; color: #fff; } | ||
.fl-theme-hci .fl-uiOptions-fatPanel #reset { background-color: #fff; color: #000; } | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-panelBar, | ||
.fl-theme-hci .fl-uiOptions-fatPanel .fl-toggleButton { background-color: #000; border-color: #fff; color: #fff; } | ||
|
||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-widget-header { background: 0;} | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel ul.fl-tabs { background-color: #000; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-tabs a { background-color: #000; color: #ffff00; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-tabs .ui-tabs-selected a { background-color: #ffff00; color: #000; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-widget-header .ui-state-default {background: none no-repeat scroll 0% 0% #000; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-tabs .fl-tabs li {background-color: #000; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .ui-widget-content { background:0; color: #000;} | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-uiOptions .fl-slider .fl-handle, .fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-uiOptions .fl-slider a { border: 1px solid #000;} | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-slider {background-color: #000;} | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel #reset { background-color: #000; color: #ffff00; } | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-panelBar, | ||
.fl-theme-blackYellow .fl-uiOptions-fatPanel .fl-toggleButton { background-color: #FFFF00; border-color: #000; } | ||
|
||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-widget-header { background: 0;} | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel ul.fl-tabs { background-color: #ffff00; } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-tabs a { background-color: #ffff00; color: #000; } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-tabs .ui-tabs-selected a { background-color: #000; color: #ffff00 } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-widget-header .ui-state-default {background: none no-repeat scroll 0% 0% #ffff00; } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-tabs .fl-tabs li {background-color: #ffff00; } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .ui-widget-content { background:0; color: #ffff00;} | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-uiOptions .fl-slider .fl-handle, .fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-uiOptions .fl-slider a { border: 1px solid #ffff00;} | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-slider {background-color: #ffff00;} | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel #reset { background-color: #ffff00; color: #000; } | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-panelBar, | ||
.fl-theme-yellowBlack .fl-uiOptions-fatPanel .fl-toggleButton { background-color: #000; border-color: #ffff00; color: #ffff00 } |
Oops, something went wrong.