Difference between revisions of "Template:Macquarie Australia/TestCSS"

(testing hyperlink1)
(Add new class with center text)
 
(75 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
{{Macquarie_Australia/TestCSS}}
+
[[File:MqAust_Burpey_v46-bubblePetri44_Summary03.png|965px|link=]]
 
<html lang="en-AU">
 
<html lang="en-AU">
−
<title>Tanya Test</title>
+
<style type="text/css">
−
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+
  
−
<!-- html top nav menu start -->
+
/* HIDE WIKI MARKUP */
−
<table class="mainmenu" width="100%" cellspacing="0">
+
−
<tr height="2px"><td></td></tr>
+
−
<tr><td></td>
+
−
<td width="980px" align="left" bgColor="#ffffff" cellspacing="0" cellpadding="2px">
+
−
<table width="100%" align="center"></td>
+
−
</tr>
+
−
<tr height="30px"> <!-- #66cc66 light green; #009933 dark green -->
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia">Home</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/ProjectOverview">Project</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/Modeling">Modelling</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/Parts">Parts</a></td>
+
−
<td class="menuHighlight" align="center" onMouseOver="this.bgColor='#009933'" onMouseOut="this.bgColor='#009933'" bgColor=#009933>
+
−
<a class="menuHighlight" href="https://2015.igem.org/Team:Macquarie_Australia/Practices">Human Practices</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/Team">Team</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/Attributions">Attributions</a></td>
+
−
<td align="center" onMouseOver="this.bgColor='#ffffff'" onMouseOut="this.bgColor='#66cc66'" bgColor=#66cc66>
+
−
<a href="https://2015.igem.org/Team:Macquarie_Australia/Sitemap">Sitemap</a></td>
+
−
</tr>
+
−
</table>
+
−
<!-- end of html top nav menu -->
+
  
−
<body id="TanyaTest">
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear { /*-- hides default wiki settings --*/
 +
display: none;
 +
}
  
−
<div class="contentContainer">
+
#content { /* Removes the standard wiki black border */
 +
border:none;
 +
/* padding: 0px 0px 0px 0px; */
 +
}
  
−
<h2>Blah1</h2>
+
/* PAGE LAYOUT */
−
<p>Blah blah blah1</p>
+
−
<img src="https://static.igem.org/mediawiki/2015/c/cc/Team_Macquarie_Australia_shakeubator.jpg" width="200px" alt="Photo of Shakeubator">
+
  
−
<h2>Blah2</h2>
+
body { /* Holds page background formatting */
−
<p>Blah blah blah2</p>
+
background-image: url("https://static.igem.org/mediawiki/2015/6/62/MqAust_ChlamyOneLine.png");
−
<img src="https://static.igem.org/mediawiki/2015/7/70/Team_Macquarie_Australia_PcrProductsQuickerCycle020715.jpg" width="300px" alt="Gel image PCR Products 2 July 2015">
+
/* background: linear-gradient(#7ec700, #43733e); */ /* mq harmony light green to dark green commented out */
 +
/* background-color: #009933; middle harmony websafe green plain colour background */
 +
background-color: #ccffcc; /* pale websafe green background */
 +
}
  
−
<h2>Blah3</h2>
+
#navigation a { /* top menu style */
−
<p>Blah blah blah3</p>
+
display:block; /* leave this block to keep the nav the same */
−
<p>put image here</p>
+
float: left; /* has to be left for nav to work */
 +
font-size: medium;
 +
padding: 1.56em;
 +
font-family: Verdana, Geneva, sans-serif;
 +
background-color: #66cc66; /* light green */
 +
color: #000000; /* #000000 is black font */
 +
}
  
−
<h4>Meet the Contestants</h4>
+
.mainContainer { /* Creates a container that wraps all of the content inside our wiki pages */
−
<figure class="specialInline"><img src="https://static.igem.org/mediawiki/2015/5/59/MqAust_1_BiobrickBen6.png" width="184px" alt="Biobrick Ben"><figcaption>Biobrick Ben</figcaption></figure>
+
width: 100%;
−
<figure class="specialInline"><img src="https://static.igem.org/mediawiki/2015/1/11/MqAust_2_JimmyGelRunner8.png" width="184px" alt="Jimmy Gel Runner"><figcaption>Jimmy Gel Runner</figcaption></figure>
+
overflow: hidden;
−
<figure class="specialInline"><img src="https://static.igem.org/mediawiki/2015/a/a1/MqAust_3_LaurenTheLabMonkey6.png" width="184px" alt="Lauren The Lab Monkey"><figcaption>Lauren The Lab Monkey</figcaption></figure>
+
float: center;
−
<figure class="specialInline"><img src="https://static.igem.org/mediawiki/2015/d/da/MqAust_4_PascalThePromoter4.png" width="184px" alt="Pascal The Promoter"><figcaption>Pascal The Promoter</figcaption></figure>
+
/* margin-left: 20px; */
−
<figure class="specialInline"><img src="https://static.igem.org/mediawiki/2015/f/fe/MqAust_5_SamTheSolution3.png" width="184px" alt="Sam The Solution"><figcaption>Sam The Solution</figcaption></figure>
+
/* background-color: #EEEDEA; */
 +
/* border-bottom: 6px solid #EE3e53; */
 +
}
  
