Difference between revisions of "Template:IISER Pune"
Prashant u (Talk | contribs) |
|||
Line 1: | Line 1: | ||
− | {{ | + | <!---{{Template_IISER_Pune}}--!> |
<!-- Declare that you are going to use html code instead of wiki code --> | <!-- Declare that you are going to use html code instead of wiki code --> | ||
Line 8: | Line 8: | ||
/* PAGE LAYOUT */ | /* PAGE LAYOUT */ | ||
− | + | ||
− | /* | + | /* page background color*/ |
body { | body { | ||
− | background-color: # | + | background-color: #A7A9AB; |
} | } | ||
− | + | ||
/* Creates a container that will wrap all of the content inside your wiki pages. */ | /* Creates a container that will wrap all of the content inside your wiki pages. */ | ||
#mainContainer { | #mainContainer { | ||
− | width: | + | width: 980px; |
− | overflow:hidden; | + | overflow: hidden; |
float:left; | float:left; | ||
− | margin-left:20px | + | margin-left: 20px; |
− | + | background-color: #EEEDEA; | |
− | background-color: # | + | border-bottom: 6px solid #EE3e53; |
− | border-bottom: | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /* Creates the container for the menu */ | |
− | # | + | #menuContainer { |
− | + | float:right; | |
− | + | width: 150px; | |
− | + | background-color: #0e232f; | |
− | + | height: 100%; | |
− | + | border-top: 6px solid #EE3e53; | |
− | + | font-family: "Arial", Helvetica, sans-serif; | |
} | } | ||
− | |||
/* Creates the container for the content */ | /* Creates the container for the content */ | ||
#contentContainer { | #contentContainer { | ||
− | + | background-color: #EEEDEA; | |
− | + | width: 810px; | |
− | + | ||
− | width: | + | |
− | + | ||
float: left; | float: left; | ||
− | + | padding: 10px; | |
− | border-top: | + | border-top: 6px solid #EE3e53; |
− | + | ||
} | } | ||
+ | |||
/*Set up height place holder for the banner*/ | /*Set up height place holder for the banner*/ | ||
Line 63: | Line 54: | ||
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ | /*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ | ||
+ | |||
/*Change the styling of text for everything inside main container*/ | /*Change the styling of text for everything inside main container*/ | ||
#mainContainer p { | #mainContainer p { | ||
− | font-size: | + | font-family: "Arial", Helvetica, sans-serif; |
− | color: # | + | font-size: 12px; |
+ | color: #0e232f; | ||
} | } | ||
/*This changes the color and font family */ | /*This changes the color and font family */ | ||
#contentContainer h1, h2, h3, h4, h5, h6 { | #contentContainer h1, h2, h3, h4, h5, h6 { | ||
− | color: # | + | font-family: "Arial", Helvetica, sans-serif; |
+ | color: #0e232f; | ||
border-bottom: none; | border-bottom: none; | ||
font-weight: bold; | font-weight: bold; | ||
− | + | text-transform: uppercase; | |
− | + | ||
} | } | ||
Line 82: | Line 75: | ||
#contentContainer a { | #contentContainer a { | ||
font-weight: bold; | font-weight: bold; | ||
− | color: # | + | color: #ee3e53; |
} | } | ||
/* Styling links on hover- links are different inside the menu */ | /* Styling links on hover- links are different inside the menu */ | ||
− | #contentContainer a:hover { | + | #contentContainer a:hover{ |
− | + | color: #f4b248; | |
} | } | ||
/*Change the styling of tables */ | /*Change the styling of tables */ | ||
#contentContainer table { | #contentContainer table { | ||
− | border: 1px solid # | + | border: 1px solid #0e232f; |
border-collapse: collapse; | border-collapse: collapse; | ||
width: 90% | width: 90% | ||
Line 105: | Line 98: | ||
#contentContainer td { | #contentContainer td { | ||
padding: 10px; | padding: 10px; | ||
− | border: 1px solid # | + | border: 1px solid #0e232f; |
border-collapse: collapse; | border-collapse: collapse; | ||
vertical-align: text-top; | vertical-align: text-top; | ||
+ | background-color: #EEEDEA; | ||
} | } | ||
/*Change the styling of table headers */ | /*Change the styling of table headers */ | ||
#contentContainer th { | #contentContainer th { | ||
− | |||
padding: 10px; | padding: 10px; | ||
− | border: 1px solid # | + | border: 1px solid #0e232f; |
border-collapse: collapse; | border-collapse: collapse; | ||
vertical-align: text-top; | vertical-align: text-top; | ||
+ | background-color: #e8d5b7; | ||
} | } | ||
− | |||
− | /* | + | /*MENU STYLING */ |
− | + | ||
− | + | /*Styling for the links in the menu */ | |
− | + | #menuContainer a { | |
+ | color: #EEEDEA; | ||
+ | text-decoration:none; | ||
+ | font-weight: bold; | ||
} | } | ||
+ | /* Sets the style for lists inside menuContainer */ | ||
+ | #menuContainer ul { | ||
+ | width:100%; | ||
+ | list-style: none; | ||
+ | margin: auto; | ||
+ | padding-top: 10px; | ||
+ | padding-bottom: 10px; | ||
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | /*Styles the list items to become menu buttons */ | |
− | + | #menuContainer ul li { | |
− | + | display: block; | |
− | + | position: relative; | |
− | + | padding: 10px; | |
− | + | margin-bottom:5px; | |
− | + | padding-left: -20px; | |
− | + | } | |
− | + | #menuContainer ul li:hover { | |
+ | background: #F4B248; | ||
+ | color: #0e232f; | ||
+ | } | ||
− | + | ||
− | + | /*HIde the submenus and removes the padding */ | |
− | display: | + | #menuContainer li ul { |
− | + | display: none; | |
− | + | padding-top:15px; | |
− | + | margin-left: -9px; | |
} | } | ||
− | /* | + | /*Shows the submenus once you hover*/ |
− | + | #menuContainer li:hover ul { | |
− | + | display: block; | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /*style the submenu buttons*/ | |
+ | #menuContainer li ul li { | ||
+ | background: #0E232F; | ||
+ | width: 100%; | ||
+ | } | ||
− | + | #menuContainer li ul li:hover { | |
− | + | background: #EE3E53; | |
− | + | color: #fff; | |
− | background:# | + | |
− | + | ||
} | } | ||
− | . | + | |
− | + | ||
− | + | /*CLASSES */ | |
− | + | /*Clear class for all the pages, adds spacing too*/ | |
− | + | .clear{ | |
− | + | clear:both; | |
+ | height: 10px; | ||
} | } | ||
− | + | /* highlight box for special messages */ | |
− | + | .highlightBox { | |
+ | width:500px; | ||
+ | margin:auto; | ||
+ | background-color: #E8D5B7; | ||
+ | margin-bottom: 15px; | ||
+ | margin-top: 15px; | ||
+ | padding: 15px; | ||
+ | padding-top: 5px; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
<!-- End of CSS --> | <!-- End of CSS --> | ||
− | |||
<!-- Start of the template html elements. --> | <!-- Start of the template html elements. --> | ||
− | <div | + | <div id ="mainContainer"><!--This div will close on the page.--> |
− | + | <div id="bannerContainer"> | |
− | < | + | <br><br> |
− | < | + | <h2> Indian Institute of Science Education and Research (IISER), Pune, India </h2> |
− | + | ||
− | + | <img src="https://static.igem.org/mediawiki/2015/8/82/Logo_IISER_Pune.jpg" height = 120px> | |
+ | <img src="https://static.igem.org/mediawiki/2015/8/81/Team_IISER_Pune_banner.jpg" height = 120px> | ||
+ | |||
+ | |||
+ | <!--[[File:Team IISER Pune banner.jpg]] | ||
+ | <p>You can make the image 980px by 200px</p> | ||
+ | <p> Remember to call the file: "<i>Team_Example_banner.jpg</i>" </p>---> | ||
+ | </div> | ||
+ | |||
+ | <!-- Start of menu --> | ||
+ | <div id="menuContainer"> | ||
+ | <!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons --> | ||
+ | <ul> | ||
+ | <a href="https://2015.igem.org/Team:IISER_Pune"><li>HOME</li></a> | ||
+ | |||
+ | <a href="https://2015.igem.org/Team:IISER_Pune/Team"><li>TEAM</li></a> | ||
+ | |||
+ | |||
+ | <a href="#"><li>PROJECT | ||
<ul> | <ul> | ||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Description"><li>Description</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Experiments"><li>Experiments & Protocols</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Results"><li>Results</li></a> |
− | + | ||
</ul> | </ul> | ||
− | </ | + | </li></a> |
− | + | <a href="#"><li>PARTS | |
<ul> | <ul> | ||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Parts"><li>Team Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Basic_Part"><li>Basic Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Composite_Part"><li>Composite Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:IISER_Pune/Part_Collection"><li>Part Collection</li></a> |
</ul> | </ul> | ||
− | + | </li></a> | |
− | + | ||
− | + | ||
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Notebook"><li>NOTEBOOK</li></a> | |
− | + | ||
− | + | ||
− | + | ||
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Attributions"><li>ATTRIBUTIONS</li></a> | |
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Collaborations"><li>COLLABORATIONS</li></a> | |
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Practices"><li>HUMAN PRACTICES</li></a> | |
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Safety"><li>SAFETY</li></a> | |
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Modeling"><li>MODELING</li></a> | |
− | + | <a href="https://2015.igem.org/Team:IISER_Pune/Measurement"><li>MEASUREMENT</li></a> | |
− | + | <a href="https://2015.igem.org/Team:Example2/Software"><li>SOFTWARE</li></a> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | <a href="https://2015.igem.org/Team:IISER_Pune/Entrepreneurship"><li>ENTREPRENEURSHIP</li></a> | ||
− | + | </ul> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<!-- End of menu --> | <!-- End of menu --> | ||
<!-- Start of content --> | <!-- Start of content --> | ||
− | <div id="contentContainer"> <!-- | + | <div id="contentContainer"><!--This div will close on the page.--> |
− | + | ||
</html> | </html> |
Revision as of 05:47, 16 June 2015