Difference between revisions of "Template:HK GTC"

 
(25 intermediate revisions by the same user not shown)
Line 55: Line 55:
 
                     <li>Human Practice</li>
 
                     <li>Human Practice</li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Deep_learning">Deep Learning</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Deep_learning">Deep Learning</a></li>
−
                    <li><a href="https://2021.igem.org/Team:HK_GTC/Awards">Awards</a></li>
 
 
                 </ul>
 
                 </ul>
 
             </div>
 
             </div>
Line 69: Line 68:
 
                 <ul>
 
                 <ul>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Description">Description</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Description">Description</a></li>
−
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Design">Design</a></li>
+
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Engineering">Engineering Success</a></li>
 +
                    <li><a href="https://2021.igem.org/Team:HK_GTC/Proof_Of_Concept">Proof of Concept</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Notebook">Notebook</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Notebook">Notebook</a></li>
−
                    <li><a href="https://2021.igem.org/Team:HK_GTC/Engineering">Engineering</a></li>
 
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Results">Experiments and Results</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Results">Experiments and Results</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Implementation">Implementation</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Implementation">Implementation</a></li>
 +
                    <li><a href="https://2021.igem.org/Team:HK_GTC/Contribution">Contribution</a></li>
 
                 </ul>
 
                 </ul>
 
             </div>
 
             </div>
Line 80: Line 80:
 
                 <ul>
 
                 <ul>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Human_Practices">Integrated Human Practice</a></li>
 
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Human_Practices">Integrated Human Practice</a></li>
−
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Collaborations">Partnership & Collaborations</a></li>
+
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Collaborations">Collaborations</a></li>
−
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Education">Education & Engagement</a></li>
+
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Partnership">Partnership</a></li>
−
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Education_Material">Education Material</a></li>
+
                     <li><a href="https://2021.igem.org/Team:HK_GTC/Communication">Education & Communication</a></li>
 
                 </ul>
 
                 </ul>
 
             </div>
 
             </div>
Line 89: Line 89:
 
<style>
 
<style>
 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800&family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800&family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap');
 +
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;1,300;1,500&display=swap');
 +
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200&display=swap');
  
 
* {
 
* {
Line 107: Line 109:
 
     font-family: "Monastic";
 
     font-family: "Monastic";
 
     src: url("https://static.igem.org/mediawiki/2021/8/83/T--HK_GTC--Monastic.ttf");
 
     src: url("https://static.igem.org/mediawiki/2021/8/83/T--HK_GTC--Monastic.ttf");
 +
}
 +
 +
@font-face {
 +
    font-family: "Garlic";
 +
    src: url("https://static.igem.org/mediawiki/2021/b/bc/T--HK_GTC--Garlic.ttf");
 
}
 
}
  
Line 233: Line 240:
 
#my-nav #popup li {
 
#my-nav #popup li {
 
     list-style: none;
 
     list-style: none;
−
     padding: .2rem;
+
    margin: 0 !important;
 +
}
 +
 
 +
#my-nav #popup li {
 +
    list-style: none;
 +
     padding: .5rem 1rem;
 +
    margin: 0 !important;
 +
    font-size: 1.8rem !important;
 
}
 
}
  
 
#my-nav #popup h1 {
 
#my-nav #popup h1 {
−
     padding: .6rem
+
     padding: 1rem 0;
 +
    font-size: 2.5rem !important;
 
}
 
}
  
Line 307: Line 322:
 
h2,
 
h2,
 
h3,
 
h3,
−
h4 {
+
h4,
 +
h5 {
 
     font-family: "Montserrat", sans-serif !important;
 
     font-family: "Montserrat", sans-serif !important;
 
     padding: 0;
 
     padding: 0;
Line 315: Line 331:
  
 
p {
 
p {
−
     font-family: "Raleway", sans-serif !important;
+
     font-family: "Open Sans", sans-serif !important;
−
}
+
    color: #f4f4f4;
 +
}  
  
 
#my-global-wrapper {
 
#my-global-wrapper {
Line 336: Line 353:
 
     grid-template-columns: 1fr 1fr;
 
     grid-template-columns: 1fr 1fr;
 
}
 
}
−
 