−
<table width="60%" cellspacing="0">
+
.menuContainer { /* Creates the container for the menu */
−
<tr height="28px">
+
float: center;
−
<th align="center">Location</th>
+
width: 100%;
−
<th align="center">Local Time</th>
+
/* height: 35px; Comment: setting this affects the whole page*/
−
<th align="center">Time Zone</th>
+
/* background-color: #0e232f; */
−
<th align="center">UTC Offset</th>
+
padding: 0px;
−
</tr>
+
/* border-top: 6px solid #EE3e53; */
−
<tr height="26px">
+
}
−
<td align="center">Sydney (Australia - New South Wales)</td>
+
−
<td align="center">Sunday, 9 August 2015 at 11:00:00 AM</td>
+
−
<td align="center">AEST</td>
+
−
<td align="center">UTC+10 hours</td>
+
−
</tr>
+
−
<tr height="26px">
+
−
<td align="center">Boston (U.S.A. - Massachusetts)</td>
+
−
<td align="center">Saturday, 8 August 2015 at 9:00:00 PM</td>
+
−
<td align="center">EDT</td>
+
−
<td align="center">UTC-4 hours</td>
+
−
</tr>
+
−
<tr height="26px">
+
−
<td align="center">Corresponding UTC (GMT)</td>
+
−
<td align="center">Sunday, 9 August 2015 at 01:00:00</td>
+
−
<td align="center">-</td>
+
−
<td align="center">-</td>
+
−
</tr>
+
−
</table>
+
  
−
</div> <!-- contentContainer end -->
+
.mainmenu { /* Creates mainmenu class */
 +
/* width: 100%; */
 +
/* float: left; */
 +
/* margin: 0 0 1em 0; */
 +
padding: 0;
 +
/* background-color: #f2f2f2; */
 +
/* border-bottom: 1px solid #ccc; */
 +
border-collapse: collapse; /* Prevents a double line for both th td borders */
 +
border: 0px;
 +
/* no colours, borders, width, or float here */
 +
}
  
−
</body>
+
.menuHighlight { /* Creates highlight class */
 +
/* no styling required here so far */
 +
}
 +
 
 +
.contentContainer { /* Creates the container for the content - class */
 +
/* background-color: #EEEDEA; */
 +
width: 100%;
 +
float: left;
 +
padding: 4px;
 +
/* border-top: 6px solid #EE3e53; */
 +
}
 +
 
 +
.honyWhite { /* Creates unique HONY table class */
 +
border-collapse: collapse; /* Prevents a double line for both th td borders */
 +
width: 100%;
 +
text-align: left;
 +
}
 +
 
 +
.centreItInline { /* Horizontal positioning */
 +
display: block;
 +
margin-left: auto;
 +
margin-right: auto;
 +
}
 +
 
 +
.centreStuffInline { /* Horizontal positioning */
 +
text-align: center;
 +
}
 +
 
 +
.specialInline { /* Creates the container for inline content - class */
 +
display: inline-block;
 +
}
 +
 
 +
.regularInline { /* Creates the container for inline content - class */
 +
display: inline-block;
 +
}
 +
 
 +
.regularTable { /* Creates regular table class */
 +
border-collapse: collapse; /* Prevents a double line for both th td borders */
 +
width: 96%;
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader { /* Creates regular header class */
 +
/* no styling required here so far */
 +
}
 +
 
 +
.regularParagraph { /* Creates regular paragraph class */
 +
/* no styling required here so far */
 +
}
 +
 
 +
.regularHyperlink { /* Creates regular hyperlink class */
 +
/* no styling required here so far */
 +
}
 +
 
 +
/* VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */
 +
 
 +
/* Class MainMenu styling */
 +
 
 +
.mainmenu table { /* Styling of the menu table class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 16px;
 +
color: #ffffff;
 +
border: 0;
 +
border-spacing: 0;
 +
text-align: center;
 +
padding: 0;
 +
}
 +
 
 +
.mainmenu a { /* Styling of the menu table hyperlinks */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display:block; /* makes the table cells clickable */
 +
/* background-color: #66cc66; Comment: setting this colours a bar across the text green */
 +
color: #000000;
 +
}
 +
 
 +
#rcornersMain {
 +
border-radius: 40px 5px;
 +
background: #66cc66; /* #66cc66 light green */
 +
/* padding: 20px; */
 +
/* width: 200px; */
 +
/* height: 150px; */
 +
}
 +
 
 +
