Team:Marburg/Template:Colorbox.css

From 2013.igem.org

(Difference between revisions)
m
 
(2 intermediate revisions not shown)
Line 1: Line 1:
-
/* line 7, ../sass/lightbox.sass */
+
<html><style>
-
body:after {
+
/**
-
  content: url(../img/close.png) url(../img/loading.gif) url(../img/prev.png) url(../img/next.png);
+
* jQuery lightBox plugin
-
  display: none;
+
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 +
* and adapted to me for use like a plugin from jQuery.
 +
* @name jquery-lightbox-0.5.css
 +
* @author Leandro Vieira Pinho - http://leandrovieira.com
 +
* @version 0.5
 +
* @date April 11, 2008
 +
* @category jQuery plugin
 +
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 +
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 +
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 +
*/
 +
#jquery-overlay {
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
z-index: 90;
 +
width: 100%;
 +
height: 500px;
}
}
-
 
+
#jquery-lightbox {
-
/* line 11, ../sass/lightbox.sass */
+
position: absolute;
-
.lightboxOverlay {
+
top: 0;
-
  position: absolute;
+
left: 0;
-
  top: 0;
+
width: 100%;
-
  left: 0;
+
z-index: 100;
-
  z-index: 9999;
+
text-align: center;
-
  background-color: black;
+
line-height: 0;
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
+
-
  opacity: 0.8;
+
-
  display: none;
+
}
}
-
 
+
#jquery-lightbox a img { border: none; }
-
/* line 20, ../sass/lightbox.sass */
+
#lightbox-container-image-box {
-
.lightbox {
+
position: relative;
-
  position: absolute;
+
background-color: #fff;
-
  left: 0;
+
width: 250px;
-
  width: 100%;
+
height: 250px;
-
  z-index: 10000;
+
margin: 0 auto !important;
-
  text-align: center;
+
-
  line-height: 0;
+
-
  font-weight: normal;
+
}
}
-
/* line 28, ../sass/lightbox.sass */
+
#lightbox-container-image { padding: 10px !important; }
-
.lightbox .lb-image {
+
#lightbox-loading {
-
  display: block;
+
position: absolute;
-
  height: auto;
+
top: 40%;
-
  max-width: inherit;
+
left: 0%;
-
  -webkit-border-radius: 3px;
+
height: 25%;
-
  -moz-border-radius: 3px;
+
width: 100%;
-
  -ms-border-radius: 3px;
+
text-align: center;
-
  -o-border-radius: 3px;
+
line-height: 0;
-
  border-radius: 3px;
+
}
}
-
/* line 33, ../sass/lightbox.sass */
+
#lightbox-nav {
-
.lightbox a img {
+
position: absolute;
-
  border: none;
+
top: 0;
 +
left: 0;
 +
height: 100%;
 +
width: 100%;
 +
z-index: 10;
}
}
-
 
+
#lightbox-container-image-box > #lightbox-nav { left: 0; }
-
/* line 36, ../sass/lightbox.sass */
+
#lightbox-nav a { outline: none;}
-
.lb-outerContainer {
+
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
-
  position: relative;
+
width: 49%;
-
  background-color: white;
+
height: 100%;
-
  *zoom: 1;
+
zoom: 1;
-
  width: 250px;
+
display: block;
-
  height: 250px;
+
-
  margin: 0 auto;
+
-
  -webkit-border-radius: 4px;
+
-
  -moz-border-radius: 4px;
+
-
  -ms-border-radius: 4px;
+
-
  -o-border-radius: 4px;
+
-
  border-radius: 4px;
+
}
}
-
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
+
#lightbox-nav-btnPrev {  
-
.lb-outerContainer:after {
+
left: 0;  
-
  content: "";
+
float: left;
-
  display: table;
+
-
  clear: both;
+
}
}
-
 
+
#lightbox-nav-btnNext {  
-
/* line 45, ../sass/lightbox.sass */
+
right: 0;
-
.lb-container {
+
float: right;
-
  padding: 4px;
+
}
}
-
 
+
#lightbox-container-image-data-box {
-
/* line 48, ../sass/lightbox.sass */
+
font: 10px Verdana, Helvetica, sans-serif;
-
.lb-loader {
+
background-color: #fff;
-
  position: absolute;
+
margin: 0 auto !important;
-
  top: 43%;
+
line-height: 1.4em;
-
  left: 0%;
+
overflow: auto;
-
  height: 25%;
+
width: 100%;
-
  width: 100%;
+
padding: 0 10px 0  !important;
-
  text-align: center;
+
-
  line-height: 0;
+
}
}
-
 
+
#lightbox-container-image-data {
-
/* line 57, ../sass/lightbox.sass */
+
padding: 0 10px !important;  
-
.lb-cancel {
+
color: #666;  
-
  display: block;
+
-
  width: 32px;
+
-
  height: 32px;
+
-
  margin: 0 auto;
+
-
  background: url(../img/loading.gif) no-repeat;
+
}
}
-
 
