| New file |
|---|
| 0,0 → 1,337 |
|---|
| /* |
| This is the master CSS file for the dojox.image project, and provides all |
| needed definitions for: |
| |
| dojox.image.Lightbox |
| dojox.image.Gallery [which is a combination of:] |
| dojox.image.SlideShow |
| dojox.image.ThumbNailPicker |
| |
| */ |
| |
| |
| /* dojox.image.Lightbox:base */ |
| /* FIXME: should be be doing this? I want a black underlay, but this sets ALL dialogs to black, |
| but because it's decendant of body, i can't set this color any other way ... */ |
| .dijitDialogUnderlay { |
| background-color:#000; |
| } |
| |
| .dojoxLightbox { |
| position:absolute; |
| z-index:999; |
| overflow:hidden; |
| width:100px; |
| height:100px; |
| border:11px solid #fff; |
| background:#fff url('images/loading.gif') no-repeat center center; |
| |
| /* special safari + FF specific rounding + shadows */ |
| -webkit-box-shadow: 0px 6px 10px #636363; /* #adadad; */ |
| -webkit-border-radius: 3px; |
| -moz-border-radius:4px; |
| } |
| |
| .dojoxLightboxContainer { |
| position:absolute; |
| top:0; left:0; |
| } |
| |
| .dojoxLightboxFooter { |
| height:50px; |
| position:relative; |
| bottom:0; |
| left:0; |
| margin-top:8px; |
| color:#333; |
| z-index:1000; |
| font-size:10pt; |
| } |
| |
| .dojoxLightboxGroupText { |
| color:#666; |
| font-size:8pt; |
| } |
| |
| .LightboxNext, |
| .LightboxPrev, |
| .LightboxClose { |
| float:right; |
| width:16px; |
| height:16px; |
| cursor:pointer; |
| } |
| |
| /* dojox.image.Lightbox:tundra */ |
| .tundra .LightboxClose { |
| background:url('../../../dijit/themes/tundra/images/tabClose.png') no-repeat center center; |
| } |
| .tundra .LightboxNext { |
| background:url('../../../dijit/themes/tundra/images/arrowRight.png') no-repeat center center; |
| } |
| .tundra .LightboxPrev { |
| background:url('../../../dijit/themes/tundra/images/arrowLeft.png') no-repeat center center; |
| } |
| |
| /* dojox.image.Lightbox:soria */ |
| .soria .LightboxNext, |
| .soria .LightboxPrev, |
| .soria .LightboxClose { |
| background:url('../../../dijit/themes/soria/images/arrows.png') no-repeat center center; |
| background-position:-65px 0; |
| } |
| .soria .LightboxNext { |
| background-position:-48px 0; |
| } |
| .soria .LightboxPrev { |
| background-position:-16px 0; |
| } |
| |
| /* dojox.image.SlideShow */ |
| |
| .slideShowWrapper { |
| position:relative; |
| background:#fff; |
| padding:8px; |
| border:1px solid #333; |
| padding-bottom:20px; |
| overflow:hidden; |
| text-align: center; |
| -moz-border-radius:3pt; |
| -webkit-border-radius:4pt; |
| -webkit-drop-shadow:#ccc 4pt; |
| } |
| .slideShowNav { |
| position:absolute; |
| bottom:-18px; |
| left:0px; |
| padding:0px 3px 2px 0px; |
| background-color:#fff; |
| width:100%; |
| } |
| .slideShowNavWrapper { float:right; } |
| .slideShowTitle { |
| float:left; |
| color:#333; |
| font-size:10pt; |
| } |
| .slideShowTitle .slideShowCounterText { |
| font-size:6pt; color:#666; |
| } |
| .slideShowHidden { |
| position:absolute; |
| display: none; |
| height: 1px; |
| width: 1px; |
| } |
| .slideShowImageWrapper { |
| position:relative; |
| text-align: center; |
| margin-top: -42px; |
| float: left; |
| width: 100%; |
| } |
| .slideShowImageWrapper img { |
| border: 0px none; |
| } |
| .slideShowNotifier { |
| background-color: red; |
| width: 100px; |
| height: 5px; |
| font-size: 1%;/*IE hack to get around the Empty-Div bug*/ |
| } |
| .slideShowSlideShow { |
| position:absolute; |
| top:30px; |
| padding: 0 5px; |
| border: 0px; |
| text-decoration: none; |
| color: #2e6ab1; |
| } |
| .slideShowLoading { background-color: #fad66a; } |
| .slideShowLoaded { background-color: transparent; } |
| /* |
| .sprite-arrowbottom { background-position: 0 -30px; } |
| .sprite-arrowtop { background-position: 0 -430px; } |
| */ |
| .slideShowCtrlPrev { |
| background-position: -96px 0px; |
| float: left; |
| } |
| .slideShowCtrlNext { |
| background-position: -144px 0px; |
| float: right; |
| } |
| .slideShowCtrlPlay { |
| background-position: -190px 0px; |
| position: absolute; |
| } |
| .slideShowPaused .slideShowCtrlPlay { |
| background-position: -236px 0px; |
| position: absolute; |
| } |
| .slideShowCtrl span.slideShowCtrlHide { |
| background-image: url("images/1pixel.gif"); |
| cursor: auto; |
| } |
| |
| .slideShowCtrl { |
| height: 50px; |
| width: 100%; |
| position: relative; |
| z-index:999; |
| float: left; |
| } |
| .slideShowCtrl span { |
| width: 50px; |
| height: 100%; |
| background-image: url("images/buttons.png"); |
| cursor: pointer; |
| } |
| .dj_ie6 .slideShowCtrl span { |
| background-image: url("images/buttons.gif"); |
| } |
| |
| .dj_ie6 .slideShowPager li.currentpage, |
| .dj_ie6 .pagination li.disablepage{ |
| /*IE 6 and below. Adjust non linked LIs slightly to account for bugs*/ |
| margin-right: 5px; |
| padding-right: 0; |
| } |
| |
| /* dojox.image.ThumbnailPicker */ |
| |
| .thumbWrapper .thumbNav { |
| background-repeat: no-repeat; |
| background-position: center; |
| padding-top: 1px; |
| width: 30px; |
| height: 100%; |
| } |
| |
| .thumbOuter { |
| padding-bottom: 2px; |
| } |
| |
| .thumbOuter.thumbHoriz { |
| width: 500px; |
| height: 85px; |
| } |
| |
| .thumbOuter.thumbVert { |
| width: 100px; |
| height: 400px; |
| } |
| |
| .thumbOuter .enabled { |
| background: transparent url("images/buttons.png") no-repeat center center; |
| } |
| .dj_ie6 .thumbOuter .enabled { background-image: url("images/buttons.gif"); } |
| |
| .thumbOuter .thumbNav img { |
| width: 48px; |
| height: 75px; |
| } |
| .thumbOuter .thumbClickable div { |
| cursor: pointer; |
| } |
| .thumbOuter .prevHoriz { |
| background-position: -96px 12px; |
| position: relative; |
| float: left; |
| height: 100%; |
| } |
| |
| .thumbOuter .nextHoriz { |
| background-position: -144px 12px; |
| position: relative; |
| float: right; |
| height: 100%; |
| /* margin-top: -85px;*/ |
| } |
| .thumbOuter .prevVert { |
| background-position: 0px 0px; |
| height: 48px; |
| width:48px; |
| margin-left:24px; |
| } |
| |
| .thumbOuter .nextVert { |
| background-position: -48px 0px; |
| height: 48px; |
| width:48px; |
| margin-left:24px; |
| } |
| |
| .thumbWrapper img { |
| height: 75px; |
| max-width: 100px; |
| width: expression(this.width > 100 ? 100: true);/*IE Hack*/ |
| } |
| |
| .thumbWrapper .thumbNav .imageGalleryThumb { |
| height: 50px; |
| } |
| |
| .thumbWrapper .thumbNotifier { |
| background-color: red; |
| width: 0px; |
| margin-left: 2px; |
| height: 5px; |
| font-size: 1%;/*IE hack to get around the Empty-Div bug*/ |
| } |
| |
| .thumbWrapper .thumbLoaded { |
| background-color: transparent; |
| } |
| |
| .thumbScroller { |
| overflow-x: hidden; |
| overflow-y: hidden; |
| white-space: nowrap; |
| text-align: center; |
| } |
| |
| .thumbHoriz .thumbScroller { |
| width: 500px; |
| height: 85px; |
| float: left; |
| } |
| |
| .thumbVert .thumbScroller { |
| height: 500px; |
| width: 100px; |
| } |
| |
| .thumbWrapper { |
| float: left; |
| } |
| |
| .thumbVert .thumbWrapper { |
| width: 100px; |
| height: 10px; |
| } |
| .thumbHoriz .thumbWapper { |
| height:85px; |
| width: 10px; |
| } |
| |
| .thumbWrapper.thumbHoriz div { |
| float: left; |
| padding-right: 2px; |
| } |
| |
| .thumbWrapper.thumbVert { |
| width: 100px; |
| } |
| |
| .thumbWrapper.thumbVert div { |
| padding-bottom: 2px; |
| } |
| |
| /* dojox.image.Gallery */ |
| |
| .imageGalleryWrapper { |
| padding-bottom: 20px; |
| text-align: center; |
| } |