/* Class MenuHighlight styling */
 +
 
 +
.menuHighlight a { /* Styling of the menu table highlighted hyperlinks */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display:block; /* makes the table cells clickable */
 +
color: #ffffff; /* #ffffff is white */
 +
}
 +
 
 +
#rcornersHighlight {
 +
border-radius: 40px 5px;
 +
background: #009933; /* #009933 dark green */
 +
/* padding: 20px; */
 +
/* width: 200px; */
 +
/* height: 150px; */
 +
}
 +
 
 +
/* Class ContentContainer styling */
 +
 
 +
.contentContainer h1, h2, h3, h4, h5, h6 { /* Colour and font family */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000;
 +
border-bottom: none;
 +
font-weight: bold;
 +
/* text-transform: uppercase; */
 +
}
 +
 
 +
.contentContainer a { /*Style of the links */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display:inline; /* here to keep hyperlinks inline */
 +
font-weight: bold;
 +
color: #0645ad; /* hyperlink blue */
 +
text-decoration: underline;
 +
}
 +
 
 +
.contentContainer a:hover{ /* Styling links on hover */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #66cc66; /* websafe light green */
 +
}
 +
 
 +
/* Class honyWhite styling */
 +
 
 +
.honyWhite table { /* default table formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
table-layout: fixed; /* prevents auto-resizing of column widths */
 +
border-spacing: 10px 10px;
 +
}
 +
 
 +
.honyWhite th { /* default table header formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
border: 0px solid white;
 +
color: #000000; /*black*/
 +
font-size: 14px;
 +
padding: 8px;
 +
}
 +
 
 +
.honyWhite td { /* default table detail formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
border: 0px solid white;
 +
color: #000000; /*black*/
 +
font-size: 14px;
 +
padding: 8px;
 +
vertical-align: text-top;
 +
}
 +
 
 +
.honyCol40 { /* For fixed table Column width */
 +
width: 40%;
 +
}
 +
 
 +
.honyWhite a { /* default table detail formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display:inline; /* here to keep hyperlinks inline */
 +
font-weight: bold;
 +
color: #0645ad; /*hyperlink blue*/
 +
text-decoration: underline;
 +
}
 +
 
 +
/* Class SpecialInline styling */
 +
 
 +
figure.specialInline { /* Styling for figures in specialInline class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
margin-top: 1em;
 +
margin-bottom: 1em;
 +
margin-left: 0px;
 +
margin-right: 0px;
 +
}
 +
 
 +
figcaption.specialInline { /* Styling for figure captions - class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display: block; /* here to keep the caption underneath the figure */
 +
text-align: left;
 +
}
 +
 
 +
/* WRAPPED IMAGE Class styling */
 +
 
 +
figure.wrappedImage { /* Styling for figures in hony class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 14px;
 +
display: table; /* Required for text wrapping in caption */
 +
width: 450px; /* This can be any width, so long as it's narrower than any image */
 +
margin-top: 1em;
 +
margin-bottom: 1em;
 +
margin-left: 0px;
 +
margin-right: 0px;
 +
}
 +
 
 +
figcaption.wrappedImage { /* Styling for figure captions - class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 14px;
 +
/* display: block; here to keep the caption underneath the figure */
 +
text-align: left;
 +
display: table-row; /* Required for text wrapping in caption */
 +
}
 +
 
 +
img.wrappedImage { /* Styling for figure captions - class */
 +
float: left;
 +
}
 +
 
 +
/* TEXT IN COLUMNS Class styling */
 +
 
 +
.divideTextTwoColumns {
 +
/* Create multiple columns */
 +
-webkit-column-count: 2; /* Chrome, Safari, Opera */
 +
-moz-column-count: 2; /* Firefox */
 +
column-count: 2;
 +
/* Gap between columns */
 +
-webkit-column-gap: 40px; /* Chrome, Safari, Opera */
 +
-moz-column-gap: 40px; /* Firefox */
 +
column-gap: 40px;
 +
/* Line between columns */
 +
-webkit-column-rule: 1px dashed #009933; /* Chrome, Safari, Opera */
 +
-moz-column-rule: 1px dashed #009933; /* Firefox */
 +
column-rule: 1px dashed #009933;
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-size: 12px;
 +
}
 +
 
 +
/* REGULAR Class styling */
 +
 
 +
figure.regularInline { /* Styling for figures in regularInline class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
/* margin-top: 1em; removing this styling for now */
 +
/* margin-bottom: 1em; removing this styling for now */
 +
/* margin-left: 20px; Comment: adds a buffer I think */
 +
/* margin-right: 20px; Comment: adds a buffer */
 +
}
 +
 
 +
