A Pen by Jyoti Pathania on CodePen.
Steven TrueSlu
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> | |
| <div class="container center"> | |
| <a href="#login" class="btn btn-large teal modal-trigger">Login</a> | |
| </div> | |
| <div id="login" class="modal "> | |
| <h5 class="modal-close">✕</h5> | |
| <div class="modal-content center"> | |
| <h4>Login Form</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="page"> | |
| <div class="container"> | |
| <div class="left"> | |
| <div class="login">Login</div> | |
| <div class="eula">By logging in you agree to the ridiculously long terms that you didn't bother to read</div> | |
| </div> | |
| <div class="right"> | |
| <svg viewBox="0 0 320 300"> | |
| <defs> | |
| <linearGradient |
TrueSlu
/ header-color-change-scroll.markdown
Created
August 24, 2018 19:22
header color change scroll
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> | |
| <header id="#top"> | |
| <div class="row"> | |
| <div class="large-4 column lpad"> | |
| <div class="logo"> | |
| <span>Some</span> | |
| <span>Forum</span> | |
| </div> | |
| </div> | |
| <div class="large-8 column ar lpad"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="progress"></div> | |
| <div class="center"> | |
| <div id="register"> | |
| <i id="progressButton" class="ion-android-arrow-forward next"></i> | |
| <div id="inputContainer"> | |
| <input id="inputField" required autofocus /> | |
| <label id="inputLabel"></label> |
TrueSlu
/ button-hover-effects-with-box-shadow.markdown
Created
August 25, 2018 05:27
Button hover effects with box-shadow
TrueSlu
/ facebook-emoji-reactions-pure-css.markdown
Created
August 25, 2018 05:28
Facebook Emoji Reactions | Pure CSS
Inspiration Source : http://iconstore-1.ambercreativelab.netdna-cdn.com/wp-content/uploads/2015/12/fb-emoji-featured.png
A Pen by Ashish Bardhan on CodePen.
TrueSlu
/ css-only-order-process-steps.markdown
Created
August 25, 2018 05:28
CSS only order process steps
It's been a while. Just a nice process bar here where you can click on the different steps and be presented with information. The box at the top will also animate depending on the steps.
A Pen by Jamie Coulter on CodePen.
TrueSlu
/ animated-css-gradient-border.markdown
Created
August 25, 2018 05:29
Animated CSS Gradient Border
Inspired by the github universe alert: https://s3-us-west-2.amazonaws.com/s.cdpn.io/173256/github-universe.png
A Pen by Mike Schultz on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id=container> | |
| Make | |
| <div id=flip> | |
| <div><div>wOrK</div></div> | |
| <div><div>lifeStyle</div></div> | |
| <div><div>Everything</div></div> | |
| </div> | |
| AweSoMe! | |
| </div> |
OlderNewer