Skip to content

Commit

Permalink
Merge branch '2.x'
Browse files Browse the repository at this point in the history
Conflicts:
	.gitignore
	README.md
	bourbon/layout.scss
	bower.json
	compass/_vars.scss
	compass/base.scss
	demo/demo-20.html
	demo/demo.html
	demo/index.html
	demo/javascripts/jquery.js
	demo/sass/_functions.scss
	demo/sass/_mixins.scss
	demo/sass/_vars.scss
	demo/sass/base.scss
	demo/sass/layout.scss
	demo/sass/skeleton-fluid.scss
	demo/sass/skeleton-twelve.scss
	demo/sass/skeleton-twenty.scss
	demo/sass/skeleton.scss
	demo/stylesheets/base.css
	demo/stylesheets/layout.css
	demo/stylesheets/skeleton-fluid.css
	demo/stylesheets/skeleton-twelve.css
	demo/stylesheets/skeleton-twenty.css
	demo/stylesheets/skeleton.css
	sass/_vars.scss
	sass/base.scss
	sass/layout.scss
	sass/scss/base.scss
	skeleton/themes/sphenoid/_base.scss
  • Loading branch information
Dennis committed Jul 27, 2014
2 parents 0721fc4 + 0326b24 commit 0e3dd7c
Show file tree
Hide file tree
Showing 145 changed files with 1,705 additions and 10,300 deletions.
2 changes: 2 additions & 0 deletions .gitattributes
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# Auto detect text files and perform LF normalization
* text=auto
11 changes: 7 additions & 4 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
*.gem
*.rbc
.bundle
.config
.sass-cache
<<<<<<< HEAD
compass/css
sass/css
coverage
Expand All @@ -20,3 +17,9 @@ TODO.md
.yardoc
_yardoc
doc/
=======
*.config.scss
skeleton.*
skeleton_template.css
*.html
>>>>>>> 2.x
117 changes: 117 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<<<<<<< HEAD
Skeleton SASS
=============

Expand All @@ -10,10 +11,20 @@ Skeleton SASS is a "SASSification" of Dave Gamache's [Skeleton CSS](http://getsk
* Fluid Grid
* Adjust columns and gutters
* Install Skeleton SASS with bower! `bower install skeleton-sass`
=======
Skeleton Sass 2&beta;
=======================

Skeleton Sass is a "Sassification" of Dave Gamache's [Skeleton CSS](http://getskeleton.com) responsive front-end framework.