figcaption.regularInline { /* Styling for figure captions - class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display: block; /* here to keep the caption underneath the figure */
 +
text-align: center;
 +
}
 +
 
 +
.regularTable table { /* default table formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
table-layout: fixed; /* prevents auto-resizing of column widths */
 +
}
 +
 
 +
.regularTable th { /* default table header formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
border: 1px solid black;
 +
color: #000000; /*black*/
 +
font-size: 14px;
 +
}
 +
 
 +
.regularTable td { /* default table detail formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
border: 1px solid black;
 +
color: #000000; /*black*/
 +
font-size: 12px;
 +
padding: 4px;
 +
}
 +
 
 +
.regularCol10 { /* For fixed table Column widths */
 +
width: 10%;
 +
}
 +
.regularCol20 { /* For fixed table Column widths */
 +
width: 20%;
 +
}
 +
.regularCol30 { /* For fixed table Column widths */
 +
width: 30%;
 +
}
 +
.regularCol40 { /* For fixed table Column widths */
 +
width: 40%;
 +
}
 +
 
 +
.regularHeader h1 { /* Heading1 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader h2 { /* heading2 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader h3 { /* heading3 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader h4 { /* heading4 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader h5 { /* heading5 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularHeader h6 { /* heading6 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
.regularParagraph p { /* paragraph formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
/* font-size: 20px; */
 +
}
 +
 
 +
.regularHyperlink a { /* hyperlink formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
font-weight: bold;
 +
color: #0645ad; /*hyperlink blue*/
 +
text-decoration: underline;
 +
/* display:inline; here to keep hyperlinks inline - N.B. made no difference figure caption */
 +
}
 +
 
 +
/* DEFAULT styling - no class specified */
 +
 
 +
/* table { default table formatting */
 +
/* font-family: Verdana, Geneva, sans-serif; */
 +
/* border-collapse: collapse; */
 +
/* width: 100%; */
 +
/* } */
 +
 
 +
/* table, th { default table header formatting */
 +
/* font-family: Verdana, Geneva, sans-serif; */
 +
/* border: 1px solid black; */
 +
/* height: 28px; */
 +
/* padding: 15px; */
 +
/* text-align: center; */
 +
/* vertical-align: middle; */
 +
/* background-color:  #ffffff; white*/
 +
/* color: #000000; black*/
 +
/* } */
 +
 
 +
/* table, td { default table detail formatting */
 +
/* font-family: Verdana, Geneva, sans-serif; */
 +
/* border: 1px solid black; */
 +
/* height: 28px; */
 +
/* padding: 15px; */
 +
/* text-align: left; */
 +
/* vertical-align: middle; */
 +
/* background-color:  #ffffff; white*/
 +
/* color: #000000; black*/
 +
/* } */
 +
 
 +
caption { /* styling for table captions */
 +
/* none yet */
 +
}
 +
 
 +
figure { /* Styling for figure captions - class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
background-color: #ffffff;
 +
padding: 5px;
 +
/* display: table; */
 +
}
 +
 
 +
figure img {
 +
display: block;
 +
/* width: 100%; */
 +
}
 +
 
 +
figcaption { /* Styling for figure captions - class */
 +
font-family: Verdana, Geneva, sans-serif;
 +
/* display: inline-block; here to keep the caption underneath the figure */
 +
display: inline; /* trying to remove hyperlink block? */
 +
color: #000000; /*black*/
 +
text-align: left;
 +
/* display: table-caption; */
 +
/* table-layout: auto; */
 +
caption-side: bottom;
 +
background: #ffffff;
 +
padding: 0 5px 5px;
 +
width: 100%;
 +
}
 +
 
 +
ul {
 +
font-family: Verdana, Geneva, sans-serif;
 +
list-style-type: circle;
 +
}
 +
 
 +
ol {
 +
font-family: Verdana, Geneva, sans-serif;
 +
list-style-type: circle;
 +
}
 +
 
 +
h1 { /* Heading1 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
h2 { /* heading2 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
h3 { /* heading3 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
h4 { /* heading4 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
h5 { /* heading5 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
h6 { /* heading6 formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
text-align: left;
 +
}
 +
 
 +
p { /* paragraph formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
color: #000000; /*black*/
 +
}
 +
 
 +
a { /* hyperlink formatting */
 +
font-family: Verdana, Geneva, sans-serif;
 +
display:inline; /* here to keep hyperlinks inline */
 +
}
 +
 
 +
img { /* image formatting */
 +
max-width:100%;
 +
}
 +
 
 +
</style>
 
</html>
 
</html>

Latest revision as of 13:14, 7 September 2015

MqAust Burpey v46-bubblePetri44 Summary03.png