Wondered if I could use scss to generate a gradient effect by looping through div's and adjusting the color incrementally. This is the result
A Pen by Jason Hodges on CodePen.
/** | |
* A very simple, pragmatic Sass mixin for generating any property with an rgba() colour | |
* and its associated fallback (sourced from the original rgba() colour). | |
* | |
* Do not use if you require a fallback vastly different from the rgba(). | |
* | |
* 1. Strip the alpha value and write out a solid rgb() color. | |
* 2. Drop the red, green, blue, and alpha paramaters into the relevant places. | |
*/ | |
@mixin rgba($property, $red, $green, $blue, $alpha) { |
<div class="container"> | |
<div class="flash"></div> | |
<div class="solid"></div> | |
<div> | |
<ul id="images"> | |
<li><img class="img1" src="" /></li> | |
<li><img class="img1" src="" /></li></ul> | |
</div> | |
</div> |
/* From Sass for Web Designers by Dan Cederholm (A Book Apart No.10) */ | |
@mixin rounded($radius){ | |
-webkit-border-radius: $radius; | |
-moz-border-radius: $radius; | |
border-radius: $radius; | |
} | |
@mixin shadow($x, $y, $blur, $color){ | |
-webkit-box-shadow: $x $y $blur $color; | |
-moz-box-shadow: $x $y $blur $color; |
<!-- the standard loop for all your posts --> | |
{% for post in site.posts %} | |
<!-- check if there is a portfolio thing set inside the Front Matter | |
Note: Do not set "portfolio: false" on normal posts - this is not needed | |
and could lead to problems | |
--> | |
{% if post.portfolio %} | |
<!-- do nothing here --> | |
{% endif %} |
Wondered if I could use scss to generate a gradient effect by looping through div's and adjusting the color incrementally. This is the result
A Pen by Jason Hodges on CodePen.
gem 'jekyll' | |
gem 'github-pages' | |
gem 'algoliasearch' |
@mixin bplowerthan($point){ | |
@media all and (max-width: $point){ | |
@content; | |
} | |
} | |
@mixin bphigherthan($point){ | |
@media all and (min-width: $point){ | |
@content; | |
} | |
} |
%icon { | |
font-family: $icon-font; //set as a variable - it's whatever your icon font name is | |
speak: none; | |
font-weight: normal; | |
font-variant: normal; | |
text-transform: none; | |
line-height: 1; | |
-webkit-font-smoothing: antialiased; | |
} |
# Author: Brandon Mathis | |
# Description: Provides plugins with a method for wrapping and unwrapping input to prevent Markdown and Textile from parsing it. | |
# Purpose: This is useful for preventing Markdown and Textile from being too aggressive and incorrectly parsing in-line HTML. | |
module TemplateWrapper | |
# Wrap input with a <div> | |
def safe_wrap(input) | |
"<div class='bogus-wrapper'><notextile>#{input}</notextile></div>" | |
end | |
# This must be applied after the | |
def unwrap(input) |
## Prepare ################################################################### | |
# Remove RVM | |
rvm implode | |
# Ensure your homebrew is working properly and up to date | |
brew doctor | |
brew update | |
## Install ################################################################### |