* Ability to seamlessly adjust grids by changing the value of variables and compiling &ndash; so easy!
* Install Skeleton Sass with bower! `bower install skeleton-sass`
>>>>>>> 2.x
* [Live demo!](http://atomicpages.github.io/skeleton-sass/demo.html)
* [Extensive documentation](https://github.com/atomicpages/skeleton-sass/wiki)

## TL;DR
<<<<<<< HEAD
Skeleton SASS is a SASS port of Skeleton CSS. Skeleton SASS is primarily written and debugged using the newer "SassyCSS" syntax of SASS which is seen via the `.scss` file extension. If you are familiar and/or prefer the older HAML-style syntax then fret not, we offer this syntax as well which is seen via the `.sass` file extension.

If you are new to SASS altogether then please read our [wiki](https://github.com/atomicpages/skeleton-sass/wiki) for a more in-depth look at Skeleton SASS, information regarding installing ruby and SASS, and many other valuable resources!
Expand Down Expand Up @@ -78,23 +89,98 @@ Both of these versions are organized the same exact way to ensure maximum usabil
For more info on bower, checkout [bower.io](http://bower.io/).

Skeleton Sass is now available on Bower because we want to make your life easier. You can now add Skeleton Sass to any project easily by issuing `bower install skeleton-sass`.
=======
Skeleton Sass is a Sass port of Skeleton CSS. With the new `2.x` series, Skeleton Sass has been trimmed down and a **ton** of new features have been added.

Note: If you are new to Sass altogether then please read our [wiki](https://github.com/atomicpages/skeleton-sass/wiki) for a more in-depth look at Skeleton Sass, information regarding installing ruby and Sass, and many other valuable resources!

// TODO add wiki entry for this...
If you have used Skeleton CSS and you are tired of dealing with vanilla CSS, then transitioning to Skeleton Sass will require minimal effort.

If you've tried other Skeleton CSS ports and had a feeling is dissatisfaction, then look no more. Skeleton Sass is your last stop.

### Upgrading From 1.x
Skeleton Sass 2.x is **not** backwards compatible with Skeleton Sass 1.x due to a major change in the file structure. However, there is a [wiki article](#) that has a detailed explanation for aid in upgrading from Skeleton Sass 1.x to 2.x

### Features
1. DRY
2. Customizable
3. Themeable
4. Bower ready
5. Upgradeable

### Dependencies
The only dependency Skeleton Sass is Sass 3.3.x. Any other libraries like Bourbon, Compass, etc. are up to you to add your installation.

**Warning:** The current stable release of Compass does *not* support Sass 3.3.x. Skeleton Sass uses functions that are a part of that version. There are currently alpha builds of Compass 1.x that do support Sass 3.3.x

### File Overview
* `bin` a directory that contains various executables
* `setup.sh` a simple bash script that aids in setting up Skeleton Sass for first time use
* `theme_setup.sh` a simple bash script that aids in setting up a custom theme for Skeleton Sass
* `upgrade.sh` a simple bash script that aids in upgrading Skeleton Sass
* `core`
* `bones` the directory where theme loaders are located
* `_sphenoid.scss` the default theme
* `_config.scss` the default global configuration variables
* `_dependencies.scss` the default global logic for Skeleton Sass
* `_mixins.scss` the default global mixins for Skeleton Sass
* `skeleton` where the magic happens
* `demo`
* `_base.scss` contains all of the base styles for Skeleton Sass with the exception of the reset styles
* `_bourbon.scss` contains information to import bourbon if it's used
* `_vars.scss` contains project-scoped configuration options
* `sphenoid` the main theme bundled with Skeleton Sass
* `marrow` the directory that contains all of the project-scoped logic (e.g. functions and mixins) for your theme to work
* `_private.scss` a file that contains all of the private logic for the public mixins/functions to work correctly for the `sphenoid` project. Feel free to name this file whatever you want in your own theme.
* `_public.scss` a file that contains all of the public mixins/functions for the `sphenoid` theme. Feel free to name this file whatever you want in your own theme.
* `_base.scss` contains all of the origion base styles for Skeleton Sass (nothing has changed visually)
* `_vars.scss` contains project-scoped configuration options
* `_skeleton.scss` contains all the styles to create the grid like we've used before &ndash; nothing has changed
* `_MYconfig.scss` contains all of your global configuration options that won't be overridden by an update to Skeleton Sass. Just be sure to rename the file before using and adding it as an import to `core/_config.scss`! // WIKI entry needed
* `skeleton_template.scss` contains all of the styles accumulated into a single file. Be sure to rename this file to skeleton.scss before compiling!

### Bower
> Bower is a package manager for the web. It offers a generic, unopinionated solution to the problem of front-end package management, while exposing the package dependency model via an API that can be consumed by a more opinionated build stack. There are no system wide dependencies, no dependencies are shared between different apps, and the dependency tree is flat &mdash; [bower.io](http://bower.io/)
Install Skeleton Sass with bower via command line:

bower install skeleton-sass

You can also install alpha, beta, rc, and previous versions by looking at the [releases](https://github.com/atomicpages/skeleton-sass/releases) page and install with the following syntax:

bower install skeleton-sass#[tag]
bower install skeleton-sass#2.0.0-b2
>>>>>>> 2.x
### Demo
Live demo can be seen here: [http://atomicpages.github.io/skeleton-sass](http://atomicpages.github.io/skeleton-sass). Be sure to resize your browser window and see the responsive goodness in action!

<<<<<<< HEAD
Want to see spin on the default 16-column fixed-grid system? See the [demo here](http://atomicpages.github.io/skeleton-sass/demo.html)!

### Documentation
Skeleton SASS is heavily documented! If you're looking for a detailed description (or just want more info) you can checkout the [wiki pages](https://github.com/atomicpages/skeleton-sass/wiki/_pages)!

##### Resources
* [Installing SASS](https://github.com/atomicpages/skeleton-sass/wiki/Installing-SASS)
=======
### Documentation
Skeleton Sass is heavily documented! If you're looking for a detailed description (or just want more info) you can checkout the [wiki pages](https://github.com/atomicpages/skeleton-sass/wiki/_pages)!

##### Resources
* [Installing Sass](https://github.com/atomicpages/skeleton-sass/wiki/Installing-Sass)
>>>>>>> 2.x
* [Installing Compass](https://github.com/atomicpages/skeleton-sass/wiki/Installing-Compass)
* [Setting up a Fluid Grid](https://github.com/atomicpages/skeleton-sass/wiki/Setting-up-a-Fluid-Grid)


##### Documentation
<<<<<<< HEAD
* [Introduction to Skeleton SASS](https://github.com/atomicpages/skeleton-sass/wiki)
=======
* [Introduction to Skeleton Sass](https://github.com/atomicpages/skeleton-sass/wiki)
>>>>>>> 2.x
* [Function Documentation](https://github.com/atomicpages/skeleton-sass/wiki/Function-Documentation)
* [Variable Documentation](https://github.com/atomicpages/skeleton-sass/wiki/Variable-Documentation)
* [Mixin Documentation](https://github.com/atomicpages/skeleton-sass/wiki/Mixin-Documentation)
Expand All @@ -103,14 +189,19 @@ Skeleton SASS is heavily documented! If you're looking for a detailed descriptio
This project is released under the [MIT license](https://github.com/atomicpages/skeleton-sass/blob/master/license.txt). Who doesn't like free code?

### Find a Bug?
<<<<<<< HEAD
Skeleton SASS is community driven. We will gladly review any issues that you find. If you wish to contribute you'll land a spot in the contributions section of this document!
=======
Skeleton Sass is community driven. We will gladly review any issues that you find. If you wish to contribute you'll land a spot in the contributions section of this document!
>>>>>>> 2.x
##### I Found a Bug/How Can I Help?
* [Create an Issue](https://github.com/atomicpages/skeleton-sass/issues)
* [Fork &amp; Pull](https://github.com/atomicpages/skeleton-sass)

Changelog
---------
<<<<<<< HEAD
### 1.6.3
* Removed local configuration from automatically importing. Now all you need to to is uncomment the line in order for the import to work [issue #13](https://github.com/atomicpages/skeleton-sass/issues/13). [See the wiki](https://github.com/atomicpages/skeleton-sass/wiki/Setting-up-Skeleton-Sass-with-Bower) for information regarding preserving changes when using bower
* Added releases so everyone can install legacy versions of Skeleton Sass via bower starting with this version!
Expand Down Expand Up @@ -235,6 +326,32 @@ Changelog
* Addition of new variables
* Several fixes for non-compass version
* Fixing of `.sass` files
=======
### 2.0.0&beta;
* **Huge** changes to the structure of Skeleton Sass
* Added **_themes_**! All themes are located in `skeleton/` with the default theme called `sphenoid`
* Themes allow you to edit the base styles by default to create a differently styles foundation for your project that doesn't get wiped out when there's an update to Skeleton Sass.
* All core/shared files have been moved to the `core` folder.
* Added shell scripts to aid in setting up Skeleton Sass, upgrading Skeleton Sass (removing unneeded files), and creating a theme for you *nix/OS X users who use command line.
* Scripts for Windows users coming soon
* Manual configuration documentation coming soon
* Completely removed `layout.scss` and added predefined media queries to `skeleton_template.scss`
* New functions and mixins:
* `_calcRU` is a function meant to be used in other functions. This function calculates the relative unit based on the `$base-font-size` and the `$size` passed into the function. These functions depend on `_calcRU`
* `em`
* `rem`
* `percent`
* `relative`
* `em` converts an absolute `px` unit to an `em` unit
* `rem` converts an absolute `px` unit to a `rem` unit
* `percent` converts an absolute `px` unit to a `%` unit
* `relative` converts an absolute `px` unit to the chosen relative unit as defined in `_config.scss` or your hown project configuration.
* **Note:** if more than one relative unit is select then this function will simply spit out the `px` unit. // documentation is needed
* `@font-size` is a *mixin* that handles everything involving `font-size`. // TODO complete this
* Removed `bourbon` and `compass` completely to flatten the dependency tree. At the core, Skeleton Sass never really needed either of these and it was mostly for you. If you wish to use any other frameworks, just add it to a dependency in your `skeleton.scss` file in the project root. Much simpler!
* No more camelCase variables. Based on what I've seen the convention seems to be to use hyphens in variable names.
* A better naming convention has been created that aligns with the human skeleton
>>>>>>> 2.x
Authors
-------
Expand Down
22 changes: 22 additions & 0 deletions _MYconfig.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
// This file stores all of your global project configuration options
// and will not be wiped out by upgrading skeleton sass. Run the
// setup.sh script from command line or follow the steps below
// to manually configure:
//
// MANUAL CONFIGURATON
// 1. Rename _MYconfig.scss to _[projectname].config.scss
// 2. Rename skeleton_template.scss to skeleton.scss
// 3. Navigate to core and edit _config.scss using your favorite
// text editor. Add the following to the end of _config.scss:
// @import " _[projectname].config.scss";
//
// HOW TO RUN AUTOMATED SETUP
// 1. Open terminal and issue the following command:
// bin/setup.sh
// 2. Follow prompts from script

// GLOBAL VARIABLES - include your variables here or alter the predefined vars
// See skeleton file for copyright info

// MY VARIABLES
// $foo: "bar";
62 changes: 62 additions & 0 deletions bin/assets/helper.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
module Helper

def isValidName(name)
if name !~ /[-a-zA-Z0-9_]+/i
return false
end

return true
end

def yesno(question)
puts question
answer = gets.chomp
while answer !~ /y(es)?|n(o)?/i do
puts "Invalid input. #{question} [y/n]"
answer = gets.chomp
yesno(question)
end

if answer =~ /y(es)/i
return true
end

return false
end

def nfqr(question, regex, errorMsg = "Invalid input. #{question}", isValid = nil)
puts isValid != 0 ? question : errorMsg
reply = gets.chomp

if reply =~ regex
return nfqr(question, regex, errorMsg, 0)
end

return reply
end

def cp(file, destination)
if !File.exists?(file) # fail quickly if not found
raise SystemCallError, "#{file} was not found or does not exist"
end

dest = File.open(destination, "w")

File.open(file, "r") do |f|
f.each_line do |line|
dest.puts(line)
end
end

dest.close
end

def gem_available?(name)
Gem::Specification.find_by_name(name)
rescue Gem::LoadError
return false
rescue
return Gem.available?(name)
end

end
35 changes: 35 additions & 0 deletions bin/setup.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
#!/usr/bin/env ruby -w

require_relative("assets/helper")

BEGIN {
if Dir.pwd =~ /bin$/i
Dir.chdir("../")
end
puts "Setup utility working..."
}

include Helper

STDOUT.flush
name = Helper.nfqr("Please enter in the name of your project with no spaces or special characters other than - or _ and press [ENTER]", /[^\w\-]/, "Project name invalid, please try again and press [ENTER]")

puts "Project name is #{name}"
puts "Renaming _MYconfig.scss to _#{name}.config.scss"
File.rename("_MYconfig.scss", "_#{name}.config.scss")

puts "Renaming skeleton_template to skeleton"
if File.exists?("skeleton_template.scss")
File.rename("skeleton_template.scss", "skeleton.scss")
else
puts "skeleton_template.scss does not exist. Skipping..."
end

puts "Adding user override to core/_config.scss"
file = File.open("skeleton/core/_config.scss", "a")
file.puts "@import \"../../_#{name}.config.scss\""
file.close

END {
puts "Setup utility is complete!"
}
40 changes: 40 additions & 0 deletions bin/theme_setup.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
#!/usr/bin/env ruby -w

require_relative("assets/helper")

BEGIN {
if Dir.pwd =~ /bin$/i
Dir.chdir("../")
end
puts "Theme setup utility working..."
}

include Helper

STDOUT.flush
name = Helper.nfqr("Please enter in the name of your theme with no spaces or special characters other than - or _ and press [ENTER]", /[^\w\-]/, "Theme name invalid, please try again and press [ENTER]")
puts "Theme name is #{name}"

if !Dir.exists?("skeleton/themes/#{name}")
Dir.mkdir("skeleton/themes/#{name}")
end

# create files and folders
puts "Creating required files and folders..."
file = File.open("skeleton/themes/_loader.scss", "w")
file.puts("// #{name} theme created with love using Skeleton Sass theme setup script!")
file.puts("\n@import \"#{name}/vars\";")
file.puts("@import \"#{name}/base\";")
file.puts("@import \"sphenoid/skeleton\"; // Override manually if you wish to create your own grid")
puts "skeleton/themes/_loader.scss has been updated... moving on"

if !Dir.exists?("skeleton/themes/#{name}/marrow")
Dir.mkdir("skeleton/themes/#{name}/marrow")
end

Helper.cp("skeleton/themes/demo/_base.scss", "skeleton/themes/#{name}/_base.scss")
Helper.cp("skeleton/themes/demo/_vars.scss", "skeleton/themes/#{name}/_vars.scss")

END {
puts "Theme setup complete!"
}
Loading

0 comments on commit 0e3dd7c

Please sign in to comment.