−
/* #welcome h1{
 
−
    color: #fff;
 
−
    width: 100%;
 
−
    text-align: center;
 
−
    padding-top:300px;
 
−
    animation-name: floaty;
 
−
    animation-duration: 1s;
 
−
    animation-iteration-count: infinite;
 
−
    animation-timing-function:cubic-bezier(0.59, 0.01, 0.4, 0.93);
 
−
} */
 
  
 
.welcome-center {
 
.welcome-center {
Line 361: Line 367:
 
#welcome .left h1 {
 
#welcome .left h1 {
 
     font-family: "Monastic" !important;
 
     font-family: "Monastic" !important;
 +
    color: #000 !important;
 
     font-size: 6rem;
 
     font-size: 6rem;
 
     padding: 1rem;
 
     padding: 1rem;
Line 392: Line 399:
 
#welcome .left p {
 
#welcome .left p {
 
     font-size: 2.5rem;
 
     font-size: 2.5rem;
 +
    font-family: "Montserrat" !important;
 
     font-weight: 200;
 
     font-weight: 200;
 
     width: 100%;
 
     width: 100%;
Line 397: Line 405:
 
     text-align: left;
 
     text-align: left;
 
     margin: 0;
 
     margin: 0;
 +
    color: #4f4f4f !important;
 
}
 
}
  
Line 427: Line 436:
  
 
#desc h1 {
 
#desc h1 {
 +
    font-family: 'Garlic', sans-serif !important;
 
     color: #fff;
 
     color: #fff;
 
     font-size: 3rem;
 
     font-size: 3rem;
−
    font-family: 'Montserrat', sans-serif;
 
 
     text-align: center;
 
     text-align: center;
 
     width: 100%;
 
     width: 100%;
Line 809: Line 818:
 
     font-size: 1.3rem !important;
 
     font-size: 1.3rem !important;
 
     text-align: center !important;
 
     text-align: center !important;
 +
    color: #4f4f4f !important;
 
     font-style: italic;
 
     font-style: italic;
 
     font-weight: bold;
 
     font-weight: bold;
Line 816: Line 826:
 
     margin-top: 3rem;
 
     margin-top: 3rem;
 
     width: 80%;
 
     width: 80%;
−
    border-radius: 3rem;
 
 
}
 
}
  
Line 833: Line 842:
 
     line-height: normal !important;
 
     line-height: normal !important;
 
     margin: 2rem 0 !important;
 
     margin: 2rem 0 !important;
 +
}
 +
 +
.block p{
 +
    color: #4f4f4f !important;
 
}
 
}
  
 
.ihp-content p {
 
.ihp-content p {
 
     padding: 1rem;
 
     padding: 1rem;
 +
    color: #4f4f4f !important;
 
     line-height: 2rem;
 
     line-height: 2rem;
 
}
 
}
  
 
#ihp-res .img {
 
#ihp-res .img {
−
     background-image: url("https://static.igem.org/mediawiki/2021/2/2b/T--HK_GTC--ihp.plasticfreeseas.1.jpg");
+
     background-image: url("https://static.igem.org/mediawiki/2021/d/de/T--HK_GTC--ihp.prof.ngo2.jpg");
 
     background-size: cover;
 
     background-size: cover;
 
     background-position: center;
 
     background-position: center;
Line 902: Line 916:
 
     line-height: 2rem;
 
     line-height: 2rem;
 
     font-size: 1rem !important;
 
     font-size: 1rem !important;
 +
    color: #4f4f4f;
 
}
 
}
  
Line 983: Line 998:
 
     left: 50%;
 
     left: 50%;
 
     transform: translate(-50%, -50%);
 
     transform: translate(-50%, -50%);
 +
    color: #4f4f4f;
 
}
 
}
  
