658 lines
12 KiB
CSS
658 lines
12 KiB
CSS
/**
|
|
* Common CSS for gCube Portlets
|
|
*
|
|
*/
|
|
@import url(normalize.css);
|
|
|
|
/****** PANELS STYLES *******/
|
|
|
|
|
|
|
|
/* Use it for your portlet main Panel */
|
|
.gcube_panel {
|
|
background: #FFFFFF;
|
|
border: 1px solid #99BBE8;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.gcube_poli_panel {
|
|
background: #FFFFFF;
|
|
border: 1px outset #99BBE8;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.gcube_noborders_panel {
|
|
background: #FFFFFF;
|
|
border: 0px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* or */
|
|
.gcube_panel_thick_border {
|
|
background: #FFFFFF;
|
|
border: 2px solid #99BBE8;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* To Use for the Portlet Main Header (if any) */
|
|
.gcube_header_background {
|
|
background: #d6e3F3 !important;
|
|
border-bottom: 1px solid #6ab4eb;
|
|
border: none;
|
|
border-bottom: 1px solid #6ab4eb;
|
|
line-height: 15px;
|
|
overflow: hidden;
|
|
padding: 1px 4px 1px 4px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.gcube_inner_header_background {
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
color: #15428B;
|
|
border-top: 1px solid #0D70C6;
|
|
border-left: 1px solid #0D70C6;
|
|
border-right: 1px solid #0D70C6;
|
|
background: transparent url(gcube_images/bg_nonselected_stack_item.png)
|
|
repeat;
|
|
}
|
|
|
|
.gcube_content_panel {
|
|
padding: 4px;
|
|
}
|
|
|
|
.gcube_panel_background {
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
border: 1px solid #99BBE8;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
color: #15428B;
|
|
background: transparent url(gcube_images/bg_nonselected_stack_item.png)
|
|
repeat;
|
|
}
|
|
|
|
.gcube_header_caption {
|
|
color: #15428B;
|
|
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.23);
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 10px;
|
|
font-size-adjust: none;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
font-weight: bold;
|
|
padding: 1px 4px 1px 2px;
|
|
}
|
|
|
|
/****** BORDERS STYLES *******/
|
|
.gcube_border_thin {
|
|
border: 1px solid #99BBE8;
|
|
}
|
|
|
|
.gcube_border_standard {
|
|
border: 2px solid #99BBE8;
|
|
}
|
|
|
|
/****** TABLE STYLES *******/
|
|
.gcube_table_header {
|
|
background: #d6e3F3 !important;
|
|
border-bottom: 1px solid #6ab4eb;
|
|
border: none;
|
|
color: #000000;
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 11px;
|
|
font-size-adjust: none;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
line-height: 15px;
|
|
overflow: hidden;
|
|
padding: 1px 4px 1px 4px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.pad2 {
|
|
padding: 1px 2px 1px 2px;
|
|
}
|
|
|
|
.margin {
|
|
margin: 1px 2px 1px 2px;
|
|
}
|
|
|
|
/****** FORM COMPONENTS STYLES ******/
|
|
.gwt-CheckBox {
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.gwt-CheckBox label {
|
|
padding: 3px;
|
|
}
|
|
|
|
.gwt-TextBox {
|
|
background: #FFFFFF url(gcube_images/text-bg.gif) repeat-x scroll 0 0;
|
|
border: 1px solid #B5B8C8;
|
|
padding: 1px 3px;
|
|
}
|
|
|
|
.gwt-PushButton-up,.gwt-PushButton-up-hovering,.gwt-PushButton-down,.gwt-PushButton-down-hovering
|
|
{
|
|
cursor: hand;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.gwt-Button {
|
|
color: #464646;
|
|
border: 1px solid #BBB;
|
|
-moz-border-radius: 2em;
|
|
-webkit-border-radius: 2em;
|
|
border-radius: 4px;
|
|
background: #F2F2F2;
|
|
font-size: 12px;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
padding: 4px 15px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.gwt-Button[disabled]:hover,.gwt-Button[disabled]:active,.gwt-Button[disabled]
|
|
{
|
|
color: #CCC;
|
|
border-color: #BBB;
|
|
cursor: default;
|
|
opacity: 1.0;
|
|
background: #F2F2F2;
|
|
}
|
|
|
|
.gwt-Button:hover {
|
|
border-color: #222;
|
|
color: #222;
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.gwt-Button:active {
|
|
background: #e3e8f3;
|
|
}
|
|
|
|
.gwt-TextArea {
|
|
border: 1px inset #3366CC;
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
.button_help {
|
|
cursor: hand;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.button_help:hover {
|
|
opacity: 0.6;
|
|
filter: alpha(opacity = 60);
|
|
}
|
|
|
|
/****** FONTS ******/
|
|
.font_bold {
|
|
font-weight: bold
|
|
}
|
|
|
|
.font_family {
|
|
font-family: Verdana, Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
.font_tiny {
|
|
font-size: 8px;
|
|
}
|
|
|
|
.font_small {
|
|
font-size: 10px;
|
|
}
|
|
|
|
.font_standard {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.font_large {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.font_color {
|
|
color: #15428B;
|
|
}
|
|
|
|
/****** MOUSE POINTERS ******/
|
|
.crossCursor {
|
|
cursor: crosshair;
|
|
}
|
|
|
|
.widthResizeCursor {
|
|
cursor: e-resize;
|
|
}
|
|
|
|
.heightResizeCursor {
|
|
cursor: s-resize;
|
|
}
|
|
|
|
.seResizeCursor {
|
|
cursor: se-resize;
|
|
}
|
|
|
|
.cursor-move {
|
|
cursor: move;
|
|
}
|
|
|
|
/*
|
|
* Use This to make the hand appear */
|
|
.selectable {
|
|
cursor: hand;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/****** BASKETING STYLES *******/
|
|
.gcube_basket_item {
|
|
background: transparent url(gcube_images/button_Down_stretch.png)
|
|
repeat-x scroll 0 0px;
|
|
border: 1px solid #0D70C6;
|
|
color: #15428B;
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 12px;
|
|
overflow: hidden;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.gcube_selected {
|
|
border: 0px solid #D9E8FB;
|
|
background-color: #D9E8FB;
|
|
padding: 1px 4px 1px 4px;
|
|
}
|
|
|
|
/****** DIALOG BOX STYLES ******/
|
|
.gwt-PopupPanel {
|
|
background: #FFFFFF none repeat-x scroll 0 0;
|
|
border: 3px solid #99BBE8;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.gwt-DecoratedPopupPanel {
|
|
background: #FFFFFF none repeat-x scroll 0 0;
|
|
border: 3px solid #99BBE8;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/** dialog box **/
|
|
.gcube_DialogBox {
|
|
z-index: 10001;
|
|
background: #FFFFFF none repeat-x scroll 0 0;
|
|
border: 5px solid #CCC;
|
|
border-radius: 4px;
|
|
-moz-border-radius: 4px;
|
|
-webkit-border-radius: 4px;
|
|
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.80);
|
|
-moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.80);
|
|
-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.80);
|
|
}
|
|
|
|
.gcube_DialogBox .Caption {
|
|
color: #19326C;
|
|
font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
|
|
"Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
|
|
font-size: 15px;
|
|
font-weight: normal;
|
|
padding: 5px;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogContent div {
|
|
font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
|
|
"Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
|
|
font-size: 13px;
|
|
color: #555;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogTop {
|
|
background: #EDEDEF;
|
|
margin: 0px;
|
|
padding-left: 5px;
|
|
height: 20px;
|
|
border-bottom: 1px #CCC solid;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogMiddleCenter {
|
|
padding: 5px;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogMiddleLeft {
|
|
background: #FFF;
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogMiddleRight {
|
|
background: #FFF;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.gcube_DialogBox .dialogBottom {
|
|
background: #FFF;
|
|
margin: 0px;
|
|
padding-left: 5px;
|
|
height: 5px;
|
|
}
|
|
|
|
/****** DECORATED TAB BAR - TAB PANEL ********/
|
|
.gwt-TabPanel {
|
|
font-size: 11px;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
.gwt-TabPanelBottom {
|
|
border-top: 5px solid #DEDEDE;
|
|
overflow: hidden;
|
|
padding: 6px;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar {
|
|
height: 10px;
|
|
color: #416AA3;
|
|
cursor: pointer;
|
|
font-family: tahoma, arial, helvetica;
|
|
font-size: 11px;
|
|
font-size-adjust: none;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.gwt-TabBarItem {
|
|
height: 10px;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarItem {
|
|
margin-left: 6px;
|
|
border-collapse: separate;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarFirst {
|
|
width: 5px; /* first tab distance from the left */
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarRest {
|
|
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .tabTopCenter {
|
|
padding: 0px;
|
|
background: #DEDEDE;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .tabTopLeft,.gwt-DecoratedTabBar .tabTopRight {
|
|
padding: 0px;
|
|
zoom: 1;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .tabMiddleLeft,.gwt-DecoratedTabBar .tabMiddleRight
|
|
{
|
|
width: 6px;
|
|
padding: 0px;
|
|
background: #DEDEDE;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .tabMiddleLeftInner,.gwt-DecoratedTabBar .tabMiddleRightInner
|
|
{
|
|
width: 1px;
|
|
height: 1px;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .tabMiddleCenter {
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
background: transparent url(gcube_images/gcube_header_gray.gif) repeat-x
|
|
scroll 0 -1px;
|
|
border-bottom: 1px solid #CDCDCD;
|
|
padding-top: 1px
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabTopCenter {
|
|
background: #8DB2E3;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleLeft,.gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleRight
|
|
{
|
|
background: #CEDFF5 url(gcube_images/gcube-tab-bg-selected.gif) repeat-x
|
|
scroll center bottom;
|
|
}
|
|
|
|
.gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleCenter {
|
|
cursor: default;
|
|
background: #CEDFF5 url(gcube_images/gcube-tab-bg-selected.gif) repeat-x
|
|
scroll center bottom;
|
|
color: #15428B;
|
|
border-bottom: 1px solid #8DB2E3;
|
|
}
|
|
|
|
/****** MENUBAR ******/
|
|
.gwt-MenuBar .gwt-MenuItem {
|
|
color: #15428B;
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 11px;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
border: 0px;
|
|
}
|
|
|
|
.gwt-MenuBar .gwt-MenuItem-selected {
|
|
background: #E0EDFE;
|
|
}
|
|
|
|
.gwt-MenuBar-horizontal {
|
|
color: #15428B;
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 10px;
|
|
/*border:1px solid #99BBE8;*/
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
.gwt-MenuBar-horizontal .gwt-MenuItem {
|
|
vertical-align: bottom;
|
|
color: #3366CC;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.gwt-MenuBar-horizontal .gwt-MenuItemSeparator {
|
|
width: 1px;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
border: 0px;
|
|
border-left: 1px solid #888888;
|
|
background: white;
|
|
}
|
|
|
|
.gwt-MenuBar-horizontal .gwt-MenuItemSeparator .menuSeparatorInner {
|
|
width: 1px;
|
|
height: 1px;
|
|
background: white;
|
|
}
|
|
|
|
.gwt-MenuBar-vertical {
|
|
background-color: #cddef3;
|
|
border: 1px solid #99BBE8;
|
|
}
|
|
|
|
/* ********* Trees ***************** */
|
|
.gwt-Tree .gwt-TreeItem {
|
|
padding: 1px 0px;
|
|
margin: 0px;
|
|
border: 0px;
|
|
display: block !important;
|
|
white-space: nowrap;
|
|
cursor: hand;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* ******* StackPanel *********/ /* ******* StackPanel *********/
|
|
.gwt-StackPanel {
|
|
|
|
}
|
|
|
|
.gwt-StackPanel .gwt-StackPanelContent {
|
|
border: 1px solid #bbbbbb;
|
|
border-bottom: 0px;
|
|
background: white;
|
|
padding: 2px 2px 10px 5px;
|
|
}
|
|
|
|
.gwt-StackPanelItem {
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
font-family: tahoma, arial, verdana, sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
color: #15428B;
|
|
border-top: 1px solid #0D70C6;
|
|
border-left: 1px solid #0D70C6;
|
|
border-right: 1px solid #0D70C6;
|
|
background: transparent url(gcube_images/bg_nonselected_stack_item.png)
|
|
repeat;
|
|
}
|
|
|
|
.gwt-StackPanel .stackItemTopLeft,.gwt-StackPanel .stackItemTopRight {
|
|
height: 6px;
|
|
width: 6px;
|
|
zoom: 1;
|
|
}
|
|
|
|
.gwt-StackPanel .gwt-StackPanelItem-selected {
|
|
border: 1px solid #0D70C6;
|
|
color: #15428B;
|
|
background: transparent url(gcube_images/bg_selected_stack_item.png)
|
|
repeat-x scroll 0 -1px;
|
|
}
|
|
|
|
.gwt-PushButton-up,.gwt-PushButton-up-hovering,.gwt-PushButton-up-disabled,.gwt-PushButton-down,.gwt-PushButton-down-hovering,.gwt-PushButton-down-disabled
|
|
{
|
|
margin: 0;
|
|
text-decoration: none;
|
|
background: #fff;;
|
|
border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
}
|
|
|
|
.gwt-PushButton-up,.gwt-PushButton-up-hovering,.gwt-PushButton-up-disabled
|
|
{
|
|
padding: 3px 5px 3px 5px;
|
|
}
|
|
|
|
.gwt-PushButton-up {
|
|
border: 1px solid #bbb;
|
|
border-bottom: 1px solid #a0a0a0;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-PushButton-up-hovering {
|
|
border: 1px solid;
|
|
border-color: #939393;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-PushButton-up-disabled {
|
|
border: 1px solid #bbb;
|
|
cursor: default;
|
|
opacity: .5;
|
|
filter: alpha(opacity = 45);
|
|
zoom: 1;
|
|
}
|
|
|
|
.gwt-PushButton-down,.gwt-PushButton-down-hovering,.gwt-PushButton-down-disabled
|
|
{
|
|
padding: 4px 4px 2px 6px;
|
|
outline: none;
|
|
}
|
|
|
|
.gwt-PushButton-down {
|
|
border: 1px inset #666;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-PushButton-down-hovering {
|
|
border: 1px solid #939393;
|
|
border-top: 1px solid #333333;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-PushButton-down-disabled {
|
|
border: 1px outset #ccc;
|
|
cursor: default;
|
|
opacity: 0.5;
|
|
filter: alpha(opacity = 45);
|
|
zoom: 1;
|
|
}
|
|
|
|
.gwt-ToggleButton-up,.gwt-ToggleButton-up-hovering,.gwt-ToggleButton-up-disabled,.gwt-ToggleButton-down,.gwt-ToggleButton-down-hovering,.gwt-ToggleButton-down-disabled
|
|
{
|
|
margin: 0;
|
|
text-decoration: none;
|
|
background: #FFF;
|
|
-moz-border-radius: 2px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.gwt-ToggleButton-up,.gwt-ToggleButton-up-hovering,.gwt-ToggleButton-up-disabled
|
|
{
|
|
padding: 3px 5px 3px 5px;
|
|
}
|
|
|
|
.gwt-ToggleButton-up {
|
|
border: 1px solid #bbb;
|
|
border-bottom: 1px solid #a0a0a0;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-ToggleButton-up-hovering {
|
|
border: 1px solid;
|
|
border-color: #939393;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-ToggleButton-up-disabled {
|
|
border: 1px solid #bbb;
|
|
cursor: default;
|
|
opacity: .5;
|
|
zoom: 1;
|
|
filter: alpha(opacity = 45);
|
|
}
|
|
|
|
.gwt-ToggleButton-down,.gwt-ToggleButton-down-hovering,.gwt-ToggleButton-down-disabled
|
|
{
|
|
padding: 4px 4px 2px 6px;
|
|
}
|
|
|
|
.gwt-ToggleButton-down {
|
|
background-position: 0 -513px;
|
|
border: 1px inset #666;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-ToggleButton-down-hovering {
|
|
background-position: 0 -513px;
|
|
border: 1px inset;
|
|
border-color: #9cf #69e #69e #7af;
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
.gwt-ToggleButton-down-disabled {
|
|
background-position: 0 -513px;
|
|
border: 1px inset #ccc;
|
|
cursor: default;
|
|
opacity: .5;
|
|
zoom: 1;
|
|
filter: alpha(opacity = 45);
|
|
} |