Difference between revisions of "Template:UAlberta/CSS"

m
m
 
(23 intermediate revisions by 2 users not shown)
Line 2: Line 2:
 
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
 
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
 
<link href="https://fonts.googleapis.com/css?family=Amiko:400,700|Karla:400,700" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Amiko:400,700|Karla:400,700" rel="stylesheet">
 +
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
 +
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
 
<style>
 
<style>
 
/* ****************************************
 
/* ****************************************
Line 19: Line 21:
 
#mw-content-text > p { margin: 5px 0; }
 
#mw-content-text > p { margin: 5px 0; }
 
#globalWrapper { padding-bottom: 0; }
 
#globalWrapper { padding-bottom: 0; }
 +
#HQ_page p { text-align: unset; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin: 0; }
  
 
/* ****************************************
 
/* ****************************************
Line 48: Line 52:
  
 
.ua-home-section:nth-child(1) .ua-stripes {
 
.ua-home-section:nth-child(1) .ua-stripes {
   /* background: linear-gradient(#9370DB, #E6E6FA); */
+
   background: linear-gradient(#9370DB, #E6E6FA);
   background: linear-gradient(rgb(255, 255, 255), rgb(248, 248, 213));
+
   /* background: linear-gradient(rgb(255, 255, 255), rgb(248, 248, 213)); */
 
   z-index: -1;
 
   z-index: -1;
 
}
 
}
Line 55: Line 59:
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(1) {
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(1) {
 
   grid-area: 1 / 1 / 4 / -1;
 
   grid-area: 1 / 1 / 4 / -1;
   /* background: linear-gradient(168deg, #800080, #DA70D6); */
+
   background: linear-gradient(168deg, #800080, #DA70D6);
   background: linear-gradient(168deg, #FFDF00, #FFA500);
+
   /* background: linear-gradient(168deg, #FFDF00, #FFA500); */
 
}
 
}
  
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(2) {
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(2) {
 
   grid-area: 4 / 6 / 5 / -1;
 
   grid-area: 4 / 6 / 5 / -1;
   /* background: linear-gradient(270deg, #800080, #DA70D6); */
+
   background: linear-gradient(270deg, #800080, #DA70D6);
   background: linear-gradient(168deg, #FFDF00, #FFA500);
+
   /* background: linear-gradient(168deg, #FFDF00, #FFA500); */
 
}
 
}
  
Line 72: Line 76:
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(4) {
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(4) {
 
   grid-area: 9 / 8 / -2 / -1;
 
   grid-area: 9 / 8 / -2 / -1;
   /* background: linear-gradient(270deg, #800080, #DA70D6); */
+
   background: linear-gradient(270deg, #800080, #DA70D6);
   background: linear-gradient(168deg, #FFDF00, #FFA500);
+
   /* background: linear-gradient(168deg, #FFDF00, #FFA500); */
 
}
 
}
  
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(5) {
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(5) {
 
   grid-area: 10 / 10 / -2 / -1;
 
   grid-area: 10 / 10 / -2 / -1;
   /* background: linear-gradient(168deg, #800080, #DA70D6); */
+
   background: linear-gradient(168deg, #800080, #DA70D6);
   background: linear-gradient(168deg, #FFDF00, #FFA500);
+
   /* background: linear-gradient(168deg, #FFDF00, #FFA500); */
 
}
 
}
  
Line 89: Line 93:
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(6) {
 
.ua-home-section:nth-child(1) .ua-stripes span:nth-child(6) {
 
   grid-area: 10 / 1 / -1 / -1;
 
   grid-area: 10 / 1 / -1 / -1;
   /* background: linear-gradient(145deg, #800080, #DA70D6); */
+
   background: linear-gradient(145deg, #800080, #DA70D6);
   background: linear-gradient(90deg, #FFDF00, #FFA500);
+
   /* background: linear-gradient(90deg, #FFDF00, #FFA500); */
 
}
 
}
  
Line 100: Line 104:
 
.ua-home-section:nth-child(3) .ua-stripes {
 
.ua-home-section:nth-child(3) .ua-stripes {
 
   /* background: #E6E6FA; */
 
   /* background: #E6E6FA; */
   background: rgb(248, 248, 213);
+
   /* background: rgb(248, 248, 213); */
 
   z-index: -1;
 
   z-index: -1;
 
}
 
}
Line 199: Line 203:
 
   height: 760px;
 
   height: 760px;
 
   /* background: #E6E6FA; */
 
   /* background: #E6E6FA; */
   background: rgb(248, 248, 213);
+
   /* background: rgb(248, 248, 213); */
 
   z-index: -1;
 
   z-index: -1;
 
}
 
}
Line 273: Line 277:
 
.location-marker-3:hover {
 
.location-marker-3:hover {
 
   z-index: 1;
 
   z-index: 1;
 +
}
 +
 +
.ua-collapsable .ua-collapse-button {
 +
  background: #800080;
 +
  color: #fff;
 +
  padding: 15px;
 +
  border-radius: 8px;
 
}
 
}
  
 
.ua-footer {
 
.ua-footer {
  /* background: #8478b8; */
 
 
   background: #800080;
 
   background: #800080;
  /* background: #FFA500; */
+
   height: 100%;
   height: 200px;
+
 
   width: 100%;
 
   width: 100%;
 
   margin-bottom: -5px;
 
   margin-bottom: -5px;
 +
}
 +
 +
.ua-footer h5 {
 +
  margin-top: 10px;
 +
  color: #fff;
 +
}
 +
 +
.ua-footer ul {
 +
  list-style-type: none;
 +
}
 +
 +
.ua-footer li a {
 +
  color: #fff;
 +
}
 +
 +
.ua-footer li:last-child {
 +
  margin-bottom: 20px;
 
}
 
}
  
Line 294: Line 320:
 
.ua-home h1 {
 
.ua-home h1 {
 
   font-family: 'Amiko', sans-serif !important;
 
   font-family: 'Amiko', sans-serif !important;
   font-size: 48px;
+
   font-size: 32px;
 
   color: #4B0082;
 
   color: #4B0082;
 
}
 
}
Line 304: Line 330:
 
   text-align: justify !important;
 
   text-align: justify !important;
 
   color: #000;
 
   color: #000;
 +
}
 +
 +
.ua-home li {
 +
  font-family: 'Karla', sans-serif !important;
 
}
 
}
  
 
.ua-home-section-primary p {
 
.ua-home-section-primary p {
 
   padding: 20px;
 
   padding: 20px;
 +
}
 +
 +
.ua-home-section-secondary h1,
 +
.ua-home-section-secondary p {
 +
  text-align: right !important;
 +
  margin-bottom: 20px;
 +
}
 +
 +
.ua-home-section-secondary h1 {
 +
  font-size: 48px;
 
}
 
}
  
 
.ua-research-content h1 {
 
.ua-research-content h1 {
   font-family: 'Amiko', sans-serif;
+
   font-family: 'Amiko', sans-serif !important;
   font-size: 128px;
+
   font-size: 64px;
 
   /* color: #007bb8; */
 
   /* color: #007bb8; */
 
   color: #800080;
 
   color: #800080;
  text-align: center;
+
   margin-bottom: 80px!important;  
  margin-top: 20px;
+
   margin-bottom: 70px;
+
  /* padding-top: 0; iGEM */
+
 
}
 
}
  
 
.ua-research-content h2 {
 
.ua-research-content h2 {
   font-family: 'Amiko', sans-serif;
+
   font-family: 'Amiko', sans-serif !important;
 
   font-size: 48px;
 
   font-size: 48px;
 
   /* color: #007bb8; */
 
   /* color: #007bb8; */
 
   color: #800080;
 
   color: #800080;
   text-align: left;
+
   margin-bottom: 40px !important;
  /* margin: 40px 0;
+
  margin-top: 80px; */
+
 
}
 
}
  
 
.ua-research-content h3 {
 
.ua-research-content h3 {
   font-family: 'Amiko', sans-serif;
+
   font-family: 'Amiko', sans-serif !important;
   font-size: 48px;
+
   font-size: 38px;
 +
font-style: italic;
 
   /* color: #007bb8; */
 
   /* color: #007bb8; */
 
   color: #800080;
 
   color: #800080;
   margin: 40px 0;
+
   margin-bottom: 40px !important;
}
+
 
+
.ua-research-content h4 {
+
  font-family: 'Amiko', sans-serif;
+
  font-size: 32px;
+
  color: #007bb8;
+
  margin: 40px 0;
+
 
}
 
}
  
Line 349: Line 378:
 
   font-family: 'Karla', sans-serif !important;
 
   font-family: 'Karla', sans-serif !important;
 
   line-height: 160%;
 
   line-height: 160%;
  text-align: justify;
 
 
   font-size: 20px !important;
 
   font-size: 20px !important;
 
   margin: 20px;
 
   margin: 20px;
 +
  margin-bottom: 40px;
 +
}
 +
 +
.ua-research-content li {
 +
  font-family: 'Karla', sans-serif !important;
 +
}
 +
 +
.ua-collapsable .card-body {
 +
  font-family: 'Karla', sans-serif !important;
 +
  line-height: 160%;
 +
  font-size: 20px !important;
 +
}
 +
 +
.ua-collapse-button h6 {
 +
  font-family: 'Karla', sans-serif !important;
 +
  display: inline-block;
 +
  margin-bottom: 0;
 +
  margin-left: 5px;
 +
  padding: 0;
 +
}
 +
 +
.ua-collapse-button i {
 +
  float: right;
 +
  margin-top: 3px;
 +
  margin-right: 10px;
 +
}
 +
 +
.card-title {
 +
  font-family: 'Amiko', sans-serif !important;
 +
}
 +
 +
.card h5.card-title {
 +
  text-align: center;
 
}
 
}
  
Line 383: Line 444:
  
 
.tooltip-inner {
 
.tooltip-inner {
   font-family: 'Amiko', sans-serif;
+
   font-family: 'Amiko', sans-serif !important;
 
}
 
}
  
 
</style>
 
</style>
 
</html>
 
</html>

Latest revision as of 04:50, 8 December 2018