Line 1,038: Line 1,054:
 
     font-size: 1rem !important;
 
     font-size: 1rem !important;
 
     line-height: 1.5rem;
 
     line-height: 1.5rem;
 +
    color: #4f4f4f;
 
}
 
}
  
Line 1,101: Line 1,118:
 
     text-align: start;
 
     text-align: start;
 
     padding: 2rem;
 
     padding: 2rem;
 +
    color: #4f4f4f;
 
}
 
}
  
Line 1,131: Line 1,149:
 
     padding: 2rem;
 
     padding: 2rem;
 
     font-size: 1rem !important;
 
     font-size: 1rem !important;
 +
    color: #4f4f4f;
 
}
 
}
  
Line 1,190: Line 1,209:
 
.attri-card .attri-content ul li {
 
.attri-card .attri-content ul li {
 
     padding: .2rem 0;
 
     padding: .2rem 0;
 +
    font-family: "Open Sans", sans-serif;
 
}
 
}
  
Line 1,243: Line 1,263:
 
.section-selector li {
 
.section-selector li {
 
     list-style: none;
 
     list-style: none;
−
     font-family: "Raleway", sans-serif;
+
     font-family: "Open Sans", sans-serif;
 
     padding: .4rem;
 
     padding: .4rem;
 
}
 
}
Line 1,251: Line 1,271:
 
     color: #4f4f4f;
 
     color: #4f4f4f;
 
     font-size: 1.1rem;
 
     font-size: 1.1rem;
−
     font-weight: bold;
+
     font-weight: 400;
 +
    line-height: .8rem;
 
     transition: all .1s;
 
     transition: all .1s;
 
}
 
}
Line 1,267: Line 1,288:
 
.section-selector li:hover a {
 
.section-selector li:hover a {
 
     color: #fff;
 
     color: #fff;
 +
    font-weight: 500;
 
}
 
}
  
Line 1,290: Line 1,312:
 
     width: 100%;
 
     width: 100%;
 
     height: 100%;
 
     height: 100%;
−
     background-color: #4f4f4f;
+
     background-color: #2a4150;
 
     opacity: .8;
 
     opacity: .8;
 
}
 
}
Line 1,313: Line 1,335:
 
     padding: 6rem;
 
     padding: 6rem;
 
     width: 80%;
 
     width: 80%;
 +
    margin: auto;
 +
    text-align: justify;
 +
}
 +
 +
.section-contents-mid{
 +
    width: 80%;
 +
    margin: auto;
 +
    padding: 6rem;
 +
}
 +
 +
.section-contents-mid p{
 +
    width: 80%;
 +
    margin: auto;
 
}
 
}
  
Line 1,319: Line 1,354:
 
}
 
}
  
−
.section-contents h2 {
+
.section-contents h1{
 +
    line-height: normal !important;
 +
    padding: 0;
 +
    margin: 0;
 +
    margin: 2rem 0 !important;
 +
    font-size: 2rem;
 +
    font-weight: bold;
 +
    padding-left: 1rem;
 +
    border-left: #2a4150 6px solid;
 +
}
 +
 
 +
.section-contents h2, .section-contents-mid h2 {
 
     line-height: normal !important;
 
     line-height: normal !important;
 
     padding: 0;
 
     padding: 0;
Line 1,333: Line 1,379:
 
     border-left: #1BA784 6px solid;
 
     border-left: #1BA784 6px solid;
 
     font-size: 1.2rem;
 
     font-size: 1.2rem;
−
     margin-top: 1rem !important;
+
     margin: 1rem 0 !important;
 
     padding-left: 1rem;
 
     padding-left: 1rem;
 
}
 
}
  
