A Pen by Vashon Gonzales on CodePen.
Vashon Gonzales VashonG
VashonG
/ chronicle-text-scroll-reveal.markdown
Created
June 21, 2024 06:17
Chronicle - Text Scroll Reveal
A Pen by Vashon Gonzales 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
| <!-- Exported with SnipCSS extension (Ver 1.8.7) --> | |
| <div class="row snipcss-PeFPW"> | |
| <div class="col-12 container-small mb-5"> | |
| <h2 class="text-center container-small">Revenue Potential</h2> | |
| <p class="slogan text-center container-small">Every time your users swipe their card, you will receive <strong><span data-toggle="tooltip" data-html="true" data-placement="top" title="" data-original-title="<p>Earn the following rates based on total spending across your program.</p>$0-$99,999k/mo: 0.50%<br/>$100,000-$999,999/mo: 0.75%<br/>$1,000,000/mo or more: 1.0%" id="style-vJOwn" class="style-vJOwn">up to 1%</span></strong> on all transactions!<br> Use the interactive model below to estimate your revenue potential.</p> | |
| <input type="hidden" id="interchange" value=".01"> | |
| </div> | |
| <div class="col-12 d-flex flex-wrap align-items-center justify-content-md-center"> | |
| <div class="col-12 mb-5 mb-md-0 col-lg-5 d-flex flex-column"> | |
| <form id="cardRevenueForm"> |
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="card"> | |
| <div class="card-content"> | |
| <header class="card-header"> | |
| <div class="card-title"> | |
| <h2 class="card-name">HDFC BUSSINESS MONEYBACK</h2> | |
| <div class="card-number"> | |
| <img src="https://cdn.builder.io/api/v1/image/assets/TEMP/797c696809d4608d2d0c9a5cdc663923c2eaa6ce312e81e14511963c44492937?apiKey=aa19eef6d1f1473ba394866de3aadd86&" alt="Chip icon" class="card-chip" /> | |
| <span class="card-number-text">1234 56XX XXXX 2022</span> | |
| </div> | |
| </div> |
A Pen by Vashon Gonzales 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
| <style> | |
| .container { | |
| max-width: 400px; | |
| margin: 50px auto; | |
| padding: 20px; | |
| border: 1px solid #ccc; | |
| border-radius: 5px; | |
| } | |
| label { |
VashonG
/ cred-app-like-tab-bar-interaction.markdown
Created
March 30, 2024 02:17
Cred App Like Tab Bar Interaction
A tab bar interaction.
A Pen by Vashon Gonzales on CodePen.
VashonG
/ cred-app-like-tab-bar-interaction.markdown
Created
February 17, 2024 04:16
Cred App Like Tab Bar Interaction
A tab bar interaction.
A Pen by Himalaya Singh 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
| <head> | |
| <base href="https://vashong.github.io/widgets/loan-calculator/dist/"> | |
| </head> | |
| <div id="vashon-gonzales-loan-calculator"></div> |
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 data-ryu-obtrusive-scrollbars="true" style=""> | |
| <noscript>You need to enable JavaScript to run this app.</noscript> | |
| <div style="display: none"> Your browser is outdated. Upgrade to an updated browser to use this site. </div> | |
| <div class="Ryu-357"> | |
| <div class="cIq-odc RyuNavigation--b2q"> | |
| <aside class="kSI-oey RyuNavigationDesktopPrimaryContainer--xeh"> | |
| <div data-id="desktop-primary-header" class="RyuFlexRoot-sc-nk769a-jjo ghj-k6j"> | |
| <div class="bmNa-xbo"> | |
| <div class="fQj-g86"> | |
| <div class="jGr-19i RyuNavigationDesktopPrimaryHeaderButton--wmx"> |
NewerOlder