|
|
| (28 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| | + | {{CSS/Team:Glasgow/Draft1}} |
| | + | |
| | <html> | | <html> |
| | <title>Bubble Test Page</title> | | <title>Bubble Test Page</title> |
| | <head><style type="text/css"> | | <head><style type="text/css"> |
| | | | |
| - | /* Removing iGEM header stuff */
| |
| | | | |
| - | body, html, #globalWrapper, #content {
| |
| - | background: transparent;
| |
| - | margin: 0;
| |
| - | padding: 0;
| |
| - | border: 0 none transparent;
| |
| - | font-size: 1em;
| |
| - | width: auto;
| |
| - | border-top: 1px solid transparent;
| |
| - | margin-top: -1px;
| |
| - | }
| |
| | | | |
| - | body {
| |
| - | width: auto;
| |
| - | margin: 0 auto;
| |
| - | position: relative;
| |
| - | }
| |
| - |
| |
| - | #top-section {
| |
| - | border: 0 none transparent;
| |
| - | margin: 0;
| |
| - | padding: 0;
| |
| - | width: auto;
| |
| - | height: 1.5em;
| |
| - | margin-bottom: -1.5em;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | #top-section:hover #menubar * {
| |
| - | color: blue !important;
| |
| - | }
| |
| - |
| |
| - | #top-section:hover #menubar.left-menu {
| |
| - | background: rgba(255, 255, 255, 0.75) !important;
| |
| - | }
| |
| - | #search-controls{
| |
| - | height: 0px;
| |
| - | display: none !important;
| |
| - | }
| |
| - |
| |
| - | #content>p:first-child {
| |
| - | margin: 0;
| |
| - | height: 0;
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - | .toc {
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - | .editsection {
| |
| - | display: none;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | #contentSub, #footer-box, #sitesub, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading, .visualClear {display: none;}
| |
| - |
| |
| - |
| |
| - | /*** To here ***/
| |
| - |
| |
| - |
| |
| - | #linksbar {position:absolute;
| |
| - | left:500px;
| |
| - | font-size:20px;
| |
| - | padding: 5px;
| |
| - | background-color:transparent;}
| |
| - |
| |
| - | .menuitems {border-right: 2px solid black;
| |
| - | padding:5px;
| |
| - | background-color:transparent;}
| |
| - |
| |
| - | #igemlogo {width:30px;
| |
| - | position:absolute;
| |
| - | top:30px;
| |
| - | left:1200px;}
| |
| - |
| |
| - | .menulinks:link {text-decoration:none;
| |
| - | color:Black;}
| |
| - | .menulinks:visited {text-decoration:none;
| |
| - | color:Black}
| |
| - | .menulinks:hover {text-decoration:none;
| |
| - | color:red;}
| |
| - |
| |
| - | body {background:url("https://static.igem.org/mediawiki/2014/thumb/5/54/GU_newbubblebackground.jpg/800px-GU_newbubblebackground.jpg") no-repeat center center fixed;
| |
| - | -webkit-background-size: cover;
| |
| - | -moz-background-size: cover;
| |
| - | -o-background-size: cover;
| |
| - | background-size: cover;;
| |
| - | }
| |
| | | | |
| | /*Makes increase/decrease in size smooth*/ | | /*Makes increase/decrease in size smooth*/ |
| Line 104: |
Line 18: |
| | } | | } |
| | | | |
| | + | #bubbles {background:none; |
| | + | } |
| | + | |
| | + | #bubbletable {background:none; |
| | + | } |
| | | | |
| - | #bubbleproject { | + | #bubbleproject {width:200px; |
| - | display:block;
| + | height:200px; |
| - | margin-left:auto;
| + | |
| - | margin-right:auto;
| + | |
| - | margin-top:400px;
| + | |
| | | | |
| | } | | } |
| | | | |
| - | | + | |
| - |
| + | #bubbleteam {width:200px; |
| - | #bubbleteam {positioning:absolute: | + | height:200px; |
| - | top:400px;
| + | } |
| - | left:20%;}
| + | |
| | | | |
| - | #bubblemodelling {positioning:absolute: | + | #bubblemodelling {width:200px; |
| - | top:400px;
| + | height:200px; |
| - | left:30%;}
| + | } |
| | | | |
| - | #bubblehumanpractices {positioning:absolute: | + | #bubblehumanpractices {width:200px; |
| - | top:400px;
| + | height:200px; |
| - | right:20%;}
| + | } |
| | | | |
| - | #bubbleparts {positioning:absolute: | + | #bubbleparts {width:200px; |
| - | top:400px;
| + | height:200px; |
| - | lright:30%;}
| + | } |
| | | | |
| - | #projectdes {margin-left:20%; | + | #projectdes {text-align:center; |
| - | margin-right:20%; | + | margin-left:15%; |
| - | margin-top:15%; | + | margin-right:15%; |
| | + | margin-top:5px; |
| | border: solid 3px black; | | border: solid 3px black; |
| | padding:20px; | | padding:20px; |
| | border-radius:20px; | | border-radius:20px; |
| - | background-color:#66FFFF; | + | background-color:#FFFFFF; |
| - | }
| + | |
| | | | |
| - | | + | .description {font-family:"Calibri"; |
| - | | + | color: #0000CC; |
| - | | + | text-align:center;} |
| - | /******** Start of menubar dropdown ********/
| + | |
| - | | + | |
| - | | + | |
| - | | + | |
| - | | + | |
| - | #menu{
| + | |
| - | padding: 0;
| + | |
| - | margin: 0 !important;
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - | background-color:#000000
| + | |
| - | background-image: -webkit-linear-gradient(#7B007B,#FF0033);
| + | |
| - | background-image: -moz-linear-gradient(#7B007B,#FF0033);
| + | |
| - | background-image: -ms-linear-gradient(#7B007B,#FF0033);
| + | |
| - | background-image: -o-linear-gradient(#7B007B,#FF0033);
| + | |
| - | background-image: linear-gradient(#7B007B,#FF0033);
| + | |
| - | background-image: linear-gradient(#7B007B, #FF0033 140%);
| + | |
| - | border-top: 3px solid #000037;
| + | |
| - | box-shadow: 0 4px 4px #000000;
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - | | + | |
| - | -webkit-hyphens: none;
| + | |
| - | -moz-hyphens: none;
| + | |
| - | -ms-hyphens: none;
| + | |
| - | -o-hyphens: none;
| + | |
| - | hyphens: none;
| + | |
| - | z-index: 50;
| + | |
| | } | | } |
| | | | |
| - | #menu { display:block;
| |
| - | margin-left:auto;
| |
| - | margin-right:auto;
| |
| - | position:absolute;
| |
| - | top:200px;
| |
| - | left:12%; <!-- Positioning of Menubar -->
| |
| - | background-color:transparent;
| |
| - | font-size:18px;
| |
| - | font-family:Arial, Helvetica, Sans-serif;
| |
| - | text-align: center;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | .menuitems {border-right: 2px solid black;
| |
| - | line-height:2ch;
| |
| - | padding:0px;
| |
| - | background-color:transparent;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | .menulinks:link {text-decoration:none;
| |
| - | color:black;}
| |
| - | .menulinks:visited {text-decoration:none;
| |
| - | color:black}
| |
| - | .menulinks:hover {text-decoration:none;}
| |
| | | | |
| - |
| |
| - |
| |
| - | #menu ul {position:absolute;
| |
| - | max-height:0em; <!-- Needs to be here for some reason!? (To make dds hidden) -->
| |
| - | left:0px;
| |
| - | top: 0em;
| |
| - | top: 43px; <!-- positioning of dd list/box, from top of menu li -->
| |
| - | margin:0 !important;
| |
| - | padding:0;
| |
| - | overflow:hidden;
| |
| - | transition: 0.5s max-height 0.3s;
| |
| - | background-color:transparent;
| |
| - | background-image: linear-gradient(rgba(50, 50, 150, 0.5), rgba(50, 50, 150, 0.5)); <!--Darkish blue -->
| |
| - | test-align:center;<!-- Maybe remove previous positioning for this -->
| |
| - | font-size:0;
| |
| - | }
| |
| - |
| |
| - |
| |
| - |
| |
| - | #menu li {
| |
| - | display:inline-block;
| |
| - | list-style: none; /* for IE7 */
| |
| - | margin: 0 0 0 0;
| |
| - | padding-bottom: 0.3%;
| |
| - | <!-- height:100%; <--- Trying to get lines to be full height of list items -->
| |
| - | }
| |
| - |
| |
| - | #menu > li {
| |
| - | width:100px; <!-- Width of each li in menu bar -->
| |
| - | }
| |
| - |
| |
| - | #menu > li, #menu > li li {
| |
| - | position: relative;
| |
| - | left:0;
| |
| - | display:inline-block;
| |
| - | padding: auto;
| |
| - | background-color: transparent;
| |
| - | }
| |
| - |
| |
| - | #menu > li li {
| |
| - | width: 100%;
| |
| - | padding: 3% 0; <!-- Padding of dd list: top sides -->
| |
| - | }
| |
| - |
| |
| - | #menu a {
| |
| - | display:inline-block;
| |
| - | margin: auto;
| |
| - | color: #66FFFF; <!-- Font colour of menubar -->
| |
| - | text-decoration:none;
| |
| - | width: 100%;
| |
| - | }
| |
| - |
| |
| - | <!-- For images in menu -->
| |
| - | #menu a span{
| |
| - | display: block;
| |
| - | margin: auto;
| |
| - | width: 50%;
| |
| - | }
| |
| - |
| |
| - | #menu > li li { background: transparent none; }
| |
| - |
| |
| - | #menu > li li a { color: #66FFFF; } <!-- Colour of text in dropdown box -->
| |
| - |
| |
| - | #menu > li li:hover a { color: #66FFFF; <!-- Colour of text in dropdown box hover-->
| |
| - | }
| |
| - |
| |
| - | #menu > li li:hover {
| |
| - | background:transparent; <!-- Background of dd box -->
| |
| - | }
| |
| - |
| |
| - | #menu > li:first-child {
| |
| - | border-left: 2px solid #000000;
| |
| - | }
| |
| - |
| |
| - | #menu > li li:first-child {
| |
| - | border-bottom: 1px solid #000000; <!-- border of dropdown lists -->
| |
| - | }
| |
| - |
| |
| - | #menu > li li + li{
| |
| - | border-top: 1px solid #000000;
| |
| - | border-bottom: 1px solid #000000; <!-- Border for DD items -->
| |
| - | }
| |
| - |
| |
| - | #menu > li li:last-child {
| |
| - | border-top: 1px solid #000000;
| |
| - | border-bottom: 2px solid #000000;
| |
| - | }
| |
| - |
| |
| - |
| |
| - | #menu > li:hover {
| |
| - | background-color: rgba(50, 50, 150, 0.5); <!-- Hover over menu bg color -->
| |
| - | }
| |
| - |
| |
| - | #menu > li:hover ul {
| |
| - | max-height:20em; <!-- max length of color box -->
| |
| - | }
| |
| - |
| |
| - |
| |
| - | /******** End of Dropdown *********/
| |
| - |
| |
| - |
| |
| - |
| |
| | </style></head> | | </style></head> |
| | | | |
| | | | |
| | <body> | | <body> |
| | + | <br> |
| | + | <div id="bubbles"> |
| | | | |
| - | <!-- menubar (left) | + | <table id="bubbletable" align="center"> |
| | | | |
| - | <div id="menubar" class='left-menu noprint'> | + | <tr> |
| - | <ul>
| + | < td align= "center"><a href=" https:// 2014.igem.org/ Team:Glasgow/Parts" > |
| - | <li
| + | <img id="bubbleparts" src="https://static.igem.org/mediawiki/2014/7/70/GU_biobrickbubble.png"/> |
| - | class= 'selected' ><a href="/ Requirements">Page </ a></ li> | + | </a></td> |
| - | <li
| + | <td></td> |
| - | class='new' ><a href="/wiki/index.php?title=Talk:Requirements&action=edit&redlink=1">Discussion </a></li>
| + | <td align="center"><a href=" https:// 2014. igem.org/ Team:Glasgow/ Project" > |
| - | <li
| + | <img id="bubbleproject" src="https://static.igem.org/mediawiki/2014/d/d4/GU_projectbubble.png"/> |
| - | ><a href="/ wiki/ index. php?title=Requirements&action=edit">Edit </ a></ li> | + | </a></td> |
| - | <li
| + | <td></td> |
| - | ><a href="/wiki/index.php?title=Requirements&action=history">History </a></li>
| + | <td align="center"><a href=" https://2014.igem.org/ Team: Glasgow/ Human_Practices" > |
| - | <li
| + | <img id="bubblehumanpractices" src="https://static.igem.org/mediawiki/2014/3/3c/GU_humanpracticesbubble.png"/> |
| - | ><a href="/ Special: MovePage/ Requirements" >Move </a></li> | + | </a></td> |
| - | <li
| + | |
| - | ><a href="/wiki/index.php?title=Requirements&action=watch">Watch </a></li>
| + | |
| - | </ul>
| + | |
| - | </div> end menubar (left) -->
| + | |
| | | | |
| | + | </tr> |
| | | | |
| | | | |
| | + | <tr> |
| | + | <td></td> |
| | + | <td align="center"><a href="https://2014.igem.org/Team:Glasgow/Modeling_Intro" > |
| | + | <img id="bubblemodelling" src="https://static.igem.org/mediawiki/2014/4/47/GU_modellingbubble.png"/> |
| | + | </a></td> |
| | + | <td></td> |
| | + | <td align="center"><a href="https://2014.igem.org/Team:Glasgow/Team" > |
| | + | <img id="bubbleteam" src="https://static.igem.org/mediawiki/2014/e/e3/GU_teambubble.png"/> |
| | + | </a></td> |
| | + | <td></td> |
| | + | </tr> |
| | | | |
| | + | </table> |
| | | | |
| - | <div>
| |
| - | <img src="https://static.igem.org/mediawiki/2014/c/c0/GU_mainheader.png"/>
| |
| - |
| |
| - |
| |
| - | <ul id="menu">
| |
| - | <li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow" class="menulinks"> <br> Home <br> </a> </li><!--
| |
| - | --><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Team" class="menulinks"> <br> Team </a> </li><!--
| |
| - | --><li class="menuitems"><a href="https://igem.org/Team.cgi?year=2014&team_name=Glasgow" class="menulinks"> Team <br> Profile </a></li><!--
| |
| - | --><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Project" class="menulinks"> <br> Project</a></li><!--
| |
| - | --><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Parts" class="menulinks"> <br> BioBricks</a></li><!--
| |
| - | --><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Modeling" class="menulinks"> <br> Modelling</a></li><!--
| |
| - |
| |
| - | --><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Weekly_Report" class="menulinks">Weekly Report</a>
| |
| - |
| |
| - | <ul>
| |
| - | <li class="menuitems"><a href="#">Week 1</a></li>
| |
| - | <li class="menuitems"><a href="#">Week 2</a></li>
| |
| - | <li class="menuitems"><a href="#">Week 3</a></li>
| |
| - | </ul>
| |
| - |
| |
| - |
| |
| - |
| |
| - | </li><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Safety" class="menulinks"> <br> Safety </a>
| |
| - | </li><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Human_Practices" class="menulinks">Human Practices</a>
| |
| - | </li><li class="menuitems"><a href="https://2014.igem.org/Team:Glasgow/Attributions" class="menulinks"> <br> Sponsors </a></li>
| |
| - |
| |
| - |
| |
| - |
| |
| - | </ul>
| |
| - |
| |
| - | <a href="https://2014.igem.org/Main_Page" target="_blank" id="igemlogo"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="150px"/></a>
| |
| | </div> | | </div> |
| - |
| |
| | <div id="projectdes"> | | <div id="projectdes"> |
| | <p align ="center"> | | <p align ="center"> |
| | | | |
| - | Glasgow's 2014 iGEM project involves the creation of a new and hopefully very useful tool for synthetic biologists. With the aid of a genetic switch we will create a system that, in the presence of a given stimulus, will switch between one gene and another – a change that will persist in subsequent generations unless reversed.
| + | <h2 color="#0000CC" class="description"> This year, we're switching on the power and potential of <em>E.coli</e></h2> |
| - | The switch is thus an integral part of the project. It is a site specific recombinase switch (φC31 integrase) isolated from the Streptomyces phage φC31. It flips a section of DNA, and a promoter, in order to turn off the expression of one gene section in favour of another.
| + | <h2 class="description"> Click a bubble to find out more...</h2> |
| - | <br> | + | |
| - | <br> | + | |
| - | For a bit more information, see the Project page , accessible from <a href="https://2014.igem.org/Team:Glasgow/Project"> here</a>, the menu bar, or the bubbles below | + | |
| - | | + | |
| | </p> | | </p> |
| | | | |
| | </div> | | </div> |
| | | | |
| - | | + | <a href="https://2014.igem.org/wiki/index.php?title=Team:Glasgow&action=edit" >Edit</a> |
| - | <div id="bubbles">
| + | |
| - | <a href="https://2014.igem.org/Team:Glasgow/Project" class="center">
| + | |
| - | <img id="bubbleproject" src="https://static.igem.org/mediawiki/2014/1/1d/GU_projectbubble_big.png"/>
| + | |
| - | </a>
| + | |
| - | | + | |
| - | <a href="https://2014.igem.org/Team:Glasgow/Parts" >
| + | |
| - | <img id="bubbleparts" src="https://static.igem.org/mediawiki/2014/7/70/GU_biobrickbubble.png"/>
| + | |
| - | </a>
| + | |
| - | | + | |
| - | <a href="https://2014.igem.org/Team:Glasgow/Modeling" >
| + | |
| - | <img id="bubblemodelling" src="https://static.igem.org/mediawiki/2014/4/47/GU_modellingbubble.png"/>
| + | |
| - | </a>
| + | |
| - | | + | |
| - | <!--<a href="https://2014.igem.org/Team:Glasgow/Weekly_Report" >
| + | |
| - | <img id="bubblereport" src="https://static.igem.org/mediawiki/2014/3/3c/GU_reportbubble.png"/>
| + | |
| - | </a>-->
| + | |
| - | | + | |
| - | <a href="https://2014.igem.org/Team:Glasgow/Team" >
| + | |
| - | <img id="bubbleteam" src="https://static.igem.org/mediawiki/2014/e/e3/GU_teambubble.png"/>
| + | |
| - | </a>
| + | |
| - | | + | |
| - | | + | |
| - | <a href="https://2014.igem.org/Team:Glasgow/Human_Practices" >
| + | |
| - | <img id="bubblehumanpractices" src="https://static.igem.org/mediawiki/2014/3/3c/GU_humanpracticesbubble.png"/>
| + | |
| - | </a>
| + | |
| - | | + | |
| - | </div>
| + | |
| - | | + | |
| - | <a href="https://2014.igem.org/wiki/index.php?title=Team:Glasgow&action=edit" >Click to edit this page</a> | + | |
| - | | + | |
| - | | + | |
| - | <br><br><br><br><br><br>
| + | |
| - | <br><br><br><br><br><br>
| + | |
| - | <br><br><br><br><br><br>
| + | |
| | | | |
| | | | |
"
