floating sor
This commit is contained in:
		
							parent
							
								
									e33830e620
								
							
						
					
					
						commit
						b17c6c8ccb
					
				
					 4 changed files with 61 additions and 3 deletions
				
			
		| 
						 | 
				
			
			@ -83,4 +83,45 @@ iframe {
 | 
			
		|||
  height: 16vh;
 | 
			
		||||
  margin-left: -20px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.floating {
 | 
			
		||||
  -webkit-animation-name: floating;
 | 
			
		||||
          animation-name: floating;
 | 
			
		||||
  -webkit-animation-duration: 3s;
 | 
			
		||||
          animation-duration: 3s;
 | 
			
		||||
  -webkit-animation-iteration-count: infinite;
 | 
			
		||||
          animation-iteration-count: infinite;
 | 
			
		||||
  -webkit-animation-timing-function: ease-in-out;
 | 
			
		||||
          animation-timing-function: ease-in-out;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@-webkit-keyframes floating {
 | 
			
		||||
  from {
 | 
			
		||||
    -webkit-transform: translate(0, 0px);
 | 
			
		||||
            transform: translate(0, 0px);
 | 
			
		||||
  }
 | 
			
		||||
  65% {
 | 
			
		||||
    -webkit-transform: translate(0, 10px);
 | 
			
		||||
            transform: translate(0, 10px);
 | 
			
		||||
  }
 | 
			
		||||
  to {
 | 
			
		||||
    -webkit-transform: translate(0, 0px);
 | 
			
		||||
            transform: translate(0, 0px);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@keyframes floating {
 | 
			
		||||
  from {
 | 
			
		||||
    -webkit-transform: translate(0, 0px);
 | 
			
		||||
            transform: translate(0, 0px);
 | 
			
		||||
  }
 | 
			
		||||
  65% {
 | 
			
		||||
    -webkit-transform: translate(0, 10px);
 | 
			
		||||
            transform: translate(0, 10px);
 | 
			
		||||
  }
 | 
			
		||||
  to {
 | 
			
		||||
    -webkit-transform: translate(0, 0px);
 | 
			
		||||
            transform: translate(0, 0px);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
/*# sourceMappingURL=main.css.map */
 | 
			
		||||
| 
						 | 
				
			
			@ -1,6 +1,6 @@
 | 
			
		|||
{
 | 
			
		||||
    "version": 3,
 | 
			
		||||
    "mappings": "AAAA,UAAU;EACN,WAAW,EAAE,QAAQ;EACrB,GAAG,EAAE,2CAA2C;;;AAGpD,AAAA,CAAC,CAAC;EACD,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACP,cAAM,EAAE,OAAO;CAAK;;AAGxB,AAAA,IAAI,CAAC;EACD,WAAW,EAAE,oBAAoB;EACjC,gBAAgB,EAAE,+BAA+B;EACjD,eAAe,EAAE,KAAK;EACtB,qBAAqB,EAAE,KAAK;EAC5B,mBAAmB,EAAE,MAAM;EAC3B,iBAAiB,EAAE,SAAS;EAC5B,cAAc,EAAE,SAAS;CAAG;;AAEhC,AAAA,MAAM,CAAC;EACH,MAAM,EAAE,mBAAmB;CAAG;;AAElC,AAAA,QAAQ,CAAC;EACL,SAAS,EAAE,GAAG;EACd,IAAI,EAAE,CAAC;EACP,WAAW,EAAE,GAAG;EAChB,cAAc,EAAE,IAAI;EACpB,QAAQ,EAAE,QAAQ;EAClB,UAAU,EAAE,MAAM;EAClB,GAAG,EAAE,GAAG;EACR,KAAK,EAAE,IAAI;EACX,cAAc,EAAE,SAAS;CAOA;;AAhB7B,AAWI,QAXI,CAWJ,CAAC,CAAC;EACE,eAAe,EAAE,IAAI;EACrB,KAAK,EAAE,OAAO;CAAG;;AAbzB,AAeI,QAfI,CAeJ,CAAC,AAAA,MAAM,CAAC;EACJ,KAAK,EAAE,SAAS;CAAG;;AAG3B,AAAA,KAAK,CAAC;EACF,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;CAAG;;AAEnB,AAAA,QAAQ,CAAC;EACL,QAAQ,EAAE,QAAQ;EAClB,IAAI,EAAE,GAAG;EACT,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,KAAK;CAAG;;AAGzB,AAAA,QAAQ,CAAC;EACL,SAAS,EAAE,KAAK;EAChB,KAAK,EAAE,KAAK;EACZ,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,aAAa;EACtB,OAAO,EAAE,GAAG;EACZ,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;CAAG;;AAIf,AAAA,QAAQ,CAAC,CAAC,CAAC;EACH,eAAe,EAAE,IAAI;EACrB,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACV,KAAK,EAAE,OAAO;CAAG;;AAEzB,AAAA,QAAQ,CAAC,CAAC,AAAA,MAAM,CAAC;EACb,KAAK,EAAE,SAAS;CAAG;;AAEvB,AAAA,KAAK,CAAC;EACF,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,KAAK;CAAG",
 | 
			
		||||
    "mappings": "AAAA,UAAU;EACN,WAAW,EAAE,QAAQ;EACrB,GAAG,EAAE,2CAA2C;;;AAGpD,AAAA,CAAC,CAAC;EACD,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACP,cAAM,EAAE,OAAO;CAAK;;AAGxB,AAAA,IAAI,CAAC;EACD,WAAW,EAAE,oBAAoB;EACjC,gBAAgB,EAAE,+BAA+B;EACjD,eAAe,EAAE,KAAK;EACtB,qBAAqB,EAAE,KAAK;EAC5B,mBAAmB,EAAE,MAAM;EAC3B,iBAAiB,EAAE,SAAS;EAC5B,cAAc,EAAE,SAAS;CAAG;;AAEhC,AAAA,MAAM,CAAC;EACH,MAAM,EAAE,mBAAmB;CAAG;;AAElC,AAAA,QAAQ,CAAC;EACL,SAAS,EAAE,GAAG;EACd,IAAI,EAAE,CAAC;EACP,WAAW,EAAE,GAAG;EAChB,cAAc,EAAE,IAAI;EACpB,QAAQ,EAAE,QAAQ;EAClB,UAAU,EAAE,MAAM;EAClB,GAAG,EAAE,GAAG;EACR,KAAK,EAAE,IAAI;EACX,cAAc,EAAE,SAAS;CAOA;;AAhB7B,AAWI,QAXI,CAWJ,CAAC,CAAC;EACE,eAAe,EAAE,IAAI;EACrB,KAAK,EAAE,OAAO;CAAG;;AAbzB,AAeI,QAfI,CAeJ,CAAC,AAAA,MAAM,CAAC;EACJ,KAAK,EAAE,SAAS;CAAG;;AAG3B,AAAA,KAAK,CAAC;EACF,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;CAAG;;AAEnB,AAAA,QAAQ,CAAC;EACL,QAAQ,EAAE,QAAQ;EAClB,IAAI,EAAE,GAAG;EACT,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,KAAK;CAAG;;AAGzB,AAAA,QAAQ,CAAC;EACL,SAAS,EAAE,KAAK;EAChB,KAAK,EAAE,KAAK;EACZ,UAAU,EAAE,MAAM;EAClB,OAAO,EAAE,aAAa;EACtB,OAAO,EAAE,GAAG;EACZ,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,GAAG;CAAG;;AAIf,AAAA,QAAQ,CAAC,CAAC,CAAC;EACH,eAAe,EAAE,IAAI;EACrB,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACV,KAAK,EAAE,OAAO;CAAG;;AAEzB,AAAA,QAAQ,CAAC,CAAC,AAAA,MAAM,CAAC;EACb,KAAK,EAAE,SAAS;CAAG;;AAEvB,AAAA,KAAK,CAAC;EACF,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,KAAK;CAAG;;AAGzB,AAAA,SAAS,CAAC;EACN,cAAc,EAAE,QAAQ;EACxB,kBAAkB,EAAE,EAAE;EACtB,yBAAyB,EAAE,QAAQ;EACnC,yBAAyB,EAAE,WAAW;CAAG;;AAE7C,UAAU,CAAV,QAAU;EACN,IAAI;IACA,SAAS,EAAE,iBAAkB;;EACjC,GAAG;IACC,SAAS,EAAE,kBAAkB;;EACjC,EAAE;IACE,SAAS,EAAE,iBAAkB",
 | 
			
		||||
    "sources": [
 | 
			
		||||
        "main.sass"
 | 
			
		||||
    ],
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -76,3 +76,18 @@ iframe
 | 
			
		|||
    width: auto
 | 
			
		||||
    height: 16vh
 | 
			
		||||
    margin-left: -20px
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
.floating
 | 
			
		||||
    animation-name: floating
 | 
			
		||||
    animation-duration: 3s
 | 
			
		||||
    animation-iteration-count: infinite
 | 
			
		||||
    animation-timing-function: ease-in-out
 | 
			
		||||
 | 
			
		||||
@keyframes floating
 | 
			
		||||
    from
 | 
			
		||||
        transform: translate(0,  0px)
 | 
			
		||||
    65%
 | 
			
		||||
        transform: translate(0, 10px)
 | 
			
		||||
    to  
 | 
			
		||||
        transform: translate(0, -0px)
 | 
			
		||||
| 
						 | 
				
			
			@ -1,6 +1,8 @@
 | 
			
		|||
    <div id="main">
 | 
			
		||||
        <section class="socials">
 | 
			
		||||
            <div class="floating">
 | 
			
		||||
                <img class="them" src="./assets/images/them.png" alt="Sor's Icon" srcset="">
 | 
			
		||||
            </div>
 | 
			
		||||
            {{#each social}}
 | 
			
		||||
            <div id="{{name}}" ><a href="https://{{link}}">{{name}}</a></div>
 | 
			
		||||
            {{/each}}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue