Difference between revisions of "Template:Hong Kong HKU/Header"

m (Test)
m
 
(13 intermediate revisions by the same user not shown)
Line 20: Line 20:
 
background-attachment:fixed;}
 
background-attachment:fixed;}
 
.container
 
.container
−
{background-color: rgba(255,255,255,0.4);
+
{background-color: rgba(255,255,255,0.6);
−
padding-top:80px;}
+
padding-top:40px;}
 
p {font-size: 16px;}
 
p {font-size: 16px;}
 
h1,h2,h3,h4,h5,h6 {color: #282828;}
 
h1,h2,h3,h4,h5,h6 {color: #282828;}
Line 27: Line 27:
 
h4 {font-size:32px;} h5 {font-size:28px;} h6 {font-size:24px;}
 
h4 {font-size:32px;} h5 {font-size:28px;} h6 {font-size:24px;}
 
</style>
 
</style>
 +
<head>
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/default?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/default?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/custom?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/custom?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
−
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/logo?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
+
<link media="(max-width: 800px)" href="https://2016.igem.org/Team:Hong_Kong_HKU/css/logo-mobile?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 +
<link media="(min-width: 800px)" href="https://2016.igem.org/Team:Hong_Kong_HKU/css/logo?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 +
</head>
 
<body>
 
<body>
 
     <div class="container" align="center">
 
     <div class="container" align="center">
 
         <div class="Logo">
 
         <div class="Logo">
−
       
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-2 -2 504 504" id="PlasmidNav" style="transform-origin: 50% 50% 0px; transform: translate3d(0px, 0px, 0px); touch-action: none; -webkit-user-select: none;">
−
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-2 -2 504 504" id="PlasmidNav" style="transform-origin: 50% 50% 0px; transform: translate3d(0px, 0px, 0px); touch-action: none; -webkit-user-select: none;">
+
            <style>
−
<style>
+
              #PlasmidNav{display:block;margin:0 auto;visibility: hidden;}
−
  #PlasmidNav{display:block;margin:0 auto;}
+
              a{cursor:pointer;outline:none;}
−
  a{cursor:pointer;outline:none;}
+
              .item .sector{transition:all .1s linear;fill:#b2dd75;stroke:#b2dd75;}
−
  .item .sector{transition:all .1s linear;fill:#b2dd75;stroke:#b2dd75;}
+
              .item:hover .sector,.item:focus .sector{fill:#93d66b;}
−
  .item:hover .sector,.item:focus .sector{fill:#93d66b;}
+
              symbol{overflow:visible;}</style>
−
  symbol{overflow:visible;}</style>
+
            <g id="symbolsContainer">
−
<g id="symbolsContainer">
+
                <symbol class="icon icon-" id="icon-1" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Project</text></symbol>
−
    <symbol class="icon icon-" id="icon-1" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Project</text></symbol>
+
                <symbol class="icon icon-" id="icon-2" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Notebook</text></symbol>
−
    <symbol class="icon icon-" id="icon-2" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">HomePage</text></symbol>
+
<symbol class="icon icon-" id="icon-3" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Links</text></symbol>
−
    <symbol class="icon icon-" id="icon-3" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Achievements</text></symbol>
+
<symbol class="icon icon-" id="icon-4" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Attributions</text></symbol>
−
    <symbol class="icon icon-" id="icon-4" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Practices</text></symbol>
+
                <symbol class="icon icon-" id="icon-5" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Practices</text></symbol>
−
    <symbol class="icon icon-" id="icon-5" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">About</text></symbol>
+
<symbol class="icon icon-" id="icon-6" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Achievements</text></symbol>
−
    <symbol class="icon icon-" id="icon-6" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Links</text></symbol>
+
<symbol class="icon icon-" id="icon-7" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">HOMEPAGE</text></symbol>
−
    <symbol class="icon icon-" id="icon-7" viewBox="0 0 35 35"><text fill="#FFFFFF" x="50%" y="50%" dy="-1em" text-anchor="middle" font-size="1em" font-family="sans-serif">Notebook</text></symbol>
+
            </g>
−
</g>
+
            <g id="itemsContainer">
−
<g id="itemsContainer">
+
                    <a class="item" id="item-1" role="link" tabindex="2" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Description" xlink:title=" " transform="matrix(1,0,0,1,0,0)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-1" role="link" tabindex="2" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Description" xlink:title=" " transform="matrix(1,0,0,1,0,0)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-1" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-1" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-2" role="link" tabindex="1" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Notebook" xlink:title=" " transform="matrix(0.62348,-0.78183,0.78183,0.62348,-101.33032108169084,289.58542015232405)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-2" role="link" tabindex="1" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU" xlink:title=" " transform="matrix(0.62348,-0.78183,0.78183,0.62348,-101.33032108169084,289.58542015232405)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72"  class="sector"></path><use xlink:href="#icon-2" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72"  class="sector"></path><use xlink:href="#icon-2" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-3" role="link" tabindex="3" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Links" xlink:title=" " transform="matrix(-0.22252,-0.97492,0.97492,-0.22252,61.89825544362267,549.3622115345345)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-3" role="link" tabindex="3" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Parts" xlink:title=" " transform="matrix(-0.22252,-0.97492,0.97492,-0.22252,61.89825544362267,549.3622115345345)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-3" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-3" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-4" role="link" tabindex="4" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Attributions" xlink:title=" " transform="matrix(-0.90096,-0.43388,0.43388,-0.90096,366.7712821962152,583.7131517549943)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-4" role="link" tabindex="4" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Human_Practices" xlink:title=" " transform="matrix(-0.90096,-0.43388,0.43388,-0.90096,366.7712821962152,583.7131517549943)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-4" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-4" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-5" role="link" tabindex="6" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Human_Practices" xlink:title=" " transform="matrix(-0.90096,0.43388,-0.43388,-0.90096,583.7131517549942,366.7712821962153)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-5" role="link" tabindex="6" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Attributions" xlink:title=" " transform="matrix(-0.90096,0.43388,-0.43388,-0.90096,583.7131517549942,366.7712821962153)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-5" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-5" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-6" role="link" tabindex="7" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Parts" xlink:title=" " transform="matrix(-0.22252,0.97492,-0.97492,-0.22252,549.3622115345344,61.898255443622475)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-6" role="link" tabindex="7" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Links" xlink:title=" " transform="matrix(-0.22252,0.97492,-0.97492,-0.22252,549.3622115345344,61.898255443622475)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-6" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-6" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
                    <a class="item" id="item-7" role="link" tabindex="5" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU" xlink:title=" " transform="matrix(0.62348,0.78183,-0.78183,0.62348,289.5854201523241,-101.33032108169084)" data-svg-origin="250 250" style="">
−
        <a class="item" id="item-7" role="link" tabindex="5" xlink:href="https://2016.igem.org/Team:Hong_Kong_HKU/Notebook" xlink:title=" " transform="matrix(0.62348,0.78183,-0.78183,0.62348,289.5854201523241,-101.33032108169084)" data-svg-origin="250 250" style="">
+
                      <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-7" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
−
          <path fill="none" stroke="#111" d="M499.85,258.72 A250,250 0 0,0 428.5,74.99 l-12.14,11.90 A235,235 0 0,0 388.82,62.87 l-7.75,10.44 A220,220 0 0,1 468.36,223.19 l16.87,-2.07 A235,235 0 0,1 486.86,258.27 L499.85,258.72" class="sector"></path><use xlink:href="#icon-7" width="35" height="35" x="424.4550476074219" y="142.5151824951172" transform="rotate(64.88372093023256 441.9550476074219 160.0151824951172)"></use></a>
+
            </g>
−
</g>
+
            </svg>
−
</svg>
+
−
 
+
 
             <div class="iGEMLogo">
 
             <div class="iGEMLogo">
 
                 <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2016/a/a4/T--Hong_Kong_HKU--Logo_HKU_2460x1860_no_wheel.png" alt="Placeholder image" role="button" id="Logo" onClick="toogleMenu">
 
                 <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2016/a/a4/T--Hong_Kong_HKU--Logo_HKU_2460x1860_no_wheel.png" alt="Placeholder image" role="button" id="Logo" onClick="toogleMenu">
Line 76: Line 77:
 
             </div>
 
             </div>
 
         </div>
 
         </div>
 +
    </div>
 
</body>
 
</body>
 +
<script src="https://2016.igem.org/Team:Hong_Kong_HKU/JS/jQuery?action=raw&ctype=text/javascript" type="text/javascript"></script>
 +
<script src="https://2016.igem.org/Template:Hong_Kong_HKU/js/script?action=raw&ctype=text/javascript" type="text/javascript"></script>
 +
<script src="https://2016.igem.org/Team:Hong_Kong_HKU/JS/TweenMax?action=raw&ctype=text/javascript" type="text/javascript"></script>
 +
<script src="https://2016.igem.org/Team:Hong_Kong_HKU/JS/Nav?action=raw&ctype=text/javascript" type="text/javascript"></script>
 
</html>
 
</html>

Latest revision as of 06:16, 19 October 2016