Updated copyright notice in license

Added missing CSS rule for number input

.gitignore

@@ -0,0 +1 @@
+.DS_Store

LICENSE.md

@@ -1,6 +1,7 @@
 The MIT License (MIT)
 
 Copyright (c) 2011-2014 Dave Gamache
+Copyright (c) 2023 Bit Goblin
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -6,8 +6,8 @@ Check out <http://getskeleton.com> for documentation and details.
 ## Getting started
 
 There are a couple ways to download Skeleton:
-- [Download the zip](https://github.com/dhg/Skeleton/releases/download/v2.0.1/Skeleton-2.0.1.zip)
+- [Download the zip](https://github.com/dhg/Skeleton/releases/download/2.0.4/Skeleton-2.0.4.zip)
-- Clone the repo: `git clone https://github.com/dhg/Skeleton.git`
+- Clone the repo: `git clone https://github.com/dhg/Skeleton.git` (Note: this is under active development, so if you're looking for stable and safe, use the zipped download)
 
 
 ### What's in the download?
@@ -15,20 +15,20 @@ There are a couple ways to download Skeleton:
 The download includes Skeleton's CSS, Normalize CSS as a reset, a sample favicon, and an index.html as a starting point.
 
 ```
-skeleton/
+Skeleton/
 ├── index.html
 ├── css/
 │   ├── normalize.min.css
 │   └── skeleton.css
-├── images/
+└── images/
-│   └── favicon.ico
+    └── favicon.ico
-└── README.md
+
 ```
 
 ### Why it's awesome
 
 Skeleton is lightweight and simple. It styles only raw HTML elements (with a few exceptions) and provides a responsive grid. Nothing more.
-- Minified, it's less than a kb
+- Around 400 lines of CSS unminified and with comments
 - It's a starting point, not a UI framework
 - No compiling or installing...just vanilla CSS
 
@@ -49,6 +49,15 @@ The above list is non-exhaustive. Skeleton works perfectly with almost all older
 All parts of Skeleton are free to use and abuse under the [open-source MIT license](https://github.com/dhg/Skeleton/blob/master/LICENSE.md).
 
 
+## Extensions
+
+The following are extensions to Skeleton built by the community. They are not officially supported, but all have been tested and are compatible with v2.0 (exact release noted):
+- [Skeleton on LESS](https://github.com/whatsnewsaes/Skeleton-less): Skeleton built with LESS for easier replacement of grid, color, and media queries. (Last update was to match v2.0.1)
+- [Skeleton on Sass](https://github.com/whatsnewsaes/Skeleton-Sass): Skeleton built with Sass for easier replacement of grid, color, and media queries. (Last update was to match v2.0.1)
+
+Have an extension you want to see here? Just shoot an email to hi@getskeleton.com with your extension!
+
+
 ## Colophon
 
 Skeleton was built using [Sublime Text 3](http://www.sublimetext.com/3) and designed with [Sketch](http://bohemiancoding.com/sketch). The typeface [Raleway](http://www.google.com/fonts/specimen/Raleway) was created by [Matt McInerney](http://matt.cc/) and [Pablo Impallari](http://www.impallari.com/). Code highlighting by Google's [Prettify library](https://code.google.com/p/google-code-prettify/). Icons in the header of the documentation are all derivative work of icons from [The Noun Project](http://thenounproject.com). [Feather](http://thenounproject.com/term/feather/22073) by Zach VanDeHey, [Pen](http://thenounproject.com/term/pen/21163) (with cap) by Ed Harrison, [Pen](http://thenounproject.com/term/pen/32847) (with clicker) by Matthew Hall, and [Watch](http://thenounproject.com/term/watch/48015) by Julien Deveaux.

bower.json

@@ -0,0 +1,21 @@
+{
+  "name": "skeleton",
+  "version": "2.0.4",
+  "homepage": "http://getskeleton.com/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dhg/Skeleton"
+  },
+  "authors": [
+    "Dave Gamache <hello@davegamache.com> (http://davegamache.com/)"
+  ],
+  "description": "Skeleton is a dead-simple, responsive boilerplate to kickstart any responsive project.",
+  "main": "css/skeleton.css",
+  "keywords": [
+    "css",
+    "skeleton",
+    "responsive",
+    "boilerplate"
+  ],
+  "license": "MIT"
+}

css/skeleton.css

@@ -1,10 +1,10 @@
 /*
-* Skeleton V2.0.1
+* Skeleton V2.0.4
 * Copyright 2014, Dave Gamache
 * www.getskeleton.com
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
-* 12/11/2014
+* 12/29/2014
 */
 
 
@@ -33,59 +33,82 @@
   width: 100%;
   max-width: 960px;
   margin: 0 auto;
-  padding: 0 15px; 
+  padding: 0 20px;
   box-sizing: border-box; }
-.row { 
+.column,
-  margin: 0 -15px 2rem; }
+.columns {
-.row .column,        
-.row .columns { 
-  float: left; 
   width: 100%;
-  padding-right: 15px;
+  float: left;
-  padding-left: 15px;
   box-sizing: border-box; }
 
+/* For devices larger than 400px */
+@media (min-width: 400px) {
+  .container {
+    width: 85%;
+    padding: 0; }
+}
+
 /* For devices larger than 550px */
 @media (min-width: 550px) {
+  .container {
+    width: 80%; }
+  .column,
+  .columns {
+    margin-left: 4%; }
+  .column:first-child,
+  .columns:first-child {
+    margin-left: 0; }
 
-  .container { width: 90%; }
+  .one.column,
+  .one.columns                    { width: 4.66666666667%; }
+  .two.columns                    { width: 13.3333333333%; }
+  .three.columns                  { width: 22%;            }
+  .four.columns                   { width: 30.6666666667%; }
+  .five.columns                   { width: 39.3333333333%; }
+  .six.columns                    { width: 48%;            }
+  .seven.columns                  { width: 56.6666666667%; }
+  .eight.columns                  { width: 65.3333333333%; }
+  .nine.columns                   { width: 74.0%;          }
+  .ten.columns                    { width: 82.6666666667%; }
+  .eleven.columns                 { width: 91.3333333333%; }
+  .twelve.columns                 { width: 100%; margin-left: 0; }
 
-  .row .one.column,
+  .one-third.column               { width: 30.6666666667%; }
-  .row .one.columns          { width: 8.33333333334%; }
+  .two-thirds.column              { width: 65.3333333333%; }
-  .row .two.columns          { width: 16.6666666667%; }
-  .row .three.columns        { width: 25%;            }
-  .row .four.columns         { width: 33.3333333334%; }
-  .row .five.columns         { width: 41.6666666667%; }
-  .row .six.columns          { width: 50%;            }
-  .row .seven.columns        { width: 58.3333333334%; }
-  .row .eight.columns        { width: 66.6666666667%; }
-  .row .nine.columns         { width: 75.0%;          }
-  .row .ten.columns          { width: 83.3333333334%; }
-  .row .eleven.columns       { width: 91.6666666667%; }
-  .row .twelve.columns       { width: 100%; margin-left: 0; }
 
-  .row .one-third.column     { width: 33.3333333334%; }
+  .one-half.column                { width: 48%; }
-  .row .two-thirds.column    { width: 66.6666666667%; }
-
-  .row .one-half.column      { width: 50%; }
 
   /* Offsets */
-  .row .offset-by-one        { margin-left: 8.33333333334%; }
+  .offset-by-one.column,
-  .row .offset-by-two        { margin-left: 16.6666666667%; }
+  .offset-by-one.columns          { margin-left: 8.66666666667%; }
-  .row .offset-by-three      { margin-left: 25%;            }
+  .offset-by-two.column,
-  .row .offset-by-four       { margin-left: 33.3333333334%; }
+  .offset-by-two.columns          { margin-left: 17.3333333333%; }
-  .row .offset-by-five       { margin-left: 41.6666666667%; }
+  .offset-by-three.column,
-  .row .offset-by-six        { margin-left: 50%;            }
+  .offset-by-three.columns        { margin-left: 26%;            }
-  .row .offset-by-seven      { margin-left: 58.3333333334%; }
+  .offset-by-four.column,
-  .row .offset-by-eight      { margin-left: 66.6666666667%; }
+  .offset-by-four.columns         { margin-left: 34.6666666667%; }
-  .row .offset-by-nine       { margin-left: 75.0%;          }
+  .offset-by-five.column,
-  .row .offset-by-ten        { margin-left: 83.3333333334%; }
+  .offset-by-five.columns         { margin-left: 43.3333333333%; }
-  .row .offset-by-eleven     { margin-left: 91.6666666667%; }
+  .offset-by-six.column,
+  .offset-by-six.columns          { margin-left: 52%;            }
+  .offset-by-seven.column,
+  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
+  .offset-by-eight.column,
+  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
+  .offset-by-nine.column,
+  .offset-by-nine.columns         { margin-left: 78.0%;          }
+  .offset-by-ten.column,
+  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
+  .offset-by-eleven.column,
+  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }
 
-  .row .offset-by-one-third  { margin-left: 33.3333333334%; }
+  .offset-by-one-third.column,
-  .row .offset-by-two-thirds { margin-left: 66.6666666667%; }
+  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
+  .offset-by-two-thirds.column,
+  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }
 
-  .row .offset-by-one-half   { margin-left: 50%; }
+  .offset-by-one-half.column,
+  .offset-by-one-half.columns     { margin-left: 52%; }
 
 }
 
@@ -108,9 +131,9 @@ body {
 /* Typography
 –––––––––––––––––––––––––––––––––––––––––––––––––– */
 h1, h2, h3, h4, h5, h6 {
-  font-weight: 300;
   margin-top: 0;
-  margin-bottom: 2rem; }
+  margin-bottom: 2rem;
+  font-weight: 300; }
 h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem;}
 h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
 h3 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; }
@@ -148,21 +171,21 @@ input[type="submit"],
 input[type="reset"],
 input[type="button"] {
   display: inline-block;
-  background-color: transparent;
+  height: 38px;
-  border-radius: 4px;
+  padding: 0 30px;
   color: #555;
   text-align: center;
   font-size: 11px;
   font-weight: 600;
-  text-decoration: none;
-  cursor: pointer;
-  border: 1px solid #bbb;
-  height: 38px;
   line-height: 38px;
-  padding: 0 30px;
   letter-spacing: .1rem;
   text-transform: uppercase;
+  text-decoration: none;
   white-space: nowrap;
+  background-color: transparent;
+  border-radius: 4px;
+  border: 1px solid #bbb;
+  cursor: pointer;
   box-sizing: border-box; }
 .button:hover,
 button:hover,
@@ -174,8 +197,8 @@ button:focus,
 input[type="submit"]:focus,
 input[type="reset"]:focus,
 input[type="button"]:focus {
-  border-color: #888;
   color: #333;
+  border-color: #888;
   outline: 0; }
 .button.button-primary,
 button.button-primary,
@@ -183,8 +206,8 @@ input[type="submit"].button-primary,
 input[type="reset"].button-primary,
 input[type="button"].button-primary {
   color: #FFF;
-  border-color: #33C3F0;
+  background-color: #33C3F0;
-  background-color: #33C3F0; }
+  border-color: #33C3F0; }
 .button.button-primary:hover,
 button.button-primary:hover,
 input[type="submit"].button-primary:hover,
@@ -195,41 +218,51 @@ button.button-primary:focus,
 input[type="submit"].button-primary:focus,
 input[type="reset"].button-primary:focus,
 input[type="button"].button-primary:focus {
+  color: #FFF;
   background-color: #1EAEDB;
-  border-color: #1EAEDB;
+  border-color: #1EAEDB; }
-  color: #FFF; }
 
 
 /* Forms
 –––––––––––––––––––––––––––––––––––––––––––––––––– */
 input[type="email"],
+input[type="number"],
 input[type="search"],
 input[type="text"],
+input[type="tel"],
+input[type="url"],
 input[type="password"],
 textarea,
 select {
-  border: 1px solid #D1D1D1;
+  height: 38px;
-  height: 36px;
   padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
+  background-color: #fff;
+  border: 1px solid #D1D1D1;
   border-radius: 4px;
   box-shadow: none;
-  background: #fff; }
+  box-sizing: border-box; }
-/* Removes awkard default styles on some inputs */
+/* Removes awkward default styles on some inputs for iOS */
 input[type="email"],
+input[type="number"],
 input[type="search"],
 input[type="text"],
+input[type="tel"],
+input[type="url"],
+input[type="password"],
 textarea {
   -webkit-appearance: none;
      -moz-appearance: none;
-          appearance: none;
+          appearance: none; }
-}
 textarea {
   min-height: 65px;
   padding-top: 6px;
   padding-bottom: 6px; }
 input[type="email"]:focus,
+input[type="number"]:focus,
 input[type="search"]:focus,
 input[type="text"]:focus,
+input[type="tel"]:focus,
+input[type="url"]:focus,
 input[type="password"]:focus,
 textarea:focus,
 select:focus {
@@ -238,18 +271,18 @@ select:focus {
 label,
 legend {
   display: block;
-  font-weight: 600;
+  margin-bottom: .5rem;
-  margin-bottom: .5rem; }
+  font-weight: 600; }
 fieldset {
-  border-width: 0;
+  padding: 0;
-  padding: 0; }
+  border-width: 0; }
 input[type="checkbox"],
 input[type="radio"] {
   display: inline; }
 label > .label-body {
   display: inline-block;
-  font-weight: normal;
+  margin-left: .5rem;
-  margin-left: .5rem; }
+  font-weight: normal; }
 
 
 /* Lists
@@ -259,8 +292,8 @@ ul {
 ol {
   list-style: decimal inside; }
 ol, ul {
-  margin-top: 0;
+  padding-left: 0;
-  padding-left: 0; }
+  margin-top: 0; }
 ul ul,
 ul ol,
 ol ol,
@@ -277,10 +310,10 @@ code {
   padding: .2rem .5rem;
   margin: 0 .2rem;
   font-size: 90%;
+  white-space: nowrap;
   background: #F1F1F1;
   border: 1px solid #E1E1E1;
-  border-radius: 4px;
+  border-radius: 4px; }
-  white-space: nowrap; }
 pre > code {
   display: block;
   padding: 1rem 1.5rem;
@@ -314,7 +347,6 @@ fieldset {
   margin-bottom: 1.5rem; }
 pre,
 blockquote,
-form,
 dl,
 figure,
 table,
@@ -323,8 +355,6 @@ ul,
 ol,
 form {
   margin-bottom: 2.5rem; }
-p {
-  margin-top: 0; }
 
 
 /* Utilities
@@ -347,8 +377,8 @@ hr {
   margin-top: 3rem;
   margin-bottom: 3.5rem;
   border-width: 0;
-  border-top: 1px solid #E1E1E1;
+  border-top: 1px solid #E1E1E1; }
-}
+
 
 /* Clearing
 –––––––––––––––––––––––––––––––––––––––––––––––––– */

index.html

@@ -15,7 +15,7 @@
 
   <!-- FONT
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
-  <link href='//fonts.googleapis.com/css?family=Raleway:400,300,600' rel='stylesheet' type='text/css'>
+  <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
 
   <!-- CSS
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
@@ -24,7 +24,7 @@
 
   <!-- Favicon
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
-  <link rel="icon" type="image/png" href="images/favicon.png" />
+  <link rel="icon" type="image/png" href="images/favicon.png">
 
 </head>
 <body>