Difference between revisions of "Template:WPI Worcester"

 
(48 intermediate revisions by the same user not shown)
Line 20: Line 20:
 
#home_logo, #sideMenu { display:none; }
 
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
−
#content {background: none; width: 100%; margin: 0;}
+
#content {background: none; width: 100%; margin: 0; padding:0;}
 +
a[href ^="https://"] {padding: 0;}
 
/* Important for overriding default! */
 
/* Important for overriding default! */
  
Line 75: Line 76:
  
 
h1, h2, h3, h4, h5, h6 {
 
h1, h2, h3, h4, h5, h6 {
−
   font-family: "Fredoka One", Helvetica, sans-serif;
+
   font-family: "Nunito Bold", Helvetica, sans-serif !important;
 +
}
 +
 
 +
h1 {
 +
  text-align: center;
 +
  color: #609737;
 +
}
 +
 
 +
h2 {
 +
  color: #2f5668;
 +
  margin-bottom: 1rem;
 +
}
 +
 
 +
h3 {
 +
  color: #1687C2;
 +
  font-style: italic;
 +
  margin-bottom: 0;
 
}
 
}
  
 
/* All CLASSES defined here */
 
/* All CLASSES defined here */
 +
 +
.centered {
 +
  text-align: center;
 +
}
  
 
.greentext {
 
.greentext {
 
   color: #72b045;
 
   color: #72b045;
 +
}
 +
 +
.bluetext {
 +
  color: #86c6e7;
 +
}
 +
 +
.midbluetext {
 +
  color: #1687C2;
 
}
 
}
  
Line 169: Line 198:
 
   position: fixed;
 
   position: fixed;
 
   background-color: white;
 
   background-color: white;
−
   background-image: linear-gradient(135deg, white 30%, #86c6e7 30%);
+
   background-image: linear-gradient(135deg, white 35%, #86c6e7 35%);
 
   font-family: "Fredoka One", Helvetica, sans-serif;
 
   font-family: "Fredoka One", Helvetica, sans-serif;
 
   font-size: 2em;
 
   font-size: 2em;
 
   line-height: 1em;
 
   line-height: 1em;
 +
  z-index: 100;
 
}
 
}
  
Line 195: Line 225:
 
   background-color: rgba(255, 255, 255, 0.7);
 
   background-color: rgba(255, 255, 255, 0.7);
 
   width: 70%;
 
   width: 70%;
−
   margin: 4em;
+
   margin: 4em auto;
 
   padding: 1em;
 
   padding: 1em;
 +
  overflow: auto;
 
}
 
}
  
−
#main_content > div {
+
#main_content div {
 
   background-color: #2f5668;
 
   background-color: #2f5668;
 
   background-color: rgba(255, 255, 255, 0.7);
 
   background-color: rgba(255, 255, 255, 0.7);
−
   padding: 2em;
+
  margin: 1em;
 +
   padding: 1em;
 
}
 
}
  
 
#main_content a {
 
#main_content a {
−
   color: #5bc7d8;
+
   color: #1687C2;
−
   font-weight: bold;  
+
}
−
   text-decoration: underline;
+
 
 +
#main_content a:hover {
 +
  color: #72b045;
 +
}
 +
 
 +
#main_content a:active {
 +
  color: #609737;
 +
}
 +
 
 +
#main_content a:visited {
 +
  color: #609737;
 +
}
 +
 
 +
#main_content img {
 +
  margin: 1em;
 +
}
 +
 
 +
#main_content ol {
 +
  list-style-type: disc;
 +
}
 +
 
 +
#main_content p {
 +
   font-size: .8em;
 +
   text-align: left;
 +
}
 +
 
 +
#main_content p.centered {
 +
  text-align: center;
 +
}
 +
 
 +
#main_content li {
 +
  font-size: .8em;
 
}
 
}
  
Line 235: Line 298:
 
   border-color: #2f5668;
 
   border-color: #2f5668;
 
   border-color: rgba(183, 243, 241, 0.3);
 
   border-color: rgba(183, 243, 241, 0.3);
 +
  font-family: "Nunito Bold", sans-serif;
 +
}
 +
 +
#menu_list > li > a, #menu_list > li > button {
 +
  font-family: "Nunito Bold", sans-serif;
 
}
 
}
  
Line 264: Line 332:
  
 
<script>
 
<script>
−
function detectSize(){
+
function pageSetup(){
 
   toggleButton = document.getElementById("menu_toggle_button");
 
   toggleButton = document.getElementById("menu_toggle_button");
 
   if (window.matchMedia("(max-width: 940px)").matches){
 
   if (window.matchMedia("(max-width: 940px)").matches){
 +
      toggleMenu();
 +
  } else {
 +
      toggleMenu();
 
       toggleMenu();
 
       toggleMenu();
 
   }
 
   }
−
    
+
 
 +
   $("#main_content").find("a").removeClass("text");
 +
  $("#main_content").find("a").removeClass("external");
 +
  // wasn't sure how else to remove the external link symbol
 
}
 
}
 +
 +
$( window ).load(pageSetup());
  
 
function toggleMenu(){
 
function toggleMenu(){
 
   toggleButton = document.getElementById("menu_toggle_button");
 
   toggleButton = document.getElementById("menu_toggle_button");
−
  menuList = document.getElementById("menu_list");
+
  menuList = document.getElementById("menu_list");
 +
  mainContent = document.getElementById("main_content");
 
   if (toggleButton.innerHTML == "HIDE" || toggleButton.value == "HIDE" ){
 
   if (toggleButton.innerHTML == "HIDE" || toggleButton.value == "HIDE" ){
 
     toggleButton.value="SHOW";
 
     toggleButton.value="SHOW";
Line 280: Line 357:
 
     toggleButton.setAttribute("aria-expanded", false);
 
     toggleButton.setAttribute("aria-expanded", false);
 
     menuList.style.display="none";
 
     menuList.style.display="none";
 +
    mainContent.style.margin = "4em auto";
 
   } else {
 
   } else {
 
     toggleButton.value="HIDE";
 
     toggleButton.value="HIDE";
Line 285: Line 363:
 
     toggleButton.setAttribute("aria-expanded", true);
 
     toggleButton.setAttribute("aria-expanded", true);
 
     menuList.style.display="block";
 
     menuList.style.display="block";
 +
    mainContent.style.marginRight = "17rem";
 
   }
 
   }
 
}
 
}
Line 302: Line 381:
  
  
−
<body onload="detectSize()">
+
<body>
 
<div id="header">
 
<div id="header">
 
   <a id="header_link" href="https://2018.igem.org/Team:WPI_Worcester"><img id="header_logo" src="https://static.igem.org/mediawiki/2018/e/ed/T--WPI_Worcester--logo.svg"/>
 
   <a id="header_link" href="https://2018.igem.org/Team:WPI_Worcester"><img id="header_logo" src="https://static.igem.org/mediawiki/2018/e/ed/T--WPI_Worcester--logo.svg"/>

Latest revision as of 02:08, 18 October 2018