Skip to content

Instantly share code, notes, and snippets.

View woodcox's full-sized avatar

Rustie woodcox

View GitHub Profile
@woodcox
woodcox / Flip-cards.scss
Last active June 28, 2021 21:13
Generated by SassMeister.com.
$secondary-color: orange;
$accent-color: grey;
$primary-color: blue;
$card-font-color: white;
* {
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@woodcox
woodcox / PureCSS Fullscreen-Navmenu.scss
Last active April 7, 2021 20:58
Generated by SassMeister.com.
$hamburger-menu-size: 60px;
$hamburger-menu-border-radius: .12em;
$hamburger-menu-bg-color: rgba(33, 150, 243, 0.75);
$hamburger-menu-line-height: 2px;
$hover-line-height: $hamburger-menu-line-height;
$main-color: #fefefe;
$hover-color: darken($main-color,
10%);
$content-bg-color: rgba(41, 98, 255, 0.97);
$anim-duration: 0.4s;
@woodcox
woodcox / URL-encode-font-awesome.scss
Last active April 2, 2021 20:53
Generated by SassMeister.com.
/* https://github.com/reskwer/fontAwesome-SCSS */
@mixin fa($fa-icon: $fa-user, $fa-color: $icon-color, $fa-size: $icon-size){
$fa-svg: '<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" style="enable-background:new 596 -596 1792 1792;" xml:space="preserve" fill="#{$fa-color}" #{$fa-icon}';
content: '\00A0';
display: inline-block;
line-height: $fa-size;
width: $fa-size;
height: $fa-size;
background-image: url(svg-encode($fa-svg));
}
@woodcox
woodcox / Navbar.scss
Last active April 2, 2021 20:55
Generated by SassMeister.com.
$white: white;
$magenta: #29de7d;
$black: #0366ee;
$orange: black;
$breakpoints: (
extra-small: 576px,
small: 768px,
);
@woodcox
woodcox / Search-xpand.scss
Last active March 21, 2021 21:42
Generated by SassMeister.com.
*
{
outline: none;
}
html, body
{
height: 100%;
min-height: 100%;
}
@woodcox
woodcox / accordion.scss
Last active March 9, 2021 17:09
Generated by SassMeister.com.
$accordion-color: white;
$accordion-background: blue;
$accordion-font-color: grey;
$accordion-content-background: white;
$accordion-border-color: 1px solid darken($accordion-background, 10%) !default;
$accordion-accent-color: green;
$accordion-border-radius: 4px !default;
$accent-color: #cdcdcd !default;
$accent-accordion-border-color: 1px solid darken($accordion-accent-color, 10%) !default;
$muted-border: 1px solid $accent-color !default;