−
.section-contents p {
+
.section-contents h4 {
−
     font-size: 1.2rem !important;
+
    border-left: #8dc6fc 6px solid;
−
     line-height: 1.6rem !important;
+
    font-size: 1.1rem;
 +
    margin: 1rem 0 !important;
 +
    padding-left: 1rem;
 +
}
 +
 
 +
.section-contents h5 {
 +
    border-left: #c5e2db 6px solid;
 +
    font-size: 1rem;
 +
    margin: 1rem 0 !important;
 +
    padding-left: 1rem;
 +
}
 +
 
 +
.section-contents p , .section-contents-mid p{
 +
     font-size: 1.1rem !important;
 +
     line-height: 1.8rem !important;
 +
    color: #4f4f4f;
 
     padding: 2rem 0;
 
     padding: 2rem 0;
 
     overflow-wrap: break-word;
 
     overflow-wrap: break-word;
Line 1,356: Line 1,417:
 
     font-family: "Raleway", sans-serif;
 
     font-family: "Raleway", sans-serif;
 
     line-height: 1.6rem !important;
 
     line-height: 1.6rem !important;
−
     padding: 4rem;
+
     padding: 1rem;
 
}
 
}
  
Line 1,364: Line 1,425:
 
     height: auto;
 
     height: auto;
 
     margin: auto;
 
     margin: auto;
 +
}
 +
 +
.section-contents table, th, td{
 +
    border: 2px solid #000;
 +
    border-collapse: collapse;
 +
}
 +
 +
.section-contents table{
 +
    margin:auto;
 +
}
 +
 +
.section-contents ul{
 +
    padding: 1rem;
 +
}
 +
 +
.section-contents li{
 +
    font-family: "Open Sans";
 +
    font-size: 1.1rem;
 +
    color: #4f4f4f;
 +
    padding-top: 1rem;
 +
}
 +
 +
.section-contents th,td{
 +
    padding: 1rem;
 
}
 
}
  
 
.single-image-with-desc {
 
.single-image-with-desc {
 
     display: block;
 
     display: block;
 +
    padding: 2rem;
 
}
 
}
  
Line 1,380: Line 1,466:
 
     text-align: center !important;
 
     text-align: center !important;
 
     padding: .5rem !important;
 
     padding: .5rem !important;
 +
    line-height: normal !important;
 
     margin: auto;
 
     margin: auto;
 
}
 
}
 +
 +
.section-contents.large-img .single-image-with-desc {
 +
    padding: 1rem 0 ;
 +
}
 +
 +
.section-contents.large-img .single-image-with-desc img{
 +
    padding: 0;
 +
    width: 100%;
 +
}
 +
 +
.section-contents.nb p{
 +
    padding: 0 ;
 +
}
 +
  
 
.two-image-with-desc {
 
.two-image-with-desc {
 
     display: block;
 
     display: block;
 
     width: 100%;
 
     width: 100%;
 +
    padding: 2rem;
 +
    overflow: hidden;
 
}
 
}
  
Line 1,401: Line 1,504:
 
     text-align: center !important;
 
     text-align: center !important;
 
     padding: .1rem !important;
 
     padding: .1rem !important;
 +
    line-height: 1.1rem !important;
 
     margin: auto;
 
     margin: auto;
 
}
 
}
  
−
.section-wrapper iframe#edu-mat{
+
.section-contents.exp-res .two-image-with-desc p{
 +
    text-align: start !important;
 +
}
 +
 
 +
.section-wrapper iframe.edu-mat{
 
     width: 90%;
 
     width: 90%;
−
     height: 100vh;
+
     height: 80vh;
 
     display: block;
 
     display: block;
 
     padding: 4rem;
 
     padding: 4rem;
Line 1,535: Line 1,643:
 
     .card.pi{
 
     .card.pi{
 
         grid-template-columns: 1fr;
 
         grid-template-columns: 1fr;
 +
    }
 +
 +
    .single-image-with-desc {
 +
        display: block;
 +
        padding: 0;
 +
    }
 +
   
 +
   
 +
    .single-image-with-desc img {
 +
        width: 100%;
 +
        margin: auto;
 
     }
 
     }
  
Line 1,593: Line 1,712:
 
     .section-selector ul li a {
 
     .section-selector ul li a {
 
         font-size: 1rem;
 
         font-size: 1rem;
 +
        font-weight: lighter;
 
     }
 
     }
  
Line 1,611: Line 1,731:
 
         padding: 0;
 
         padding: 0;
 
         float: none;
 
         float: none;
 +
    }
 +
 +
    .right-section .section-contents h1 {
 +
        font-size: 1.7rem;
 +
        margin-left: 1rem !important;
 
     }
 
     }
  
