Team:Grenoble/Design/css0

From 2011.igem.org

(Difference between revisions)
Line 108: Line 108:
/* Slider (thanks to flowplayer.org) */
/* Slider (thanks to flowplayer.org) */
/*************************************/
/*************************************/
-
.scrollable {
+
.scrollable  
 +
{
/* required settinsg */
/* required settinsg */
position: relative;
position: relative;
Line 118: Line 119:
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
     -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* for the Safari browser */
     -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* for the Safari browser */
-
     background: #FFFFFF;}
+
     background: #FFFFFF;
-
.scrollable .items {
+
   
 +
/*
 +
    -webkit-box-shadow: #666666 0px 2px 3px;
 +
-moz-box-shadow: #666666 0px 2px 3px;
 +
 +
-webkit-border-radius: 8px;
 +
-moz-border-radius: 8px;
 +
border-radius: 8px;
 +
*/
 +
}
 +
   
 +
.scrollable .items  
 +
{
/* this cannot be too large */
/* this cannot be too large */
width: 50000px;
width: 50000px;
-
position: absolute;}
+
position: absolute;
-
.items div {
+
}
 +
 +
.items div  
 +
{
float: left;
float: left;
width: 963px;
width: 963px;
-
height: 370px;}
+
height: 370px;
-
.prev {
+
}
-
        background: url(https://static.igem.org/mediawiki/2011/8/81/DTU-Denmark2011-slider-prev.png) no-repeat;
+
-
        height: 74px;
+
.prev  
-
        width: 74px;
+
{
-
        position: absolute;
+
background: url(https://static.igem.org/mediawiki/2011/8/81/DTU-Denmark2011-slider-prev.png) no-repeat;
-
            left: -518px; /* ceil(963/2) + 74/2 = 482 + 37 = 519 */
+
height: 74px;
-
            top: 310px;
+
width: 74px;
-
        margin-left: 50%;
+
position: absolute;
-
        cursor: pointer;}
+
left: -518px; /* ceil(963/2) + 74/2 = 482 + 37 = 519 */
-
.next {
+
top: 310px;
-
        background: url(https://static.igem.org/mediawiki/2011/5/56/DTU-Denmark2011-slider-next.png) no-repeat;
+
margin-left: 50%;
-
        height: 74px;
+
cursor: pointer;
-
        width: 74px;
+
}
-
        margin-right: 50%;
+
       
-
        position: absolute;
+
.next  
-
            right: -519px; /* floor(963/2) + 74/2 = 481 + 37 = 518 */
+
{
-
            top: 310px;
+
background: url(https://static.igem.org/mediawiki/2011/5/56/DTU-Denmark2011-slider-next.png) no-repeat;
-
        cursor: pointer;}
+
height: 74px;
-
.disabled {
+
width: 74px;
-
         visibility: hidden;}
+
margin-right: 50%;
 +
position: absolute;
 +
right: -519px; /* floor(963/2) + 74/2 = 481 + 37 = 518 */
 +
top: 310px;
 +
cursor: pointer;
 +
}
 +
       
 +
.disabled  
 +
{
 +
         visibility: hidden;
 +
}
 +
       
/* position and dimensions of the navigator */
/* position and dimensions of the navigator */
-
.navi {
+
.navi  
 +
{
     left: -56px;
     left: -56px;
     margin-left: 50%;
     margin-left: 50%;
     position: absolute;
     position: absolute;
     top: 505px;
     top: 505px;
-
     width: 112px;}
+
     width: 112px;
-
.navi a {
+
}
 +
   
 +
.navi a  
 +
{
width: 8px;
width: 8px;
height: 8px;
height: 8px;
Line 162: Line 193:
/*background: url(https://static.igem.org/mediawiki/2011/2/22/DTU-Denmark2011-slider-navigator-dark.png) 0 0 no-repeat;*/
/*background: url(https://static.igem.org/mediawiki/2011/2/22/DTU-Denmark2011-slider-navigator-dark.png) 0 0 no-repeat;*/
display: block;
display: block;
-
font-size: 1px;}
+
font-size: 1px;
-
.navi a:hover {
+
}
-
background-position: 0 -8px;}
+
-
.navi a.active {
+
.navi a:hover  
-
background-position: 0 -16px;}
+
{
 +
background-position: 0 -8px;
 +
}
 +
 +
.navi a.active  
 +
{
 +
background-position: 0 -16px;
 +
}

Revision as of 14:08, 22 October 2011

/* Enlever l'entête et le pied de page wiki, ainsi que les bords: (ce code garde les liens pour éditer le wiki)

  • /
  1. contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo

{ 

   display:none;

}

  1. top-section

{ 

   border: none;
   height: 0px;

}

  1. content

{ 

   border: none;

}

/* Coloration du menu en bleu, fond blanc ou transparent ? en tout cas menu invisible sauf si on passe dessus avec la souris

  • /

.left-menu:hover { 

   background-color: transparent;

}

  1. menubar:hover

{ 

   color: #0F174D;

}

  1. menubar li a

{ 

   background-color: transparent;
   color: transparent;

}

  1. menubar:hover li a

{ 

   color: #0F174D;

}

/* Enlever le "teams" de la bare wiki qui sert à rien, enlève également le Deconnexion

  • /
  1. menubar > ul > li:last-child

{ 

   display: none;

}

/* Style d'écriture du contenu devrait permettre d'éviter de devoir écrire trop de truc pour p li ul ol table etc...

  • /
  1. content

{ 

   font: normal 14px Verdana, Arial, Helvetica, sans-serif;
   color:#0F174D;

}


/* Mise en page, en-tête, couleur de fond, bannière, etc...

  • /

body,#content{ 

   background: #ADD1FF;

}

  1. header

{ 

   background: url("Banderolle_wiki.png") no-repeat #ADD1FF;
   height: 160px;
   margin-left: 68px;
   width: 829px;
   border: 1px solid #477CBF;
   
   -webkit-box-shadow: #666666 0px 2px 3px;

-moz-box-shadow: #666666 0px 2px 3px;

-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }

/*

  1. innercontent { 
   padding: 1px;} Important!
  • /



/* 

* 
* 
* 	Diaporama
* 
* 
*
  • /

/* Slider (thanks to flowplayer.org) */ /*************************************/ .scrollable { /* required settinsg */ position: relative; overflow :hidden; 

   margin-top: 14px;
   width: 963px;
   height: 370px;
   border: 1px solid #FFFFFF;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
   -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* for the Safari browser */
   background: #FFFFFF;

/* 

   -webkit-box-shadow: #666666 0px 2px 3px;

-moz-box-shadow: #666666 0px 2px 3px;

-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;

  • /

}

.scrollable .items { /* this cannot be too large */ width: 50000px; position: absolute; }

.items div { float: left; width: 963px; height: 370px; }

.prev { background: url(DTU-Denmark2011-slider-prev.png) no-repeat; height: 74px; width: 74px; position: absolute; left: -518px; /* ceil(963/2) + 74/2 = 482 + 37 = 519 */ top: 310px; margin-left: 50%; cursor: pointer; }

.next { background: url(DTU-Denmark2011-slider-next.png) no-repeat; height: 74px; width: 74px; margin-right: 50%; position: absolute; right: -519px; /* floor(963/2) + 74/2 = 481 + 37 = 518 */ top: 310px; cursor: pointer; }

.disabled { 

       visibility: hidden;

}

/* position and dimensions of the navigator */ .navi { 

   left: -56px;
   margin-left: 50%;
   position: absolute;
   top: 505px;
   width: 112px;

}

.navi a { width: 8px; height: 8px; float: left; margin: 3px; background: url(DTU-Denmark2011-slider-navigator-red.png) 0 0 no-repeat; /*background: url(DTU-Denmark2011-slider-navigator-dark.png) 0 0 no-repeat;*/ display: block; font-size: 1px; }

.navi a:hover { background-position: 0 -8px; }

.navi a.active { background-position: 0 -16px; }

Retrieved from "http://2011.igem.org/Team:Grenoble/Design/css0"