Difference between revisions of "Team:Uppsala/test2"

 
(3 intermediate revisions by 2 users not shown)
Line 8: Line 8:
 
<html lang="en">
 
<html lang="en">
  
<head>
+
<style>
  <meta charset="UTF-8">
+
  <title>Abraham Swaray</title>
+
  <meta content="width=device-width, initial-scale=1" name="viewport">
+
</head>
+
  
<body>
 
  <div id="container">
 
    <div class="header">
 
      <!--  <h1>Junior Front End Developer</h1> -->
 
    </div>
 
  
    <div class="nav">
 
      <div class="menu-trigger"><i class="fa
 
        bars fa-2x"></i>MENU</div>
 
      <ul class="cleafix">
 
        <li><a href="#" class="home">Home</a></li>
 
        <li><a href="#" class="portfolio">Portfolio</a></li>
 
        <li><a href="#" class="about">About</a></li>
 
        <li><a href="#" class="contact">Contact</a></li>
 
      </ul>
 
    </div>
 
    <div class="FadeIn">
 
      <h1 class="pushdown">Abraham Swaray</h1>
 
      <h2 class="push">Junior Front End Developer</h2>
 
      <a href="#scrolldown"><i class="fa fa-arrow-down fa-2x"></i></a>
 
  
    </div>
 
  
 +
/* thin      = fontnamne-100
 +
    regular  = fontname-400
 +
    medium  = -600
 +
    bold      = -700
  
 +
@font-face{
 +
font-family: 'Raleway-700';
 +
src: url('https://static.igem.org/mediawiki/2018/3/3d/T--Uppsala--Font-Raleway-Bold.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/8/88/T--Uppsala--Font-Raleway-Bold.ttf') format('truetype')   
 +
}
  
<div class ="scroll-down-button">
+
@font-face{
        <section id="section02" class="demo">
+
font-family: 'Raleway-600';
          <h1></h1>
+
src: url('https://static.igem.org/mediawiki/2018/f/fd/T--Uppsala--Font-Raleway-Medium.woff') format('woff'),
          <a href="#scrolldown"><span></span></a>
+
        url('https://static.igem.org/mediawiki/2018/6/65/T--Uppsala--Font-Raleway-Medium.ttf') format('truetype')   
        </section>
+
}
</div>
+
  
 +
@font-face{
 +
font-family: 'Raleway-400';
 +
src: url('https://static.igem.org/mediawiki/2018/9/92/T--Uppsala--Font-Raleway-Regular.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/1/16/T--Uppsala--Font-Raleway-Regular.ttf') format('truetype')   
 +
}
  
 +
@font-face{
 +
font-family: 'Raleway-100';
 +
src: url('https://static.igem.org/mediawiki/2018/8/8a/T--Uppsala--Font-Raleway-Thin.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/a/a0/T--Uppsala--Font-Raleway-Thin.ttf') format('truetype')   
 +
}
  
    <div class="section" id="scrolldown">
+
@font-face{
      <h1>SECTION WITH THE ID SCROLLDOWN</h1>
+
font-family: 'PT-serif-400i';
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
src: url('https://static.igem.org/mediawiki/2018/9/9b/T--Uppsala--Font-PT-Serif-web-Italic.woff') format('woff'),
        <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
        url('https://static.igem.org/mediawiki/2018/2/20/T--Uppsala--Font-PT-Serif-Web-Italic.ttf') format('truetype')   
        <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
}
        <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
    </div>
+
      <hr style="background-color:red;border:1px solid red;">
+
    <div class="section" id="scrolldown1">
+
            <h1>SECTION WITH THE ID SCROLLDOWN1</h1>
+
  
    <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
@font-face{
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
font-family: 'PT-serif-400';
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
src: url('https://static.igem.org/mediawiki/2018/9/97/T--Uppsala--Font-PT-Serif-Web-regular.woff') format('woff'),
    </div>
+
        url('https://static.igem.org/mediawiki/2018/c/c5/T--Uppsala--Font-PT-Serif-web-regular.ttf') format('truetype')   
      <hr style="background-color:red;border:1px solid red;">
+
}
    <div class="section" id="scrolldown2">
+
      <h1>SECTION WITH THE ID SCROLLDOWN2</h1>
+
  
    <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
@font-face{
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
font-family: 'PT-serif-700';
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
src: url('https://static.igem.org/mediawiki/2018/a/af/T--Uppsala--Font-PT-Serif-Bold.woff') format('woff'),
    </div>
+
        url('https://static.igem.org/mediawiki/2018/f/f0/T--Uppsala--Font-PT-Serif-Bold.ttf') format('truetype')   
 +
}
 +
 
 +
@font-face{
 +
font-family: 'Roboto-100';
 +
src: url('https://static.igem.org/mediawiki/2018/b/bb/T--Uppsala--Roboto--Thin.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/f/fe/T--Uppsala--Roboto--Thin.ttf') format('truetype')   
 +
}
 +
 
 +
@font-face{
 +
font-family: 'Roboto-400';
 +
src: url('https://static.igem.org/mediawiki/2018/4/4e/T--Uppsala--Roboto--Regular.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/1/18/T--Uppsala--Fonts--Roboto-Regular.ttf') format('truetype')   
 +
}
 +
 
 +
@font-face{
 +
font-family: 'Roboto-600';
 +
src: url('https://static.igem.org/mediawiki/2018/e/e4/T--Uppsala--Roboto--Medium.woff') format('woff'),
 +
        url('https://static.igem.org/mediawiki/2018/e/e4/T--Uppsala--Roboto--Medium.ttf') format('truetype')   
 +
}
 +
 
 +
 
 +
 
 +
 
 +
h1,   h2 {
 +
    font-family: monospace;
 
      
 
      
    <hr style="background-color:red;border:1px solid red;">
+
}
   
+
 
    <div class="section" id="scrolldown3">
+
 
   
+
h2 {
      <h1>SECTION WITH THE ID SCROLLDOWN3</h1>
+
          font-family: 'Roboto-400' !important;
 +
}
 +
 
 +
</style>
 +
 
  
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
<h1> asdasdkasd </h1>
     
+
<h2> nasasdkasd asdkas </h2>
      <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
        <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
        <p>Proin egestas ex blandit leo dapibus commodo. Praesent bibendum ultricies vestibulum. Praesent rutrum dui turpis. Curabitur sollicitudin finibus lacus non finibus. Praesent sed mauris volutpat, egestas nibh at, maximus mi. Morbi mollis ipsum et urna maximus, at congue sem convallis. Aenean vel est nec sem pretium consectetur eget nec magna. Phasellus a metus urna. Vestibulum at aliquet purus. Mauris sed nibh et augue suscipit aliquet nec non nibh. Nulla bibendum massa lectus, quis placerat ipsum pretium non. Morbi varius, nibh eget congue pellentesque, dui lorem venenatis tellus, non ultrices felis enim et ipsum. Cras dictum viverra eros, quis ullamcorper velit sodales ac. Morbi finibus, leo consectetur malesuada egestas, turpis metus lobortis metus, in tincidunt turpis ipsum sed nisi.</p>
+
    </div>
+
  
  </div>
 
 
 
</body>
 
  
 
</html>
 
</html>

Latest revision as of 23:27, 17 October 2018


asdasdkasd

nasasdkasd asdkas