#Pattern Placeholders Links - LDN Sass #2
Twitter: @jaicab_
CodePen: @jaicab
GitHub: @jaicab
Slides: https://speakerdeck.com/jaicab/pattern-placeholders
the ext() site: http://jaicab.com/ext/
jaicab
/ scrollTo hash fix
Last active
August 29, 2015 13:56
Scroll to top on load unless there's a bookmark link
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
| if(!window.location.hash) scrollTo(0,1); |
jaicab
/ jsbin.fitiq.css
Created
March 14, 2014 09:33
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
| textarea { | |
| margin: 0; | |
| padding: 0; | |
| border: 0; | |
| font-size: 100%; | |
| font: inherit; | |
| vertical-align: baseline; | |
| } | |
| body { |
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 rel="apple-touch-icon" href="/apple-touch-icon-152.png"> | |
| <link rel="icon" type="image/x-icon" href="favicon.ico"> | |
| <meta name="msapplication-TileColor" content="#000"> | |
| <meta name="msapplication-TileImage" contet="/mstile.png"> |
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
| /* | |
| Creates a transparent outline with two colored borders around it. | |
| @param $transparent-width Thickness of the transparent border. | |
| @param $color-width Thickness of the coloured borders. | |
| @param $color Color of the colored borders. | |
| */ | |
| @mixin transparent-outline($transparent-width, $color-width, $color){ | |
| border: $transparent-width solid transparent; | |
| box-shadow: 0 0 0 $color-width $color inset, | |
| 0 0 0 $color-width $color; |
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
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>JS Bin</title> | |
| <style id="jsbin-css"> | |
| .galleries[data-selected*=ui-design] ul:not([data-gallery*=ui-design]), .galleries[data-selected*=branding] ul:not([data-gallery*=branding]), .galleries[data-selected*=illustration] ul:not([data-gallery*=illustration]) { | |
| display: none; | |
| } |
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
| // ---- | |
| // libsass (v3.2.4) | |
| // ---- | |
| $bodyclass: '.bodyclass'; | |
| @mixin classmerge{ | |
| $selector-list: &; | |
| @each $selector in $selector-list { |
jaicab
/ responsive-video.css
Last active
July 29, 2023 02:52
Pure CSS solution for embed videos with an aspect ratio of 16:9
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
| .video-container { | |
| position: relative; | |
| padding-bottom: 56.25%; /*16:9*/ | |
| padding-top: 30px; | |
| height: 0; | |
| overflow: hidden; | |
| } | |
| .video-container iframe, | |
| .video-container object, |
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
| **Title:** | |
| 📸 Introducing Bond Tales - Relive Shared Memories with a Tap! 🤝 [Link Inside] 🌍 | |
| **Body:** | |
| Hey /r/reactnative community! 👋 | |
| We're excited to introduce **Bond Tales**, a unique app designed to visualise your special moments with a friend or group and to cherish these memories together! 🌐 | |
| **Key Features:** | |
| - 📸 **Start a tale:** With one or many friends, a tale will be the home to your memories together. |