+
#lightbox-container-image-data #lightbox-image-details {  
-
/* line 64, ../sass/lightbox.sass */
+
width: 70%;  
-
.lb-nav {
+
float: left;  
-
  position: absolute;
+
text-align: left;  
-
  top: 0;
+
}
-
  left: 0;
+
#lightbox-image-details-caption { font-weight: bold; }
-
  height: 100%;
+
#lightbox-image-details-currentNumber {
-
  width: 100%;
+
display: block;  
-
  z-index: 10;
+
clear: left;  
-
}
+
padding-bottom: 1.0em !important;
-
 
+
}
-
/* line 72, ../sass/lightbox.sass */
+
#lightbox-secNav-btnClose {
-
.lb-container > .nav {
+
width: 66px;  
-
  left: 0;
+
float: right;
-
}
+
padding-bottom: 0.7em !important;
-
 
+
-
/* line 75, ../sass/lightbox.sass */
+
-
.lb-nav a {
+
-
  outline: none;
+
-
}
+
-
 
+
-
/* line 78, ../sass/lightbox.sass */
+
-
.lb-prev, .lb-next {
+
-
  width: 49%;
+
-
  height: 100%;
+
-
  cursor: pointer;
+
-
  /* Trick IE into showing hover */
+
-
  display: block;
+
-
}
+
-
 
+
-
/* line 85, ../sass/lightbox.sass */
+
-
.lb-prev {
+
-
  left: 0;
+
-
  float: left;
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+
-
  opacity: 0;
+
-
  -webkit-transition: opacity 0.6s;
+
-
  -moz-transition: opacity 0.6s;
+
-
  -o-transition: opacity 0.6s;
+
-
  transition: opacity 0.6s;
+
-
}
+
-
/* line 90, ../sass/lightbox.sass */
+
-
.lb-prev:hover {
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+
-
  opacity: 1;
+
-
  background: url(../img/prev.png) left 48% no-repeat;
+
-
}
+
-
 
+
-
/* line 94, ../sass/lightbox.sass */
+
-
.lb-next {
+
-
  right: 0;
+
-
  float: right;
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+
-
  opacity: 0;
+
-
  -webkit-transition: opacity 0.6s;
+
-
  -moz-transition: opacity 0.6s;
+
-
  -o-transition: opacity 0.6s;
+
-
  transition: opacity 0.6s;
+
-
}
+
-
/* line 99, ../sass/lightbox.sass */
+
-
.lb-next:hover {
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+
-
  opacity: 1;
+
-
  background: url(../img/next.png) right 48% no-repeat;
+
-
}
+
-
 
+
-
/* line 103, ../sass/lightbox.sass */
+
-
.lb-dataContainer {
+
-
  margin: 0 auto;
+
-
  padding-top: 5px;
+
-
  *zoom: 1;
+
-
  width: 100%;
+
-
  -moz-border-radius-bottomleft: 4px;
+
-
  -webkit-border-bottom-left-radius: 4px;
+
-
  border-bottom-left-radius: 4px;
+
-
  -moz-border-radius-bottomright: 4px;
+
-
  -webkit-border-bottom-right-radius: 4px;
+
-
  border-bottom-right-radius: 4px;
+
-
}
+
-
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
+
-
.lb-dataContainer:after {
+
-
  content: "";
+
-
  display: table;
+
-
  clear: both;
+
-
}
+
-
 
+
-
/* line 110, ../sass/lightbox.sass */
+
-
.lb-data {
+
-
  padding: 0 4px;
+
-
  color: #bbbbbb;
+
-
}
+
-
/* line 113, ../sass/lightbox.sass */
+
-
.lb-data .lb-details {
+
-
  width: 85%;
+
-
  float: left;
+
-
  text-align: left;
+
-
  line-height: 1.1em;
+
-
}
+
-
/* line 118, ../sass/lightbox.sass */
+
-
.lb-data .lb-caption {
+
-
  font-size: 13px;
+
-
  font-weight: bold;
+
-
  line-height: 1em;
+
-
}
+
-
/* line 122, ../sass/lightbox.sass */
+
-
.lb-data .lb-number {
+
-
  display: block;
+
-
  clear: left;
+
-
  padding-bottom: 1em;
+
-
  font-size: 12px;
+
-
  color: #999999;
+
-
}
+
-
/* line 128, ../sass/lightbox.sass */
+
-
.lb-data .lb-close {
+
-
  display: block;
+
-
  float: right;
+
-
  width: 30px;
+
-
  height: 30px;
+
-
  background: url(../img/close.png) top right no-repeat;
+
-
  text-align: right;
+
-
  outline: none;
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
+
-
  opacity: 0.7;
+
-
  -webkit-transition: opacity 0.2s;
+
-
  -moz-transition: opacity 0.2s;
+
-
  -o-transition: opacity 0.2s;
+
-
  transition: opacity 0.2s;
+
-
}
+
-
/* line 138, ../sass/lightbox.sass */
+
-
.lb-data .lb-close:hover {
+
-
  cursor: pointer;
+
-
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+
-
  opacity: 1;
+
}
}
 +
</style></html>

Latest revision as of 07:21, 4 October 2013