Difference between revisions of "Template:Team:Paris Saclay/css"

m
 
(67 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
<html>
+
<html><style type="text/css">
−
<head>  <!-- Bootstrap -->
+
body{background: url(http://www.igem-paris-saclay.u-psud.fr/wordpress/wp-content/uploads/2015/03/bg.gif);margin:0;font-size:11pt;line-height:18pt;position: relative;overflow-y: scroll;}
−
    <link href="https://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
+
#globalWrapper{font-size: 100%;padding:0;}
−
 
+
#content{padding: 0px;border: 0px none;max-width: 100vw;margin: 18px auto;width:100%; color:black;line-height: 18pt;margin-bottom: 0;}
−
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
+
−
<script src="js/jquery.matchHeight.js"></script>
+
−
<!-- Include all compiled plugins (below), or include individual files as needed -->
+
−
<script src="https://getbootstrap.com/dist/js/bootstrap.min.js"></script></head>
+
−
<style type="text/css">
+
−
@import url(https://fonts.googleapis.com/css?family=Roboto:300,700,300italic);
+
−
body{background: #7fadbc url(http://www.igem-paris-saclay.u-psud.fr/wordpress/wp-content/uploads/2015/03/bg.gif); font-family: 'Roboto', 'Helvetica', sans-serif;margin:0;font-size:12pt;line-height:18pt;position: relative;overflow-y: scroll;}
+
−
globalWraper{font-size: 100%;}
+
−
#content{padding: 0px;border: 0px none;max-width: 100vw;margin: 18px auto;width:100%;;color:black;line-height: 18pt;margin-bottom: 0;}
+
−
<!--background: initial-->
+
 
#bodyContent{background-size: 100%;width: 100%;}
 
#bodyContent{background-size: 100%;width: 100%;}
−
.container{padding-left: 10%;padding-right: 10%;overflow-y: hidden;overflow-x: hidden;}
+
#bodyContent p, #bodyContent table {font-size: 11pt;}
 +
.container{padding-left: 5%;padding-right: 10%;overflow-y: hidden;overflow-x: hidden;}
 
.container.header, .container.submenu {position: fixed;width: 80%;}
 
.container.header, .container.submenu {position: fixed;width: 80%;}
 
.container.header {background: #7fadbc; border-top: 17px solid #aac451; top: 18px; z-index: 100; overflow: initial;}
 
.container.header {background: #7fadbc; border-top: 17px solid #aac451; top: 18px; z-index: 100; overflow: initial;}
 
.container.header nav {margin: 0;font-weight: bold;color:white;}
 
.container.header nav {margin: 0;font-weight: bold;color:white;}
 
.container.submenu{background: #27343c;top:70px;z-index: 100;}
 
.container.submenu{background: #27343c;top:70px;z-index: 100;}
−
.container.content {margin-top:120px;background: rgba(255, 255, 255, 0.3);margin-bottom: 40px;padding-bottom: 20px;padding-top: 20px;}
+
.container.content {background: rgba(255, 255, 255, 0.3);margin-bottom: 40px;padding-bottom: 20px;padding-top: 20px;}
 
.footer {position: relative;top: 16px;max-width: 100vw;border-top: 17px solid #731259;background: grey;text-shadow: -1px -1px 0px #3b5057;line-height: 18px;color: #EBEBDF;padding-top: 24px;padding-bottom: 24px;}
 
.footer {position: relative;top: 16px;max-width: 100vw;border-top: 17px solid #731259;background: grey;text-shadow: -1px -1px 0px #3b5057;line-height: 18px;color: #EBEBDF;padding-top: 24px;padding-bottom: 24px;}
 
.footer small.contact {float:left;}
 
.footer small.contact {float:left;}
−
.footer small.contact b {margin-right:5px; color:#aac451;}
+
.footer small.contact b {margin-right:5px; color:#731259;}
 
.footer small.contact a {font-weight:normal; color: inherit;}
 
.footer small.contact a {font-weight:normal; color: inherit;}
 
.footer small.copyright {margin-right: 20px;margin-top: 55px;font-style: italic;}
 
.footer small.copyright {margin-right: 20px;margin-top: 55px;font-style: italic;}
−
.container.submenu nav {margin: 2px 0; font-size: 11pt;}
 
−
.container.submenu nav ul li a {margin: 0px 20px 0px 0px; font-weight:normal; font-family:'Tahoma', 'Roboto', 'Helvetica', sans-serif}
 
−
.container nav ul {zoom: 1; vertical-align: middle; left: 0; top: 0; visibility: visible; position: relative; list-style: none; margin: 0; padding: 0;}
 
−
.container nav ul li {margin: 0;display: inline-block;display: -webkit-inline-box;}
 
−
.container nav ul li a {display: block;height: 20px;border: none;color:white; text-decoration: none;}
 
−
.container nav ul li:last-child a {margin-right:0;}
 
−
.container nav ul li a:hover {color:#aac451;text-decoration: none;}
 
−
.container nav ul li:hover ul, .container nav ul li ul:hover {display: block;}
 
−
.container nav ul li ul {display: none; position: absolute; background: rgba(86, 121, 113, .66); top: 48px; min-width: 140px; z-index: 9997;}
 
 
.container p {text-align: justify;}
 
.container p {text-align: justify;}
−
.row {width: 100%;min-width: 996px;margin: 0 auto;overflow: hidden;}
+
.row {overflow: hidden;}
−
 
+
.highlight{color:purple}
 +
#main > ul { margin-top: 0 !important; margin-bottom: 10px !important;}
  
 +
#toc h1 {font-size: 14pt;}
 
#toc ul>li>a {display: block;padding: 4px 20px;font-size: 13px;font-weight: 500;color: #767676;text-decoration:none;}
 
#toc ul>li>a {display: block;padding: 4px 20px;font-size: 13px;font-weight: 500;color: #767676;text-decoration:none;}
 
#toc ul ul>li>a {padding-top: 1px;padding-bottom: 1px;padding-left: 30px;font-size: 13px;font-weight: 400}
 
#toc ul ul>li>a {padding-top: 1px;padding-bottom: 1px;padding-left: 30px;font-size: 13px;font-weight: 400}
Line 48: Line 32:
  
 
/* SUB-MENU */
 
/* SUB-MENU */
−
.affix {position:fixed; width: 19%; top:95px;}
+
div#toc.toc.affix {position:fixed; width: 19%; top:60px;}
−
.affix-bottom {position:relative;}
+
div#toc.toc.affix-bottom {position:relative;}
  
 
#compl {float: left; width: 25%;}
 
#compl {float: left; width: 25%;}
Line 65: Line 49:
 
#cal-heatmap g:hover .subdomain-text {opacity: 1;}
 
#cal-heatmap g:hover .subdomain-text {opacity: 1;}
  
−
.container nav li.before a { color:#fff; }
+
a.external.text, a.external.text:visited, a[href ^="https://"] {background: initial;padding: initial;}
−
.container nav li.active a { color:#d9374c; }
+
−
/*a, a:visited {color:#d9374c; font-weight:bold;}*/
+
−
a.external.text, a.external.text:visited {color:#d9374c; background:none; padding:0;}
+
−
.fixedmenups {z-index: 9998;position: fixed;width: 19%;top: 95px;}
+
  
 
article.column {width: 49%; float: left;}
 
article.column {width: 49%; float: left;}
Line 77: Line 57:
 
.photoprofil{float:left;width: 116px;margin-right: 10px;}
 
.photoprofil{float:left;width: 116px;margin-right: 10px;}
  
−
h1, h2, h3, h4, h5, h6 {padding: 4px 5px; color:black;clear:both; font-variant: small-caps; font-weight: normal; border:0;}
+
h1, h2, h3, h4, h5, h6 {color:purple; clear:both; font-variant: small-caps; font-weight: normal; border:0; padding: 0; margin:0;}
 +
h1 {text-align: center; margin-top: 1em;}
 +
h2 {padding-left: 1em; margin-top: .7em;}
 +
h3 {padding-left: 2em; margin-top: .5em;}
 +
h4 {padding-left: 1em;}
 
h4, h5, h6 {background: initial; font-weight: bold;}
 
h4, h5, h6 {background: initial; font-weight: bold;}
−
h4 {padding-left: 2em; margin-top: 1em;}
 
 
h5 {padding-left: 4em;}
 
h5 {padding-left: 4em;}
 
h6 {padding-left: 6em;}
 
h6 {padding-left: 6em;}
 
hr {clear:both; border:0; margin:0;background: none;}
 
hr {clear:both; border:0; margin:0;background: none;}
 +
 +
a.image > img {margin: 20px;}
 +
a.image > img.thumbimage {margin: 0;}
  
 
.anchor {display: block; height: 100px; margin-top: -100px; visibility: hidden;}
 
.anchor {display: block; height: 100px; margin-top: -100px; visibility: hidden;}
Line 88: Line 74:
 
div.tright{float:left; border-width:0;}
 
div.tright{float:left; border-width:0;}
 
.buorg {top:17px;}
 
.buorg {top:17px;}
−
#bodyContent a[href ^="https://"] {background: initial;padding: initial;}
 
 
div#bars_item, div#user_item.has_submenu{line-height:initial;}
 
div#bars_item, div#user_item.has_submenu{line-height:initial;}
−
#globalWrapper {font-size:100%;padding:0;}
 
 
h1.firstHeading, a#top, #top_title, #sideMenu, #top_menu_under {display: none;}
 
h1.firstHeading, a#top, #top_title, #sideMenu, #top_menu_under {display: none;}
−
 
+
.logo-igem{
−
#content{
+
display: block;
−
margin: 16px auto;
+
    margin: 20px auto;
 +
    text-align: center;
 
}
 
}
−
header {
+
.adress {
−
  background: url("http://maximeschaffhauser.com/igem/img-igem.jpeg");
+
display: flex;
−
  background-size: cover;
+
    flex-wrap: wrap;
−
  background-position: left;
+
    justify-content: space-between;}
−
  background-attachment: fixed;
+
.adress a{
−
  height: 100vh;
+
color: white}
−
  min-height: 1000px; }
+
.adress a:hover{
−
  header ul.nav {
+
color: #f379c6}
−
    float: none; }
+
 
  
−
body {
 
−
  min-height: 100vh; }
 
  
−
.navbar-inverse {
 
−
max-width: 100vw;
 
−
  z-index: 10000;
 
−
  background-color: transparent;
 
−
  border-color: transparent;
 
−
}
 
−
.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{
 
−
margin: 0;
 
−
}
 
−
  .navbar-inverse .navbar-nav {
 
−
    width: 100%;
 
−
    text-align: center;
 
−
}
 
−
    .navbar-inverse .navbar-nav li {
 
−
      float: none;
 
−
      display: inline-block;
 
−
      margin: 3px;
 
−
      border-radius: 5px;
 
−
      background-color: #9e63af;
 
−
padding: 0 0;
 
−
}
 
−
      .navbar-inverse .navbar-nav li a {
 
−
        color: white;
 
−
        font-weight: 700;
 
−
height:100%;
 
−
}
 
−
      .navbar-inverse .navbar-nav li:hover {
 
−
        border-color: #ff90a3;
 
−
        background-color: rgba(32, 121, 117, 0.5);
 
−
        transition: all .5s linear;
 
−
}
 
−
        .navbar-inverse .navbar-nav li:hover a {
 
−
          color: white;
 
−
}
 
  
−
.affix {
 
−
  width: 100%;
 
−
  text-align: center;
 
−
  left: 0;
 
−
top: 15px;
 
−
}
 
−
  .affix .container-fluid {
 
−
    background-color: white;
 
−
    transition: all 1s linear; }
 
−
  .affix .navbar-nav li {
 
−
    background-color: #5a0e46;
 
−
    transition: all 1s linear; }
 
  
−
.affix-top {
 
−
  margin-top: 300px; }
 
  
−
.logo-head {
 
−
  position: absolute;
 
−
  height: 280px;
 
−
  top: 20px;
 
−
  left: 0;
 
−
  right: 0;
 
−
  margin-left: auto;
 
−
  margin-right: auto;
 
−
}
 
−
.container.footer{
 
−
position:relative;
 
−
bottom:-10px;}
 
−
footer .footerlogo {
 
−
  max-width: 100%;
 
−
  max-height: 240px;
 
−
  display: inline-flex;
 
−
  align-items: center;
 
−
  justify-content: space-between;
 
−
  flex-wrap: wrap;
 
−
}
 
−
footer .footerlogo img {
 
−
    padding: 20px;
 
−
    max-width: 100%;
 
−
    max-height: 240px;
 
−
    margin-right: auto;
 
−
    margin-left: auto;
 
−
    filter: grayscale(100%);
 
−
    -webkit-filter: grayscale(100%);
 
−
    -moz-filter: grayscale(100%);
 
−
    -ms-filter: grayscale(100%);
 
−
    -o-filter: grayscale(100%);
 
−
    transition: all .3s linear;
 
−
}
 
−
    footer .footerlogo img:hover {
 
−
      filter: grayscale(0);
 
−
      -webkit-filter: grayscale(0);
 
−
      -moz-filter: grayscale(0);
 
−
      -ms-filter: grayscale(0);
 
−
      -o-filter: grayscale(0);
 
−
      transition: all .3s linear;
 
−
      padding: 10px;
 
−
}
 
  
−
.row-centered {
+
header { min-height: 400px;position: relative;    top: -7px;background: url("https://static.igem.org/mediawiki/2016/3/3f/T--Paris_Saclay--background_paris.jpeg"); background-size: cover; background-position: left; background-attachment: fixed;}
−
  text-align: center;  
+
header.model {background-url: "https://static.igem.org/mediawiki/2016/c/cb/T--Paris_Saclay--090816_Titre.jpg"; }
 +
 
 +
header ul.nav { float: none; }
 +
 
 +
body { overflow-x: hidden; min-height: 100vh; }
 +
 
 +
nav.navbar-inverse {border:0; background: transparent}
 +
.navbar-inverse { max-width: 100vw; z-index: 10000; background-color: transparent; border-color: transparent; }
 +
.navbar-inverse .navbar-nav { width: 100%; text-align: center; }
 +
.navbar-inverse .navbar-nav li { float: none; display: inline-block; margin: 3px; border-radius: 5px; padding: 0 0; background-color: purple; }
 +
.navbar-inverse .navbar-nav li a { color: white; font-weight: 700; padding-top: 7px; padding-bottom: 7px }
 +
.navbar-inverse .navbar-nav ul{ margin: 0; }
 +
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{ border-radius: 5px; background-color: #9e63af; }
 +
.navbar-inverse .navbar-toggle .icon-bar { background-color: #5a0e46; }
 +
.navbar-inverse .navbar-toggle{border-color:#ad288a;background-color:white}
 +
.navbar-inverse .navbar-toggle:hover .icon-bar{background-color:black}
 +
.dropdown-menu{ min-width: 50px; }
 +
.dropdown-menu>li{ width:96%; }
 +
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus, .navbar-inverse .navbar-nav>li>a:hover { border-color: #ff90a3; background-color: MediumVioletRed; transition: background .5s linear; border-radius:5px; }
 +
 
 +
nav.navbar.navbar-default.navbar-inverse.affix { width: 100%; text-align: center; left: 0; top: 15px; }
 +
nav.navbar.navbar-default.navbar-inverse.affix .container-fluid { background-color: white; transition: all .5s linear; }
 +
nav.navbar.navbar-default.navbar-inverse.affix .navbar-nav li { transition: all 1s linear; }
 +
nav.navbar.navbar-default.navbar-inverse.affix-top { margin-top: 300px; }
 +
 
 +
 
 +
.logo-head { position: absolute; height: 280px; top: 20px; left: 0; right: 0; margin-left: auto; margin-right: auto; }
 +
.container.footer{ position:relative; bottom:-10px;}
 +
footer .footerlogo { max-width: 100%; max-height: 240px; display: inline-flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
 +
footer .footerlogo img { padding: 20px; max-width: 100%; max-height: 240px; margin-right: auto; margin-left: auto; filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); transition: all .3s linear;  }
 +
footer .footerlogo img:hover { filter: grayscale(0); -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); transition: all .3s linear; padding: 10px; }
 +
.row-centered { text-align: center; }
 +
.col-centered { display: inline-block; float: none; text-align: left; margin-right: -4px; }
 +
.love{ position: absolute; width: 100%; top: 420px; background: rgba(193,193,193,0.3); color: white; text-align: center; }
 +
#bodyContent .love p {font-size: 56pt; text-align:center;}
 +
 
 +
.collapse.navbar-collapse,.nav-container { padding-right:0; padding-left:0; }
 +
 
 +
@media (max-width: 767px){
 +
.navbar-inverse .navbar-nav li { display:block; }
 +
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a{color:white;}
 +
.collapse.navbar-collapse { background:white }
 +
.navbar-inverse .navbar-nav {width: 94%; text-align: center; margin: 0 3%; }
 
}
 
}
  
−
.col-centered {
 
−
  display: inline-block;
 
−
  float: none;
 
−
  /* reset the text-align */
 
−
  text-align: left;
 
−
  /* inline-block space fix */
 
−
  margin-right: -4px; }
 
−
h1{text-align:center;}
 
 
</style></html>
 
</style></html>

Latest revision as of 11:06, 14 October 2016