A Pen by Jacob Foster on CodePen.
iDerp iDerp
iDerp
/ custom-twitch-chat-overlay-tmi-js-single-channel.markdown
Created
February 8, 2022 03:25
Custom Twitch Chat Overlay - tmi.js (Single channel)
This file contains hidden or 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="logocon" data-0="opacity: 1; display: flex" data-99="opacity: 0; display: none" data-100="display: none"> | |
| <div class="logo">DogeCoaster</div> | |
| </div> | |
| <div class="hint" data-0="bottom: 10vh" data-100="bottom: -25px">A new take on gambling for Dogecoin</div><div class="hint" data-0="bottom: 2vh" data-100="bottom: -25px">scroll down for info</div> | |
| <!--page contents below--> | |
| <div class="menu">DogeCoaster</div> | |
| <div class="content"><div class="section-light row"><div class="col-md-16 col-md-offset-4 col-sm-20 col-sm-offset-2 col-xs-24"><h2 style="margin-bottom: 30px;">What's DogeCoaster?</h2><p style="font-size: x-large;">DogeCoaster is based off the classic Bitcoin gambling site, Bustabit. Users bet how much DOGE they want and can cash out at any time, unless the multiplier crashes. Multiplier crashes can happen at any time and once they do, unless you cashed out, you lose your entire bet.</p></div></div> | |
| <br> | |
| <div class="section-light row"><div class="col-md-16 col-md-offset-4 col-sm-20 col-sm- |
iDerp
/ discord-user-interface-with-flexbox-and-grid.markdown
Created
July 28, 2019 00:17
Discord User Interface with Flexbox and Grid
iDerp
/ discord-user-interface-with-flexbox-and-grid.markdown
Last active
July 28, 2019 00:15
Discord User Interface with Flexbox and Grid
A basic mock-up of Discord's user interface with flexbox and grid. I will try to update it over time.
A Pen by Nicholas Drzewiecki on CodePen.
This file contains hidden or 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
| <h2>Simple JavaScript image loader</h2> | |
| <div id="svgHolder"> | |
| <h3>Loads .svg files</h3> | |
| </div> | |
| <div id="jpgHolder"> | |
| <h3>Loads .jpg files</h3> | |
| </div> | |
| <div id="pngHolder"> |
Based on the Bootstrap Dashboard Theme.
This intention of this project is to learn from Bootstrap's excellent design choices, not to claim someone else's hard work as my own. This pen in no way is a substitution to the official theme.
My main goal is to explore what concepts make this theme work so well. Learn what is going on behind the scenes and the reasons for its design.
- First Draft: Replication. The draft should look extremely similar to the original.
Based on the Bootstrap Dashboard Theme.
This intention of this project is to learn from Bootstrap's excellent design choices, not to claim someone else's hard work as my own. This pen in no way is a substitution to the official theme.
My main goal is to explore what concepts make this theme work so well. Learn what is going on behind the scenes and the reasons for its design.
- First Draft: Replication. The draft should look extremely similar to the original.
Web App UI, inspired by a Dribbble by Peter Main https://dribbble.com/shots/1779174-Dashboard
This file contains hidden or 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> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | |
| <script> | |
| $(document).ready(() => { | |
| var xmlhttp = new XMLHttpRequest(); | |
| var url = 'https://test.derpbot.us/api/status'; | |
| xmlhttp.onreadystatechange = function () { | |
| if (this.status == 200) { | |
| var data = JSON.parse(this.responseText); | |
| if (data.totalGuilds){ |
This file contains hidden or 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
| <header class="header"> | |
| <hgroup> | |
| <h1>Makisu</h1> | |
| <h2>CSS 3D Dropdown Concept</h2> | |
| </hgroup> | |
| </header> | |
| <section class="demo"> | |
| <dl class="list nigiri"> |
NewerOlder