对YUI扩展的Gird组件 Part-2

2024-02-26 12:30:17

原文在这里文章日期：2006-9-2

Q:unknown {
content: ''
}
Q:unknown {
content: ''
}
.ygrid-cell-text {
PADDING-RIGHT: 5px; DISPLAY: block; PADDING-LEFT: 5px; PADDING-BOTTOM: 3px; FONT: 8pt arial; OVERFLOW: hidden; PADDING-TOP: 3px; WHITE-SPACE: nowrap
}
.ygrid-col {
DISPLAY: block; OVERFLOW: hidden; BORDER-LEFT: #f1efe2 1px solid; CURSOR: default; POSITION: absolute; HEIGHT: 21px! important; box-sizing: border-box; moz-box-sizing: border-box; moz-outline: none; moz-user-focus: normal
}
.yeditgrid .ygrid-col {
moz-outline: normal
}
.ygrid-col {
FONT: 8pt arial; TEXT-OVERFLOW: ellipsis; o-text-overflow: ellipsis
}
.ygrid-hd {
FONT: 8pt arial; TEXT-OVERFLOW: ellipsis; o-text-overflow: ellipsis
}
.ygrid-col-0 {
BORDER-LEFT-WIDTH: 0px; LEFT: 0px; WIDTH: 120px
}
.ygrid-col-last {
BORDER-RIGHT: #f1efe2 1px solid
}
.ygrid-editor {
BORDER-RIGHT: #afbdc9 1px solid; BORDER-TOP: #afbdc9 1px solid; Z-INDEX: 10; VISIBILITY: hidden; FONT: 8pt arial; BORDER-LEFT: #afbdc9 1px solid; BORDER-BOTTOM: #afbdc9 1px solid; POSITION: absolute; box-sizing: border-box; moz-box-sizing: border-box
}
.ygrid-editor INPUT {
BORDER-TOP-WIDTH: 0px; PADDING-LEFT: 3px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; FONT: 8pt arial; PADDING-TOP: 2px; BORDER-RIGHT-WIDTH: 0px
}
.ygrid-editor-container {
DISPLAY: block; OVERFLOW: hidden; BACKGROUND-COLOR: white
}
.ygrid-editor .pick-button {
DISPLAY: block; Z-INDEX: 2; RIGHT: 0px; BACKGROUND-IMAGE: url(../images/grid/pick-button.gif); WIDTH: 15px; BACKGROUND-REPEAT: no-repeat; POSITION: absolute; TOP: 0px; HEIGHT: 20px
}
.ygrid-editor-invalid {
BORDER-RIGHT: #afbdc9 1px solid; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #afbdc9 1px solid; BACKGROUND-IMAGE: url(../images/grid/invalid_line.gif); BORDER-LEFT: #afbdc9 1px solid; BORDER-BOTTOM: #afbdc9 1px solid; BACKGROUND-REPEAT: repeat-x
}
.ygrid-checkbox-editor {
DISPLAY: block; OVERFLOW: hidden; BACKGROUND-COLOR: white; TEXT-ALIGN: center
}
.ygrid-checkbox-editor INPUT {
MARGIN-TOP: 3px; WIDTH: 13px; HEIGHT: 13px
}
SELECT.ygrid-editor {
BORDER-RIGHT: #afbdc9 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #afbdc9 1px solid; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; BORDER-LEFT: #afbdc9 1px solid; PADDING-TOP: 0px; BORDER-BOTTOM: #afbdc9 1px solid; moz-outline: none
}
.ygrid-num-editor {
PADDING-LEFT: 3px; PADDING-TOP: 2px; TEXT-ALIGN: right
}
.ygrid-text-editor {
PADDING-LEFT: 3px; PADDING-TOP: 2px
}
.ygrid-hd {
DISPLAY: block; OVERFLOW: hidden; BORDER-BOTTOM: #cbc7b8 1px solid; POSITION: absolute; BACKGROUND-COLOR: #ebeadb; box-sizing: border-box; moz-box-sizing: border-box
}
.ygrid-column-sizer {
BORDER-RIGHT: #6593cf 1px dashed; BACKGROUND: none transparent scroll repeat 0% 0%; WIDTH: 1px; CURSOR: col-resize
}
.ygrid-drag-proxy {
BORDER-RIGHT: #002266 1px solid; BORDER-TOP: #002266 1px solid; Z-INDEX: 10000; VISIBILITY: hidden; BORDER-LEFT: #002266 1px solid; WIDTH: 150px; BORDER-BOTTOM: #002266 1px solid; POSITION: absolute; HEIGHT: 24px; BACKGROUND-COLOR: #3366cc
}
.ygrid-drag-text {
PADDING-RIGHT: 3px; DISPLAY: block; PADDING-LEFT: 3px; LEFT: 26px; PADDING-BOTTOM: 3px; FONT: 8pt arial; COLOR: white; PADDING-TOP: 3px; POSITION: absolute; TOP: 0px
}
.ygrid-drop-icon {
BACKGROUND-POSITION: center 50%; DISPLAY: block; LEFT: 0px; WIDTH: 24px; BACKGROUND-REPEAT: no-repeat; POSITION: absolute; TOP: 0px; HEIGHT: 100%
}
.ygrid-drop-nodrop {
BACKGROUND-IMAGE: url(../images/grid/drop-no.gif)
}
.ygrid-drop-ok {
BACKGROUND-IMAGE: url(../images/grid/drop-yes.gif)
}
.ygrid-hd .sort-asc {
BACKGROUND-POSITION: right 50%; DISPLAY: none; BACKGROUND-IMAGE: url(../images/grid/sort_asc.gif); WIDTH: 16px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 14px
}
.ygrid-hd .sort-desc {
BACKGROUND-POSITION: right 50%; DISPLAY: none; BACKGROUND-IMAGE: url(../images/grid/sort_desc.gif); WIDTH: 16px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 14px
}
.ygrid-hd-body {
PADDING-RIGHT: 5px; DISPLAY: block; PADDING-LEFT: 5px; LEFT: 0px; PADDING-BOTTOM: 3px; FONT: 8pt arial; OVERFLOW: hidden; CURSOR: default; PADDING-TOP: 3px; BORDER-BOTTOM: #d6d2c2 2px solid; WHITE-SPACE: nowrap; POSITION: relative; TOP: 0px
}
.ygrid-hd-body SPAN {
FONT: 8pt arial; WHITE-SPACE: nowrap
}
.ygrid-hd-over {
BORDER-BOTTOM: #fcc247 2px solid
}
.ygrid-hd-over .ygrid-hd-body {
BORDER-BOTTOM: #f9a900 1px solid; BACKGROUND-COLOR: #faf9f4
}
.ygrid-hd-split {
BACKGROUND-POSITION: center 50%; DISPLAY: block; FONT-SIZE: 1px; Z-INDEX: 3; BACKGROUND-IMAGE: url(../images/grid/grid-split.gif); OVERFLOW: hidden; WIDTH: 6px; CURSOR: e-resize; BACKGROUND-REPEAT: no-repeat; POSITION: absolute; TOP: 2px; HEIGHT: 16px
}
.ygrid-hrow {
DISPLAY: block; Z-INDEX: 2; LEFT: 0px; OVERFLOW: hidden; WIDTH: 10000px; POSITION: relative; TOP: 0px; HEIGHT: 22px; BACKGROUND-COLOR: #ebeadb
}
.ygrid-hrow-frame {
DISPLAY: block; Z-INDEX: 1; LEFT: 0px; WIDTH: 10000px; POSITION: absolute; TOP: 0px; HEIGHT: 22px
}
.ygrid-footer .ytoolbar {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ygrid-page-number {
WIDTH: 24px; HEIGHT: 14px
}
.ygrid-page-first {
BACKGROUND-IMAGE: url(../images/grid/page-first.gif)
}
.ygrid-loading {
BACKGROUND-IMAGE: url(../images/grid/done.gif)
}
.ygrid-page-last {
BACKGROUND-IMAGE: url(../images/grid/page-last.gif)
}
.ygrid-page-next {
BACKGROUND-IMAGE: url(../images/grid/page-next.gif)
}
.ygrid-page-prev {
BACKGROUND-IMAGE: url(../images/grid/page-prev.gif)
}
.ytb-button-disabled .ygrid-loading {
BACKGROUND-IMAGE: url(../images/grid/loading.gif)
}
.ytb-button-disabled .ygrid-page-first {
BACKGROUND-IMAGE: url(../images/grid/page-first-disabled.gif)
}
.ytb-button-disabled .ygrid-page-last {
BACKGROUND-IMAGE: url(../images/grid/page-last-disabled.gif)
}
.ytb-button-disabled .ygrid-page-next {
BACKGROUND-IMAGE: url(../images/grid/page-next-disabled.gif)
}
.ytb-button-disabled .ygrid-page-prev {
BACKGROUND-IMAGE: url(../images/grid/page-prev-disabled.gif)
}
.ygrid-mso {

}
.ygrid-mso .ygrid-hd {
BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px
}
.ygrid-mso .ygrid-footer {
BORDER-TOP: #6593cf 1px solid
}
.ygrid-mso .ygrid-footer .ygrid-fbutton {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ygrid-mso .ygrid-hd-body {
BORDER-BOTTOM-WIDTH: 0px
}
.ygrid-mso .ygrid-hd-over {
BORDER-BOTTOM-WIDTH: 0px
}
.ygrid-mso .ygrid-hd-over .ygrid-hd-body {
BACKGROUND-COLOR: transparent
}
.ygrid-mso .ygrid-hd-split {
BACKGROUND-IMAGE: url(../images/grid/grid-blue-split.gif)
}
.ygrid-mso .ytoolbar .ytb-sep {
BACKGROUND-IMAGE: url(../images/grid/grid-blue-split.gif)
}
.ygrid-mso .ygrid-hrow {
BACKGROUND: url(../images/grid/mso-hd.gif); BORDER-BOTTOM: #6593cf 1px solid; HEIGHT: 21px
}
.ygrid-mso .ygrid-row {
COLOR: black; BORDER-BOTTOM: #ddecfe 1px solid
}
.ygrid-mso .ygrid-row-alt {
BACKGROUND-COLOR: #f5f5f5
}
.ygrid-mso .ygrid-row-selected {
COLOR: black; BACKGROUND-COLOR: #b3c8e8! important
}
.ygrid-mso .ygrid-row-selected SPAN {
COLOR: black! important
}
.yprops-grid .ygrid-col-1 {
BACKGROUND-COLOR: #f1efe2
}
.yprops-grid .ygrid-col-1 .ygrid-cell-text {
BACKGROUND-COLOR: white
}
.yprops-grid .ygrid-col-0 {
BACKGROUND-COLOR: #f1efe2
}
.yprops-grid .ygrid-col-0 .ygrid-cell-text {
MARGIN-LEFT: 10px; BACKGROUND-COLOR: white
}
.yprops-grid .ygrid-prop-edting .ygrid-col-0 .ygrid-cell-text {
COLOR: white; BACKGROUND-COLOR: #316ac5
}
.yprops-grid .ygrid-prop-edting .ygrid-col-0 {
COLOR: white
}
.yprops-grid .ygrid-num-editor {
TEXT-ALIGN: left
}
.ygrid-row {
DISPLAY: block; OVERFLOW: visible; WIDTH: 10000px; BORDER-BOTTOM: #f1efe2 1px solid; WHITE-SPACE: nowrap; POSITION: absolute; HEIGHT: 21px; box-sizing: border-box; moz-box-sizing: border-box
}
.ygrid-row-alt {
BACKGROUND-COLOR: #fcfaf6
}
.ygrid-row-over {
COLOR: black; BACKGROUND-COLOR: #f1f1f1
}
.ygrid-row-selected {
COLOR: white; BACKGROUND-COLOR: #316ac5! important
}
.ygrid-row-selected SPAN {
COLOR: white! important
}
.ygrid-vista {
BORDER-RIGHT: #535353 1px solid; BORDER-TOP: #535353 1px solid; BORDER-LEFT: #535353 1px solid; BORDER-BOTTOM: #535353 1px solid
}
.ygrid-vista .ygrid-hd {
BORDER-BOTTOM-WIDTH: 0px
}
.ygrid-vista .ygrid-hd-body {
BORDER-BOTTOM: #b3bcc0 1px solid
}
.ygrid-vista .ygrid-hd-over {
BORDER-BOTTOM-WIDTH: 0px
}
.ygrid-vista .ygrid-hd-over .ygrid-hd-body {
BORDER-BOTTOM-WIDTH: 0px; BACKGROUND-COLOR: transparent
}
.ygrid-vista .ygrid-hd-split {
BACKGROUND-IMAGE: url(../images/grid/grid-split.gif)
}
.ygrid-vista .ygrid-hrow {
BACKGROUND: url(../images/grid/grid-vista-hd.gif); HEIGHT: 21px
}
.ygrid-vista .ygrid-row-alt {
BACKGROUND-COLOR: #f5f5f5
}
.ygrid-vista .ygrid-row-selected {
COLOR: white; BACKGROUND-COLOR: #535353! important
}
.ygrid-vista .ygrid-row-selected SPAN {
COLOR: white! important
}
.ygrid-vista .ygrid-wrap-body {

}
.ygrid-wrap {
LEFT: 0px; OVERFLOW: auto; WIDTH: 100%; POSITION: relative; TOP: 22px; HEIGHT: 100%
}
.ygrid-footer {
PADDING-RIGHT: 0px; BORDER-TOP: #cbc7b8 1px solid; DISPLAY: block; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
.ygrid-wrap-footer {
DISPLAY: block; OVERFLOW: hidden; WIDTH: 100%; BOTTOM: 0px; POSITION: absolute; HEIGHT: 25px; BACKGROUND-COLOR: #ebeadb; box-sizing: border-box; moz-box-sizing: border-box
}
.ygrid-wrap-body {
DISPLAY: block; LEFT: 0px; OVERFLOW: hidden; POSITION: absolute; TOP: 0px
}
.ygrid-wrap-headers {
Z-INDEX: 12; LEFT: 0px; OVERFLOW: hidden; POSITION: absolute; TOP: 0px
}
.ygrid-col-0 {

}
.ygrid-col-1 {
LEFT: 120px; WIDTH: 120px
}
.ygrid-col-10 {

}
.ygrid-col-11 {

}
.ygrid-col-12 {

}
.ygrid-col-13 {

}
.ygrid-col-14 {

}
.ygrid-col-15 {

}
.ygrid-col-16 {

}
.ygrid-col-17 {

}
.ygrid-col-18 {

}
.ygrid-col-19 {

}
.ygrid-col-2 {
LEFT: 240px; WIDTH: 105px
}
.ygrid-col-20 {

}
.ygrid-col-3 {
LEFT: 345px; WIDTH: 100px
}
.ygrid-col-4 {

}
.ygrid-col-5 {

}
.ygrid-col-6 {

}
.ygrid-col-7 {

}
.ygrid-col-8 {

}
.ygrid-col-9 {

}
.ygrid-header-0 {

}
.ygrid-header-1 {

}
.ygrid-header-10 {

}
.ygrid-header-11 {

}
.ygrid-header-12 {

}
.ygrid-header-13 {

}
.ygrid-header-14 {

}
.ygrid-header-15 {

}
.ygrid-header-16 {

}
.ygrid-header-17 {

}
.ygrid-header-18 {

}
.ygrid-header-19 {

}
.ygrid-header-2 {

}
.ygrid-header-20 {

}
.ygrid-header-3 {

}
.ygrid-header-4 {

}
.ygrid-header-5 {

}
.ygrid-header-6 {

}
.ygrid-header-7 {

}
.ygrid-header-8 {

}
.ygrid-header-9 {

}
#grid-example {
BORDER-RIGHT: #cbc7b8 1px solid; BORDER-TOP: #cbc7b8 1px solid; LEFT: 0px; BORDER-LEFT: #cbc7b8 1px solid; BORDER-BOTTOM: #cbc7b8 1px solid; POSITION: relative; TOP: 0px
}
#grid-example .ygrid-col-0 {

}
#grid-example .ygrid-col-1 {
TEXT-ALIGN: right
}
#grid-example .ygrid-col-2 {
TEXT-ALIGN: right
}
#grid-example .ygrid-col-3 {
TEXT-ALIGN: right
}
#grid-example .ygrid-col-4 {
TEXT-ALIGN: right
}
.ygrid-mso#grid-example {
BORDER-RIGHT: #6593cf 1px solid; BORDER-TOP: #6593cf 1px solid; BORDER-LEFT: #6593cf 1px solid; BORDER-BOTTOM: #6593cf 1px solid
}
.ygrid-vista#grid-example {
BORDER-RIGHT: #b3bcc0 1px solid; BORDER-TOP: #b3bcc0 1px solid; BORDER-LEFT: #b3bcc0 1px solid; BORDER-BOTTOM: #b3bcc0 1px solid
}
#xml-grid-example {
BORDER-RIGHT: #cbc7b8 1px solid; BORDER-TOP: #cbc7b8 1px solid; LEFT: 0px; BORDER-LEFT: #cbc7b8 1px solid; BORDER-BOTTOM: #cbc7b8 1px solid; POSITION: relative; TOP: 0px
}
#xml-grid-example .ygrid-col-0 {

}
#xml-grid-example .ygrid-col-1 {

}
#xml-grid-example .ygrid-col-2 {

}
#xml-grid-example .ygrid-col-3 {

}
.ygrid-mso#xml-grid-example {
BORDER-RIGHT: #6593cf 1px solid; BORDER-TOP: #6593cf 1px solid; BORDER-LEFT: #6593cf 1px solid; BORDER-BOTTOM: #6593cf 1px solid
}
.ygrid-vista#xml-grid-example {
BORDER-RIGHT: #b3bcc0 1px solid; BORDER-TOP: #b3bcc0 1px solid; BORDER-LEFT: #b3bcc0 1px solid; BORDER-BOTTOM: #b3bcc0 1px solid
}
#editor-grid .ygrid-col-2 {
TEXT-ALIGN: right
}
.ypopcal {
BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 2px; BACKGROUND: white; PADDING-BOTTOM: 2px; BORDER-LEFT: gray 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: gray 1px solid
}
.ypopcal-shadow {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #dddddd; FILTER: progid:DXImageTransform.Microsoft.Blur(MakeShadow=true,pixelradius=1) Alpha(opacity=35,style=1,startX=0,finishX=200,FinishOpacity=35); PADDING-BOTTOM: 0px; PADDING-TOP: 0px; POSITION: absolute
}
.ypopcal-head {
BACKGROUND: #93b5e4; WIDTH: 150px
}
.ypopcal-head TD {
PADDING-RIGHT: 1px; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; PADDING-TOP: 1px
}
.ypopcal-month {
FONT: bold 7pt verdana; COLOR: white; TEXT-ALIGN: center; TEXT-DECORATION: none
}
.ypopcal-head .ypopcal-arrow {
WIDTH: 16px; CURSOR: pointer; TEXT-ALIGN: center; moz-user-select: none
}
.ypopcal-head .next-month {
BACKGROUND-POSITION: center 50%; BACKGROUND-IMAGE: url(../images/grid/arrow-right-white.gif); WIDTH: 16px; CURSOR: pointer; BACKGROUND-REPEAT: no-repeat
}
.ypopcal-head .prev-month {
BACKGROUND-POSITION: center 50%; BACKGROUND-IMAGE: url(../images/grid/arrow-left-white.gif); WIDTH: 16px; CURSOR: pointer; BACKGROUND-REPEAT: no-repeat
}
.ypopcal-table {
BACKGROUND: white; BORDER-BOTTOM: #cccccc 1px solid
}
.ypopcal-table TR {

}
.ypopcal-table TD {
BORDER-RIGHT: white 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: white 1px solid; PADDING-LEFT: 2px; BACKGROUND: white; PADDING-BOTTOM: 1px; FONT: 8pt arial; BORDER-LEFT: white 1px solid; WIDTH: 12px; CURSOR: pointer; COLOR: #aaaaaa; PADDING-TOP: 1px; BORDER-BOTTOM: white 1px solid; HEIGHT: 12px; TEXT-ALIGN: right; box-sizing: border-box; moz-box-sizing: border-box
}
.ypopcal-table TD.today {
BORDER-RIGHT: darkred 1px solid; BORDER-TOP: darkred 1px solid; BORDER-LEFT: darkred 1px solid; BORDER-BOTTOM: darkred 1px solid
}
.ypopcal-table .ypopcal-daynames TD {
BORDER-TOP-WIDTH: 0px; FONT-WEIGHT: normal; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 8pt; CURSOR: default; COLOR: black; BORDER-BOTTOM: #cccccc 1px solid; TEXT-ALIGN: right; BORDER-RIGHT-WIDTH: 0px
}
.ypopcal-table TD.active {
CURSOR: pointer; COLOR: black
}
.ypopcal-table TD.ypopcal-disabled {
BORDER-RIGHT: #eeeeee 1px solid; BORDER-TOP: #eeeeee 1px solid; BACKGROUND: #eeeeee; BORDER-LEFT: #eeeeee 1px solid; CURSOR: default; COLOR: #bbbbbb; BORDER-BOTTOM: #eeeeee 1px solid
}
.ypopcal-table TD.selected {
BORDER-RIGHT: #c3daf9 1px solid; BORDER-TOP: #c3daf9 1px solid; BACKGROUND: #ddecfe; BORDER-LEFT: #c3daf9 1px solid; BORDER-BOTTOM: #c3daf9 1px solid
}
.ypopcal-today {
MARGIN-TOP: 0px; DISPLAY: inline-block; FONT: 8pt arial; MARGIN-LEFT: 2px; CURSOR: hand; COLOR: black; TEXT-DECORATION: none
}
.ygrid-simple-view .ygrid-col {
DISPLAY: inline-block; POSITION: static; HEIGHT: 100%! important
}
.ygrid-simple-view .ygrid-row {
POSITION: static
}
.yresizable-handle {
FONT-SIZE: 1px; Z-INDEX: 100; BACKGROUND: white; FILTER: alpha(opacity=0); OVERFLOW: hidden; LINE-HEIGHT: 1px; POSITION: absolute; opacity: 0
}
.yresizable-handle-east {
RIGHT: 0px; WIDTH: 5px; CURSOR: e-resize; TOP: 0px; HEIGHT: 100%
}
.yresizable-handle-south {
LEFT: 0px; WIDTH: 100%; CURSOR: s-resize; BOTTOM: 0px; HEIGHT: 5px
}
.yresizable-handle-west {
LEFT: 0px; WIDTH: 5px; CURSOR: w-resize; TOP: 0px; HEIGHT: 100%
}
.yresizable-handle-north {
LEFT: 0px; WIDTH: 100%; CURSOR: n-resize; TOP: 0px; HEIGHT: 5px
}
.yresizable-handle-southeast {
Z-INDEX: 101; RIGHT: 0px; WIDTH: 6px; CURSOR: se-resize; BOTTOM: 0px; HEIGHT: 6px
}
.yresizable-over .yresizable-handle {
FILTER: alpha(opacity=100); opacity: 1
}
.yresizable-pinned .yresizable-handle {
FILTER: alpha(opacity=100); opacity: 1
}
.yresizable-over .yresizable-handle-east {
BACKGROUND: url(../images/sizer/e-handle.gif) left 50%; BORDER-LEFT: #98c0f4 1px solid
}
.yresizable-pinned .yresizable-handle-east {
BACKGROUND: url(../images/sizer/e-handle.gif) left 50%; BORDER-LEFT: #98c0f4 1px solid
}
.yresizable-over .yresizable-handle-east {
BORDER-RIGHT: #98c0f4 1px solid; BACKGROUND: url(../images/sizer/e-handle.gif) left 50%
}
.yresizable-pinned .yresizable-handle-west {
BORDER-RIGHT: #98c0f4 1px solid; BACKGROUND: url(../images/sizer/e-handle.gif) left 50%
}
.yresizable-over .yresizable-handle-south {
BORDER-TOP: #98c0f4 1px solid; BACKGROUND: url(../images/sizer/s-handle.gif) 50% top
}
.yresizable-pinned .yresizable-handle-south {
BORDER-TOP: #98c0f4 1px solid; BACKGROUND: url(../images/sizer/s-handle.gif) 50% top
}
.yresizable-over .yresizable-handle-south {
BACKGROUND: url(../images/sizer/s-handle.gif) 50% top; BORDER-BOTTOM: #98c0f4 1px solid
}
.yresizable-pinned .yresizable-handle-north {
BACKGROUND: url(../images/sizer/s-handle.gif) 50% top; BORDER-BOTTOM: #98c0f4 1px solid
}
.yresizable-over .yresizable-handle-southeast {
BACKGROUND: url(../images/sizer/se-handle.gif)
}
.yresizable-pinned .yresizable-handle-southeast {
BACKGROUND: url(../images/sizer/se-handle.gif)
}
.yresizable-proxy {
BORDER-RIGHT: #6593cf 1px dashed; BORDER-TOP: #6593cf 1px dashed; Z-INDEX: 1001; VISIBILITY: hidden; OVERFLOW: hidden; BORDER-LEFT: #6593cf 1px dashed; BORDER-BOTTOM: #6593cf 1px dashed; POSITION: absolute
}
.ytheme-gray .yresizable-over .yresizable-handle-east {
BACKGROUND: url(../images/sizer/gray/e-handle.gif) left 50%; BORDER-LEFT: #615e55 1px solid
}
.ytheme-gray .yresizable-pinned .yresizable-handle-east {
BACKGROUND: url(../images/sizer/gray/e-handle.gif) left 50%; BORDER-LEFT: #615e55 1px solid
}
.ytheme-gray .yresizable-over .yresizable-handle-east {
BORDER-RIGHT: #615e55 1px solid; BACKGROUND: url(../images/sizer/gray/e-handle.gif) left 50%
}
.ytheme-gray .yresizable-pinned .yresizable-handle-west {
BORDER-RIGHT: #615e55 1px solid; BACKGROUND: url(../images/sizer/gray/e-handle.gif) left 50%
}
.ytheme-gray .yresizable-over .yresizable-handle-south {
BORDER-TOP: #615e55 1px solid; BACKGROUND: url(../images/sizer/gray/s-handle.gif) 50% top
}
.ytheme-gray .yresizable-pinned .yresizable-handle-south {
BORDER-TOP: #615e55 1px solid; BACKGROUND: url(../images/sizer/gray/s-handle.gif) 50% top
}
.ytheme-gray .yresizable-over .yresizable-handle-south {
BACKGROUND: url(../images/sizer/gray/s-handle.gif) 50% top; BORDER-BOTTOM: #615e55 1px solid
}
.ytheme-gray .yresizable-pinned .yresizable-handle-north {
BACKGROUND: url(../images/sizer/gray/s-handle.gif) 50% top; BORDER-BOTTOM: #615e55 1px solid
}
.ytheme-gray .yresizable-over .yresizable-handle-southeast {
BACKGROUND: url(../images/sizer/gray/se-handle.gif)
}
.ytheme-gray .yresizable-pinned .yresizable-handle-southeast {
BACKGROUND: url(../images/sizer/gray/se-handle.gif)
}
.ytheme-gray .yresizable-proxy {
BORDER-RIGHT: #615e55 1px dashed; BORDER-TOP: #615e55 1px dashed; BORDER-LEFT: #615e55 1px dashed; BORDER-BOTTOM: #615e55 1px dashed
}
.ytoolbar {
BORDER-RIGHT: #cbc7b8 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #cbc7b8 1px solid; DISPLAY: block; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; BORDER-LEFT: #cbc7b8 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #cbc7b8 1px solid; BACKGROUND-COLOR: #ebeadb
}
.mso .ytoolbar {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(../images/grid/mso-hd.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ygrid-mso .ytoolbar {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: url(../images/grid/mso-hd.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytoolbar TD {
FONT: 8pt arial,helvetica
}
.ytoolbar SPAN {
FONT: 8pt arial,helvetica
}
.ytoolbar INPUT {
FONT: 8pt arial,helvetica
}
.ytoolbar DIV {
FONT: 8pt arial,helvetica
}
.ytoolbar .ytb-button-disabled .ytb-button-inner {
CURSOR: default; COLOR: gray
}
.ytoolbar .ytb-button-inner {
BACKGROUND-POSITION: center 50%; DISPLAY: block; WIDTH: 16px; CURSOR: pointer; BACKGROUND-REPEAT: no-repeat; WHITE-SPACE: nowrap; HEIGHT: 16px
}
.ytoolbar .ytb-text {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px
}
.ytoolbar .ytb-button {
PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px
}
.ytoolbar .ytb-button-over {
BORDER-RIGHT: #316ac5 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #316ac5 1px solid; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; BORDER-LEFT: #316ac5 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #316ac5 1px solid; BACKGROUND-COLOR: #c3d3ed
}
.ytoolbar .ytb-sep {
BORDER-TOP-WIDTH: 0px; BACKGROUND-POSITION: center 50%; DISPLAY: block; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 1px; BACKGROUND-IMAGE: url(../images/grid/grid-split.gif); BORDER-BOTTOM-WIDTH: 0px; MARGIN: 0px 2px; OVERFLOW: hidden; WIDTH: 4px; CURSOR: default; BACKGROUND-REPEAT: no-repeat; HEIGHT: 16px; BORDER-RIGHT-WIDTH: 0px
}
.mso .ytoolbar .ytb-sep {
BACKGROUND-IMAGE: url(../images/grid/grid-blue-split.gif)
}
.ygrid-mso .ytoolbar .ytb-sep {
BACKGROUND-IMAGE: url(../images/grid/grid-blue-split.gif)
}
.ytab-wrap {
PADDING-TOP: 2px; BORDER-BOTTOM: #6593cf 1px solid
}
.ytab-wrap TABLE {
LEFT: 0px; POSITION: relative; TOP: 0px
}
.ytab-strip TD {
PADDING-LEFT: 2px
}
.ytab-strip A {
DISPLAY: block
}
.ytab-strip SPAN {
DISPLAY: block
}
.ytab-strip EM {
DISPLAY: block
}
.ytab-strip A {
CURSOR: pointer; TEXT-DECORATION: none! important; outline: none; moz-outline: none
}
.ytab-strip .ytab-text {
FONT: bold 11px tahoma,arial,helvetica; OVERFLOW: hidden; CURSOR: pointer; COLOR: #666; WHITE-SPACE: nowrap; TEXT-OVERFLOW: ellipsis
}
.ytab-strip .on .ytab-text {
CURSOR: default; COLOR: #083772
}
.ytab-strip .disabled .ytab-text {
CURSOR: default; COLOR: #aaaaaa
}
.ytab-strip .ytab-inner {
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 4px; PADDING-TOP: 4px
}
.ytab-strip .on .ytab-right {
BACKGROUND: url(../images/tabs/tab-sprite.gif) no-repeat right 0px
}
.ytab-strip .on .ytab-left {
BACKGROUND: url(../images/tabs/tab-sprite.gif) no-repeat 0px -100px
}
.ytab-strip .ytab-right {
BACKGROUND: url(../images/tabs/tab-sprite.gif) no-repeat right -50px
}
.ytab-strip .ytab-left {
BACKGROUND: url(../images/tabs/tab-sprite.gif) no-repeat 0px -150px
}
.ytab-strip A {
LEFT: 0px; POSITION: relative; TOP: 1px
}
.ytab-strip .on A {

}
.ytab-strip .on .ytab-inner {
PADDING-BOTTOM: 5px
}
.ytab-strip .ytab-closable .ytab-inner {
PADDING-RIGHT: 22px; POSITION: relative
}
.ytab-strip .ytab-closable .close-icon {
DISPLAY: block; FONT-SIZE: 1px; RIGHT: 5px; BACKGROUND-IMAGE: url(../images/layout/tab-close.gif); WIDTH: 11px; CURSOR: pointer; LINE-HEIGHT: 1px; POSITION: absolute; TOP: 4px; HEIGHT: 11px
}
.ytab-strip .on .close-icon {
BACKGROUND-IMAGE: url(../images/layout/tab-close-on.gif)
}
.ytab-strip .ytab-closable .close-over {
BACKGROUND-IMAGE: url(../images/layout/tab-close-on.gif)
}
.ytabs-bottom .ytab-wrap {
BORDER-TOP: #6593cf 1px solid; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 2px; PADDING-TOP: 0px
}
.ytabs-bottom .ytab-strip .ytab-right {
BACKGROUND: url(../images/tabs/tab-btm-inactive-right-bg.gif) no-repeat left bottom
}
.ytabs-bottom .ytab-strip .ytab-left {
BACKGROUND: url(../images/tabs/tab-btm-inactive-left-bg.gif) no-repeat right bottom
}
.ytabs-bottom .ytab-strip .on .ytab-right {
BACKGROUND: url(../images/tabs/tab-btm-right-bg.gif) no-repeat left bottom
}
.ytabs-bottom .ytab-strip .on .ytab-left {
BACKGROUND: url(../images/tabs/tab-btm-left-bg.gif) no-repeat right bottom
}
.ytabs-bottom .ytab-strip A {
LEFT: 0px; POSITION: relative; TOP: 0px
}
.ytabs-bottom .ytab-strip .on A {
MARGIN-TOP: -1px
}
.ytabs-bottom .ytab-strip .on .ytab-inner {
PADDING-TOP: 5px
}
.ytheme-gray .ytab-wrap {
BORDER-BOTTOM: #aca899 1px solid
}
.ytheme-gray .ytab-strip .on .ytab-text {
CURSOR: default; COLOR: #333333
}
.ytheme-gray .ytabs-top .ytab-strip .on .ytab-right {
BACKGROUND: url(../images/tabs/gray/tab-sprite.gif) no-repeat right 0px
}
.ytheme-gray .ytabs-top .ytab-strip .on .ytab-left {
BACKGROUND: url(../images/tabs/gray/tab-sprite.gif) no-repeat 0px -100px
}
.ytheme-gray .ytabs-top .ytab-strip .ytab-right {
BACKGROUND: url(../images/tabs/gray/tab-sprite.gif) no-repeat right -50px
}
.ytheme-gray .ytabs-top .ytab-strip .ytab-left {
BACKGROUND: url(../images/tabs/gray/tab-sprite.gif) no-repeat 0px -150px
}
.ytheme-gray .ytab-strip .ytab-closable .close-icon {
BACKGROUND-IMAGE: url(../images/layout/gray/tab-close.gif)
}
.ytheme-gray .ytab-strip .on .close-icon {
BACKGROUND-IMAGE: url(../images/layout/gray/tab-close-on.gif)
}
.ytheme-gray .ytab-strip .ytab-closable .close-over {
BACKGROUND-IMAGE: url(../images/layout/gray/tab-close-on.gif)
}
.ytheme-gray .ytabs-bottom .ytab-wrap {
BORDER-TOP: #aca899 1px solid; BORDER-BOTTOM-WIDTH: 0px; PADDING-TOP: 0px
}
.ytheme-gray .ytabs-bottom .ytab-strip .ytab-right {
BACKGROUND: url(../images/tabs/gray/tab-btm-inactive-right-bg.gif) no-repeat left bottom
}
.ytheme-gray .ytabs-bottom .ytab-strip .ytab-left {
BACKGROUND: url(../images/tabs/gray/tab-btm-inactive-left-bg.gif) no-repeat right bottom
}
.ytheme-gray .ytabs-bottom .ytab-strip .on .ytab-right {
BACKGROUND: url(../images/tabs/gray/tab-btm-right-bg.gif) no-repeat left bottom
}
.ytheme-gray .ytabs-bottom .ytab-strip .on .ytab-left {
BACKGROUND: url(../images/tabs/gray/tab-btm-left-bg.gif) no-repeat right bottom
}
.ydlg-proxy {
BORDER-RIGHT: #6593cf 1px solid; BORDER-TOP: #6593cf 1px solid; Z-INDEX: 10001; LEFT: 0px; BACKGROUND-IMAGE: url(../images/gradient-bg.gif); OVERFLOW: hidden; BORDER-LEFT: #6593cf 1px solid; BORDER-BOTTOM: #6593cf 1px solid; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #c3daf9
}
.ydlg-shadow {
DISPLAY: none; BACKGROUND: #aaaaaa; POSITION: absolute
}
.ydlg-mask {
DISPLAY: none; Z-INDEX: 10000; FILTER: alpha(opacity=50); LEFT: 0px; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #ccc; opacity: .50; moz-opacity: 0.5
}
BODY.masked {
OVERFLOW: hidden
}
BODY.masked SELECT {
VISIBILITY: hidden
}
BODY.masked .ydlg SELECT {
VISIBILITY: visible
}
.ydlg {
Z-INDEX: 10001; OVERFLOW: hidden; POSITION: absolute; TOP: 0px
}
.yresizable-proxy {
Z-INDEX: 10002
}
.ydlg .ydlg-hd {
PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: url(../images/basic-dialog/hd-sprite.gif) navy repeat-x 0px -82px; PADDING-BOTTOM: 5px; FONT: bold 12px "sans serif", tahoma, verdana, helvetica; OVERFLOW: hidden; COLOR: #fff; PADDING-TOP: 5px
}
.ydlg .ydlg-hd-left {
PADDING-LEFT: 3px; BACKGROUND: url(../images/basic-dialog/hd-sprite.gif) no-repeat 0px -41px; MARGIN: 0px
}
.ydlg .ydlg-hd-right {
PADDING-RIGHT: 3px; BACKGROUND: url(../images/basic-dialog/hd-sprite.gif) no-repeat right 0px
}
.ydlg .ydlg-dlg-body {
BORDER-TOP-WIDTH: 0px; BORDER-RIGHT: #6593cf 1px solid; PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: url(../images/layout/gradient-bg.gif); PADDING-BOTTOM: 10px; BORDER-LEFT: #6593cf 1px solid; BORDER-TOP-COLOR: #6593cf; PADDING-TOP: 10px; BORDER-BOTTOM: #6593cf 1px solid
}
.ydlg .ydlg-bd {
OVERFLOW: hidden
}
.ydlg .ydlg-ft {
PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 0px; OVERFLOW: hidden; PADDING-TOP: 5px
}
.ydlg .yui-ext-tabbody {
BACKGROUND: white; OVERFLOW: auto
}
.ydlg .ytabs-top .yui-ext-tabbody {
BORDER-TOP-WIDTH: 0px; BORDER-RIGHT: #6593cf 1px solid; BORDER-LEFT: #6593cf 1px solid; BORDER-TOP-COLOR: #6593cf; BORDER-BOTTOM: #6593cf 1px solid
}
.ydlg .ytabs-bottom .yui-ext-tabbody {
BORDER-RIGHT: #6593cf 1px solid; BORDER-TOP: #6593cf 1px solid; BORDER-BOTTOM-WIDTH: 0px; BORDER-BOTTOM-COLOR: #6593cf; BORDER-LEFT: #6593cf 1px solid
}
.ydlg .ylayout-container .yui-ext-tabbody {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ydlg .inner-tab {
MARGIN: 5px
}
.ydlg .ydlg-button {
CLEAR: none; FLOAT: right; FONT: 11px arial, tahoma, verdana, helvetica; CURSOR: pointer; MARGIN-RIGHT: 5px
}
.ydlg-button-left {
FONT-SIZE: 1px; LINE-HEIGHT: 1px
}
.ydlg-button-right {
FONT-SIZE: 1px; LINE-HEIGHT: 1px
}
.ydlg-button-left {
BACKGROUND: url(../images/basic-dialog/btn-sprite.gif) no-repeat 0px 0px; WIDTH: 3px; HEIGHT: 21px
}
.ydlg-button-right {
BACKGROUND: url(../images/basic-dialog/btn-sprite.gif) no-repeat 0px -21px; WIDTH: 3px; HEIGHT: 21px
}
.ydlg-button-focus {
TEXT-DECORATION: none! important
}
.ydlg-button-center {
PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: url(../images/basic-dialog/btn-sprite.gif) repeat-x 0px -42px; PADDING-BOTTOM: 0px; FONT: 11px "san serif",tahoma,verdana,helvetica; VERTICAL-ALIGN: middle; CURSOR: pointer; PADDING-TOP: 0px; WHITE-SPACE: nowrap; TEXT-ALIGN: center; moz-user-select: none; khtml-user-select: none
}
.ydlg-button-over .ydlg-button-left {
BACKGROUND-POSITION: 0px -63px
}
.ydlg-button-over .ydlg-button-right {
BACKGROUND-POSITION: 0px -84px
}
.ydlg-button-over .ydlg-button-center {
BACKGROUND-POSITION: 0px -105px
}
.ydlg-button-click .ydlg-button-center {
BACKGROUND-POSITION: 0px -126px
}
.ydlg-button-disabled {
CURSOR: default
}
.ydlg-button-disabled .ydlg-button-center {
CURSOR: default; COLOR: gray
}
.ydlg-draggable .ydlg-hd {
CURSOR: move
}
.ydlg-closable .ydlg-hd {
PADDING-RIGHT: 22px
}
.ydlg .ydlg-close {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 1px; Z-INDEX: 6; RIGHT: 4px; BACKGROUND-IMAGE: url(../images/basic-dialog/close.gif); VISIBILITY: inherit; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 15px; CURSOR: pointer; LINE-HEIGHT: 1px; PADDING-TOP: 0px; BACKGROUND-REPEAT: no-repeat; POSITION: absolute; TOP: 4px; HEIGHT: 15px
}
.ydlg DIV.yresizable-handle-east {
BORDER-TOP-WIDTH: 0px; BACKGROUND-POSITION: right 50%; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/e-handle.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ydlg DIV.yresizable-handle-south {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/sizer/s-handle-dark.gif); BORDER-BOTTOM-WIDTH: 0px; HEIGHT: 6px; BORDER-RIGHT-WIDTH: 0px
}
.ydlg DIV.yresizable-handle-west {
BORDER-TOP-WIDTH: 0px; BACKGROUND-POSITION: 1px 50%; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/e-handle.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ydlg DIV.yresizable-handle-north {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/s.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ydlg DIV.yresizable-handle-southeast {
BORDER-TOP-WIDTH: 0px; BACKGROUND-POSITION: right bottom; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/se-handle.gif); BORDER-BOTTOM-WIDTH: 0px; WIDTH: 8px; HEIGHT: 8px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg-proxy {
BORDER-RIGHT: #b3b6b0 1px solid; BORDER-TOP: #b3b6b0 1px solid; BACKGROUND-IMAGE: url(../images/layout/gray/gradient-bg.gif); BORDER-LEFT: #b3b6b0 1px solid; BORDER-BOTTOM: #b3b6b0 1px solid; BACKGROUND-COLOR: #eae8d5
}
.ytheme-gray .ydlg-shadow {
BACKGROUND: #aaaaaa
}
.ytheme-gray .ydlg-proxy .tabset {
BACKGROUND: url(../images/layout/gray/gradient-bg.gif)
}
.ytheme-gray .ydlg .ydlg-hd {
BACKGROUND: url(../images/basic-dialog/gray/hd-sprite.gif) #333333 repeat-x 0px -82px
}
.ytheme-gray .ydlg .ydlg-hd-left {
BACKGROUND: url(../images/basic-dialog/gray/hd-sprite.gif) no-repeat 0px -41px
}
.ytheme-gray .ydlg .ydlg-hd-right {
BACKGROUND: url(../images/basic-dialog/gray/hd-sprite.gif) no-repeat right 0px
}
.ytheme-gray .ydlg .ydlg-dlg-body {
BORDER-TOP-WIDTH: 0px; BORDER-RIGHT: #b3b6b0 1px solid; BACKGROUND: #efefec; BORDER-LEFT: #b3b6b0 1px solid; BORDER-TOP-COLOR: #b3b6b0; BORDER-BOTTOM: #b3b6b0 1px solid
}
.ytheme-gray .ydlg .ytabs-top .yui-ext-tabbody {
BORDER-TOP-WIDTH: 0px; BORDER-RIGHT: #b3b6b0 1px solid; BORDER-LEFT: #b3b6b0 1px solid; BORDER-TOP-COLOR: #b3b6b0; BORDER-BOTTOM: #b3b6b0 1px solid
}
.ytheme-gray .ydlg .ytabs-bottom .yui-ext-tabbody {
BORDER-RIGHT: #b3b6b0 1px solid; BORDER-TOP: #b3b6b0 1px solid; BORDER-BOTTOM-WIDTH: 0px; BORDER-BOTTOM-COLOR: #b3b6b0; BORDER-LEFT: #b3b6b0 1px solid
}
.ytheme-gray .ydlg .ylayout-container .yui-ext-tabbody {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg .ydlg-close {
BACKGROUND-IMAGE: url(../images/basic-dialog/gray/close.gif)
}
.ytheme-gray .ydlg DIV.yresizable-handle-east {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/gray/e-handle.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg DIV.yresizable-handle-south {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/gray/s-handle.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg DIV.yresizable-handle-west {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/gray/e-handle.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg DIV.yresizable-handle-southeast {
BORDER-TOP-WIDTH: 0px; BACKGROUND-POSITION: right bottom; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/basic-dialog/gray/se-handle.gif); BORDER-BOTTOM-WIDTH: 0px; WIDTH: 8px; HEIGHT: 8px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ydlg DIV.yresizable-handle-north {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND-IMAGE: url(../images/s.gif); BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ylayout-container {
OVERFLOW: hidden; WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #c3daf9
}
.ylayout-collapsed {
BORDER-RIGHT: #98c0f4 1px solid; BORDER-TOP: #98c0f4 1px solid; Z-INDEX: 20; LEFT: -10000px; VISIBILITY: hidden; OVERFLOW: hidden; BORDER-LEFT: #98c0f4 1px solid; WIDTH: 20px; BORDER-BOTTOM: #98c0f4 1px solid; POSITION: absolute; TOP: -10000px; HEIGHT: 20px; BACKGROUND-COLOR: #c3daf9
}
.ylayout-collapsed-over {
CURSOR: pointer; BACKGROUND-COLOR: #d9e8fb
}
.ylayout-collapsed-west .ylayout-tools-button {
FLOAT: right
}
.ylayout-collapsed-east .ylayout-tools-button {
FLOAT: left
}
.ylayout-collapsed-north {
TEXT-ALIGN: right
}
.ylayout-collapsed-south {
TEXT-ALIGN: right
}
.ylayout-collapsed .ylayout-tools-button {
MARGIN: 2px; WIDTH: 12px; TEXT-ALIGN: center
}
.ylayout-inactive-content {
LEFT: -10000px; VISIBILITY: hidden; POSITION: absolute; TOP: -10000px
}
.ylayout-active-content {
VISIBILITY: visible
}
.ylayout-panel {
BORDER-RIGHT: #98c0f4 1px solid; BORDER-TOP: #98c0f4 1px solid; OVERFLOW: hidden; BORDER-LEFT: #98c0f4 1px solid; BORDER-BOTTOM: #98c0f4 1px solid; POSITION: absolute; BACKGROUND-COLOR: white
}
.ylayout-panel-east {
Z-INDEX: 10
}
.ylayout-panel-west {
Z-INDEX: 10
}
.ylayout-panel-north {
Z-INDEX: 11
}
.ylayout-panel-south {
Z-INDEX: 11
}
.ylayout-collapsed-north {
Z-INDEX: 12
}
.ylayout-collapsed-south {
Z-INDEX: 12
}
.ylayout-collapsed-east {
Z-INDEX: 12
}
.ylayout-collapsed-west {
Z-INDEX: 12
}
.ylayout-panel {
BORDER-RIGHT: #98c0f4 1px solid; BORDER-TOP: #98c0f4 1px solid; OVERFLOW: hidden; BORDER-LEFT: #98c0f4 1px solid; BORDER-BOTTOM: #98c0f4 1px solid; POSITION: absolute; BACKGROUND-COLOR: white
}
.ylayout-panel-body {
OVERFLOW: hidden
}
.ylayout-grid-wrapper {

}
.ylayout-split {
FONT-SIZE: 1px; Z-INDEX: 3; WIDTH: 5px; LINE-HEIGHT: 1px; POSITION: absolute; HEIGHT: 5px; BACKGROUND-COLOR: #c3daf9
}
.ylayout-panel-hd {
BACKGROUND-IMAGE: url(../images/layout/panel-title-light-bg.gif); COLOR: black; BORDER-BOTTOM: #98c0f4 1px solid; POSITION: relative
}
.ylayout-panel-hd-text {
PADDING-RIGHT: 4px; DISPLAY: block; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; FONT: 11px tahoma, verdana, helvetica; PADDING-TOP: 4px
}
.ylayout-panel-hd-tools {
PADDING-RIGHT: 2px; RIGHT: 0px; WIDTH: 40px; PADDING-TOP: 2px; POSITION: absolute; TOP: 0px; TEXT-ALIGN: right
}
.ylayout-tools-button {
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; Z-INDEX: 6; FLOAT: right; PADDING-BOTTOM: 2px; CURSOR: pointer; PADDING-TOP: 2px
}
.ylayout-tools-button-over {
BORDER-RIGHT: #98c0f4 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #98c0f4 1px solid; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; BORDER-LEFT: #98c0f4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #98c0f4 1px solid; BACKGROUND-COLOR: white
}
.ylayout-tools-button-inner {
BACKGROUND-POSITION: center 50%; FONT-SIZE: 1px; WIDTH: 12px; LINE-HEIGHT: 1px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 12px
}
.ylayout-close {
BACKGROUND-IMAGE: url(../images/layout/panel-close.gif)
}
.ylayout-collapse-west {
BACKGROUND-IMAGE: url(../images/layout/collapse.gif)
}
.ylayout-expand-east {
BACKGROUND-IMAGE: url(../images/layout/collapse.gif)
}
.ylayout-expand-west {
BACKGROUND-IMAGE: url(../images/layout/expand.gif)
}
.ylayout-collapse-east {
BACKGROUND-IMAGE: url(../images/layout/expand.gif)
}
.ylayout-collapse-north {
BACKGROUND-IMAGE: url(../images/layout/ns-collapse.gif)
}
.ylayout-expand-south {
BACKGROUND-IMAGE: url(../images/layout/ns-collapse.gif)
}
.ylayout-expand-north {
BACKGROUND-IMAGE: url(../images/layout/ns-expand.gif)
}
.ylayout-collapse-south {
BACKGROUND-IMAGE: url(../images/layout/ns-expand.gif)
}
.ylayout-split-h {
BACKGROUND-POSITION: left 50%; BACKGROUND-IMAGE: url(../images/sizer/e-handle.gif)
}
.ylayout-split-v {
BACKGROUND-POSITION: 50% top; BACKGROUND-IMAGE: url(../images/sizer/s-handle.gif)
}
.ylayout-panel .ytab-wrap {
BACKGROUND: url(../images/layout/gradient-bg.gif)
}
.ylayout-panel .yui-ext-tabbody {
OVERFLOW: auto; HEIGHT: 100%; BACKGROUND-COLOR: white
}
.ylayout-component-panel {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: hidden; WIDTH: 200px; PADDING-TOP: 0px; POSITION: relative; HEIGHT: 200px
}
.ylayout-nested-layout {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: hidden; WIDTH: 200px; PADDING-TOP: 0px; POSITION: relative; HEIGHT: 200px
}
.ylayout-nested-layout .ylayout-panel {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ylayout-nested-layout .ylayout-panel-north {
BORDER-BOTTOM: #98c0f4 1px solid
}
.ylayout-nested-layout .ylayout-panel-south {
BORDER-TOP: #98c0f4 1px solid
}
.ylayout-nested-layout .ylayout-panel-east {
BORDER-LEFT: #98c0f4 1px solid
}
.ylayout-nested-layout .ylayout-panel-west {
BORDER-RIGHT: #98c0f4 1px solid
}
.yui-ext-repaint {
ZOOM: 1; BACKGROUND-COLOR: transparent
}
.ylayout-panel-dragover {
BORDER-RIGHT: #6593cf 2px solid; BORDER-TOP: #6593cf 2px solid; BORDER-LEFT: #6593cf 2px solid; BORDER-BOTTOM: #6593cf 2px solid
}
.ylayout-panel-proxy {
BORDER-RIGHT: #6593cf 1px dashed; BORDER-TOP: #6593cf 1px dashed; Z-INDEX: 10001; LEFT: 0px; BACKGROUND-IMAGE: url(../images/layout/gradient-bg.gif); OVERFLOW: hidden; BORDER-LEFT: #6593cf 1px dashed; BORDER-BOTTOM: #6593cf 1px dashed; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #c3daf9
}
.ylayout-slider {
Z-INDEX: 15; OVERFLOW: hidden; POSITION: absolute
}
.ytheme-gray {
BACKGROUND-COLOR: #f3f2e7
}
DIV.ytheme-gray {
BACKGROUND-COLOR: #f3f2e7
}
.ytheme-gray .ylayout-container {
BACKGROUND-COLOR: #f3f2e7
}
.ytheme-gray {
BACKGROUND-COLOR: #f3f2e7
}
.ytheme-gray .ylayout-collapsed {
BORDER-RIGHT: #aca899 1px solid; BORDER-TOP: #aca899 1px solid; BORDER-LEFT: #aca899 1px solid; BORDER-BOTTOM: #aca899 1px solid; BACKGROUND-COLOR: #f3f2e7
}
.ytheme-gray .ylayout-collapsed-over {
BACKGROUND-COLOR: #fbfbef
}
.ytheme-gray .ylayout-panel {
BORDER-RIGHT: #aca899 1px solid; BORDER-TOP: #aca899 1px solid; BORDER-LEFT: #aca899 1px solid; BORDER-BOTTOM: #aca899 1px solid
}
.ytheme-gray .ylayout-nested-layout .ylayout-panel {
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
.ytheme-gray .ylayout-split {
BACKGROUND-COLOR: #f3f2e7
}
.ytheme-gray .ylayout-panel-hd {
BACKGROUND-IMAGE: url(../images/layout/gray/panel-title-light-bg.gif); BORDER-BOTTOM: #aca899 1px solid
}
.ytheme-gray .ylayout-tools-button-over {
BORDER-RIGHT: #aca899 1px solid; BORDER-TOP: #aca899 1px solid; BORDER-LEFT: #aca899 1px solid; BORDER-BOTTOM: #aca899 1px solid
}
.ytheme-gray .ylayout-close {
BACKGROUND-IMAGE: url(../images/layout/gray/panel-close.gif)
}
.ytheme-gray .ylayout-collapse-west {
BACKGROUND-IMAGE: url(../images/layout/gray/collapse.gif)
}
.ytheme-gray .ylayout-expand-east {
BACKGROUND-IMAGE: url(../images/layout/gray/collapse.gif)
}
.ytheme-gray .ylayout-expand-west {
BACKGROUND-IMAGE: url(../images/layout/gray/expand.gif)
}
.ytheme-gray .ylayout-collapse-east {
BACKGROUND-IMAGE: url(../images/layout/gray/expand.gif)
}
.ytheme-gray .ylayout-collapse-north {
BACKGROUND-IMAGE: url(../images/layout/gray/ns-collapse.gif)
}
.ytheme-gray .ylayout-expand-south {
BACKGROUND-IMAGE: url(../images/layout/gray/ns-collapse.gif)
}
.ytheme-gray .ylayout-expand-north {
BACKGROUND-IMAGE: url(../images/layout/gray/ns-expand.gif)
}
.ytheme-gray .ylayout-collapse-south {
BACKGROUND-IMAGE: url(../images/layout/gray/ns-expand.gif)
}
.ytheme-gray .ylayout-split-h {
BACKGROUND-IMAGE: url(../images/sizer/gray/e-handle-dark.gif)
}
.ytheme-gray .ylayout-split-v {
BACKGROUND-IMAGE: url(../images/sizer/gray/s-handle-dark.gif)
}
.ytheme-gray .ylayout-panel .ytab-wrap {
BACKGROUND: url(../images/layout/gray/gradient-bg.gif)
}
.ytheme-gray .ylayout-nested-layout .ylayout-panel-north {
BORDER-BOTTOM: #aca899 1px solid
}
.ytheme-gray .ylayout-nested-layout .ylayout-panel-south {
BORDER-TOP: #aca899 1px solid
}
.ytheme-gray .ylayout-nested-layout .ylayout-panel-east {
BORDER-LEFT: #aca899 1px solid
}
.ytheme-gray .ylayout-nested-layout .ylayout-panel-west {
BORDER-RIGHT: #aca899 1px solid
}
.ytheme-gray .ylayout-panel-dragover {
BORDER-RIGHT: #aca899 2px solid; BORDER-TOP: #aca899 2px solid; BORDER-LEFT: #aca899 2px solid; BORDER-BOTTOM: #aca899 2px solid
}
.ytheme-gray .ylayout-panel-proxy {
BORDER-RIGHT: #aca899 1px dashed; BORDER-TOP: #aca899 1px dashed; BACKGROUND-IMAGE: url(../images/layout/gray/gradient-bg.gif); BORDER-LEFT: #aca899 1px dashed; BORDER-BOTTOM: #aca899 1px dashed; BACKGROUND-COLOR: #f3f2e7
}

/*
* yui-ext
* Copyright(c) 2006, Jack Slocum.
*/
/*
1.数据的来源；数据怎么来
2.数据怎么显示，数据显示的形式
*/
var XmlExample = {
init : function(){
var schema = {
tagName: 'Item',
id: 'ASIN',
fields: ['Author', 'Title', 'Manufacturer', 'ProductGroup']
};
dataModel = new YAHOO.ext.grid.XMLDataModel(schema);

// the DefaultColumnModel expects this blob to define columns. It can be extended to provide
// custom or reusable ColumnModels
var colModel = new YAHOO.ext.grid.DefaultColumnModel([
{header: "Author", width: 120, sortable: true},
{header: "Title", width: 120, sortable: true},
{header: "Manufacturer", width: 105, sortable: true},
{header: "Product Group", width: 100, sortable: true}
]);

// create the Grid
var grid = new YAHOO.ext.grid.Grid('example-grid', dataModel, colModel);
grid.autoWidth = true;
grid.autoHeight = true;
grid.render();

dataModel.load('demos/sheldon.xml');
}
}
YAHOO.ext.EventManager.onDocumentReady(XmlExample.init, XmlExample, true);

Sidney SheldonMaster of the GameWarner BooksBookSidney SheldonAre You Afraid of the Dark?Warner BooksBookSidney SheldonIf Tomorrow ComesWarner BooksBookSidney SheldonTell Me Your DreamsWarner VisionBookSidney SheldonBloodlineWarner BooksBookSidney SheldonThe Other Side of MeWarner BooksBookSidney SheldonA Stranger in the MirrorWarner BooksBookSidney SheldonThe Sky Is FallingWilliam Morrow & CompanyBookSidney SheldonNothing Lasts ForeverWarner BooksBookSidney SheldonThe Naked FaceWarner BooksBook

Author

Title

Manufacturer

Product Group

Author: Loading...

DataModel包含的类如下：

AbstractDataModel

提供事件event infrastructure等义接口interface

'-DefaultDataModel

定义了操控数据的API

'-LoadableDataModel

AJAX服务的基类

'-XMLDataModel

包含以上的功能和提供XML的数据调用

看上去，这分得很详细，详细到好像过于复杂。但是在我看来，对于提升代码的可再用和扩展性，建立一个结实的DataModel是尤其重要的部分。正是基于这种方法，DataModel便能为其它的组件可再用，而不需要太多的组件--尽管它是庞大的。

如果你打开Js文件观察的话，将会发现只需几行代码便可设置XMLDataModel:

var schema = {

  tagName: 'Item',

  id: 'ASIN',

  fields: ['Author', 'Title', 'Manufacturer', 'ProductGroup']

};

this.dataModel = new YAHOO.ext.grid.XMLDataModel(schema);

实际加载的数据：

// 参数可以是url encoed或对象类型

var params = {'author': author};

//回调函数清除loading

this.dataModel.load('/blog/examples/amazon.php', params, this.clearIndicator);

表头能够对gird排序。现在进行新一番的搜索，例如输入John,数据加载后仍然按照你指定的方式排序。这是新的功能。

在一个实际项目中，我们需要一个能提供回调参数的，方便的异常处理机制。LoadableDataModel就就包含这种事件（onLoadException）。

总的来说，一切进展顺利。有些Part1的反馈告诉，Gird在Safari和其它浏览器上能够工作^^。说真的,有些反馈真的不错！ thanks!

对YUI扩展的Gird组件 Part-2

原文在这里文章日期:2006-9-2 代码在这里 Q:unknown { content: '' } Q:unknown { content: '' } .ygrid-cell-text { PADDING-RIGHT: 5px; DISPLAY: block; PADDING-LEFT: 5px; PADDING-BOTTOM: 3px; FONT: 8pt arial; OVERFLOW: hidden; PADDING-TOP: 3px; WHITE-SPACE: nowrap } .y
对YUI扩展的Gird组件 Part-1

原文地址文章日期:2006/9/26 新版的GIRD可以支持远程数据了.分页和远程排序的设置是通俗易懂的,另外一些常用的自定义的参数我会在这篇贴子中说明一下.新论坛的界面(在建设中)就是一个分页和远程排序的好例子,而本文的代码均来自那个例子. 新方法和属性利用LoadableDatatModel对象(XMLDataModel和JSONDataModel的父类)实现分页和远程排序,有若干种的新方法和属性. 下列变量"dm"指的是DataModel的实例. 方法 initPaging(
layui扩展上传组件模拟进度条的方法

如下所示: <div id="uploadPatchForm" style="display:none" class="roundRect"> <div id="uploadLoadingDiv"> <div class="layui-progress" lay-showpercent="true" lay-filter="demo" &
Gird组件 Part-3:范例RSSFeed Viewer

原文地址文章日期:2006/09/04 新组件Gird包含了许多的类和继承方法.如果读者不是太熟悉的面向对象开发的话,可能会对一个变量如何从某个类得到继承的方法感到困惑,用起GIRD来感到困难.在YAHOO.ext.gird包中,大多数类是设计成为"即插即用plug and play"的,可扩展的extended和可自定义的customized,能以最小量的代码插入轻松到web程序中. 要测试和创建一个实现gird的范例,我决定做一个简单的,只有一页的RSS种子采集器RSS Feed
dojo随手记 gird组件引用

我建了一个文件里面代码是网上下的<精通dojo>的代码: 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- ! Excerpted from "Mastering Dojo", ! published by The Pragmati
详解Vue2.0组件的继承与扩展

前言本文将介绍vue2.0中的组件的继承与扩展,主要分享slot.mixins/extends和extend的用法. 一.slot 1.默认插槽和匿名插槽 slot用来获取组件中的原内容,此方式用于父组件向子组件传递"标签数据".有的时候为插槽提供默认的内容是很有用的,例如,一个<my-hello> 组件可能希望这个按钮的默认内容是"如果没有原内容,则显示该内容",但是同时允许用户覆写为别的内容. <body> <div id=&qu
.NET Core 3.0之创建基于Consul的Configuration扩展组件

经过前面三篇关于.NET Core Configuration的文章之后,本篇文章主要讨论如何扩展一个Configuration组件出来. 了解了Configuration的源码后,再去扩展一个组件就会比较简单,接下来我们将在.NET Core 3.0-preview5的基础上创建一个基于Consul的配置组件. 相信大家对Consul已经比较了解了,很多项目都会使用Consul作为配置中心,此处也不做其他阐述了,主要是讲一下,创建Consul配置扩展的一些思路.使用Consul配置功能时,我们
vue 扩展现有组件的操作

1. 使用vue.mixin全局混入混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式.混入对象可以包含任意组件选项.当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项.mixins 选项接受一个混合对象的数组. 混入的主要用途 1.在你已经写好了构造器后,需要增加方法或者临时的活动时使用的方法,这时用混入会减少源代码的污染. 2.很多地方都会用到的公用方法,用混入的方法可以减少代码量,实现代码重用. <h1>Mixins</h1> <
学习YUI.Ext 第七天--关于View&JSONView

展现一条一条的二维关系的数据,我们可以使用GIRD组件. 但有些场合,如产品展示,画册,我们可以使用View组件,来展示"矩阵"式的数据. View的数据源来自DataModel对象,即包含XMLDataModel和JSONDataModel.尽管View支持JSON,但如果不是用于DataModel,View的子类JSONView更适用,因为它提供更多的事件和方法.一般来说,View用于XML数据源:JSONView用于JSON数据源. View如何工作? 记得以前如何输出一个记录吗
Vue.js组件通信的几种姿势

写在前面因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出. 文章的原地址: https://github.com/answershuto/learnVue . 在学习过程中,为Vue加上了中文的注释 https://github.com/answershuto/learnVue/tree/master/vue-src ,希望可以对其他想学习Vue源码的小伙伴有所帮助. 可能会有理解存在偏差的地方,欢迎提issu

对YUI扩展的Gird组件 Part-2

相关推荐

随机推荐