Line 1,619: Line 1,744:
  
 
     .right-section .section-contents p {
 
     .right-section .section-contents p {
−
         font-size: .9rem !important;
+
         font-size: 1rem !important;
 
         padding-bottom: 3.5rem;
 
         padding-bottom: 3.5rem;
 +
        line-height: 1.6rem !important;
 
         width: 90%;
 
         width: 90%;
 
     }
 
     }
Line 1,689: Line 1,815:
 
     .card-display.small-cards-2 .card.with-img .img{
 
     .card-display.small-cards-2 .card.with-img .img{
 
         height: fit-content;
 
         height: fit-content;
 +
    }
 +
 +
    .card-display.sub-leader {
 +
        grid-template-columns: 1fr;
 
     }
 
     }
  
Line 1,799: Line 1,929:
 
         height: 36vh;
 
         height: 36vh;
 
         overflow: hidden;
 
         overflow: hidden;
 +
    }
 +
 +
    .two-image-with-desc {
 +
        padding: 1rem 0;
 +
    }
 +
 +
    .two-image-with-desc .im-group{
 +
        grid-template-columns: 1fr;
 
     }
 
     }
  
Line 1,848: Line 1,986:
 
     }
 
     }
  
−
     .card-display p {
+
     .card-display .card .mem-desc p {
−
         text-align: center;
+
         text-align: justify;
−
         font-size: .9rem;
+
         font-size: .8rem !important;
 +
        line-height: normal;
 
     }
 
     }
  
Line 1,856: Line 1,995:
 
         height: 70vh;
 
         height: 70vh;
 
         width: 100%;
 
         width: 100%;
−
    }
 
−
 
−
    .card-display.sub-leader {
 
−
        grid-template-columns: 1fr;
 
 
     }
 
     }
  
Line 1,870: Line 2,005:
 
         grid-template-columns: 1fr;
 
         grid-template-columns: 1fr;
 
     }
 
     }
 +
 +
    .card.pi{
 +
        height: fit-content;
 +
        display: block;
 +
    }
 +
 +
    .card.pi .img{
 +
        height: fit-content;
 +
        position: relative;
 +
    }
 +
 +
    .card.pi .mem-name-pi{
 +
        display: block;
 +
    }
 +
 +
    .card.pi .mem-name-pi h1{
 +
        font-size: 1.3rem;
 +
    }
 +
 +
    .card.pi .mem-name-pi p{
 +
        font-size: .8rem !important;
 +
    }
 +
  
 
     .card-display.small-cards .card {
 
     .card-display.small-cards .card {
Line 1,894: Line 2,052:
 
     .card-display.small-cards-2 .card .ad-desc .desc p{
 
     .card-display.small-cards-2 .card .ad-desc .desc p{
 
         padding: 0 !important;
 
         padding: 0 !important;
 +
        font-size: .8rem !important;
 +
    }
 +
 +
    .card-display.small-cards-2 .card .desc p{
 +
        font-size: .8rem !important;
 
     }
 
     }
  
Line 1,979: Line 2,142:
 
     padding: 0;
 
     padding: 0;
 
     background-color: #f4f4f4;
 
     background-color: #f4f4f4;
−
    color: #000000;
 
−
    font-family: 'Roboto', sans-serif;
 
 
     font-size: 100% !important;
 
     font-size: 100% !important;
 
}
 
}
Line 1,988: Line 2,149:
 
     padding: 0 !important;
 
     padding: 0 !important;
 
}
 
}
 +
 
</style>
 
</style>
  

Latest revision as of 09:39, 21 October 2021

HK_GTC 2021 Homepage