diff --git a/Readme.md b/Readme.md
index 1f868a3..b8cefbc 100644
--- a/Readme.md
+++ b/Readme.md
@@ -1,7 +1,7 @@
![UIKit JavaScript component framework](http://f.cl.ly/items/2j0m3D1l1T041S1k463L/Grab.png)
- UIKit is a small (4kb minified / gzipped) collection of flexible, cohesive, decoupled components for the modern web. With an emphasis on (mostly) structure-only styling making it simple to apply application specific styling. UIKit is _not_ a replacement for larger UI frameworks, nor is it a CSS framework such as Bootstrap. UIKit is still a work in progress, check the [Issues](https://github.com/visionmedia/uikit/issues).
+ UIKit is a small (4kb minified / gzipped) collection of flexible, cohesive, decoupled components for the modern web. With an emphasis on structure-only styling making it simple to apply application specific styling. UIKit is _not_ a replacement for larger UI frameworks, nor is it a CSS framework such as Bootstrap. UIKit is still a work in progress, check the [Issues](https://github.com/visionmedia/uikit/issues).
## Components
diff --git a/build/ui.css b/build/ui.css
index ed1660f..1c8d034 100644
--- a/build/ui.css
+++ b/build/ui.css
@@ -5,9 +5,6 @@
max-width: 600px;
min-width: 250px;
border: 1px solid #eee;
- border-bottom-color: #cacaca;
- -webkit-border-radius: 3px;
- -webkit-box-shadow: 0 1px 4px 0 #ddd;
background: white;
z-index: 1000;
}
@@ -28,36 +25,6 @@
font-size: .9em;
}
-#dialog .actions button {
- padding: 5px;
- background: transparent;
- border: none;
- outline: none;
- cursor: pointer;
-}
-
-#dialog .actions button:hover {
- text-decoration: underline;
-}
-
-#dialog .actions button.main {
- padding: 5px 15px;
- background: -webkit-linear-gradient(top, #fff 20%, #eee);
- border: 1px solid #eee;
- border-bottom-color: #cacaca;
- -webkit-border-radius: 3px;
- outline: none;
-}
-
-#dialog .actions button.main:hover {
- text-decoration: none;
- background: -webkit-linear-gradient(top, #fff 50%, #eee);
-}
-
-#dialog .actions button.main:active {
- background: -webkit-linear-gradient(bottom, #fff 20%, #eee);
-}
-
#dialog.modal {
-webkit-box-shadow: 0 1px 8px 0 black;
}
@@ -159,9 +126,6 @@
max-width: 600px;
min-width: 250px;
border: 1px solid #eee;
- border-bottom-color: #cacaca;
- -webkit-border-radius: 3px;
- -webkit-box-shadow: 0 1px 4px 0 #ddd;
background: white;
z-index: 100;
}
@@ -255,10 +219,7 @@
margin: 0;
padding: 0;
background: white;
- -webkit-border-radius: 5px;
- font-size: 12px;
border: 1px solid rgba(0,0,0,0.2);
- -webkit-box-shadow: 0 10px 30px 0 rgba(0,0,0,0.1), 0 2px 6px 0 rgba(0,0,0,0.2);
}
#context-menu li {
diff --git a/build/ui.js b/build/ui.js
index 3f72900..ec6cc7e 100644
--- a/build/ui.js
+++ b/build/ui.js
@@ -644,7 +644,7 @@ ColorPicker.prototype.spectrumEvents = function(){
, down;
function update(e) {
- var color = self.hueAt(e.offsetY);
+ var color = self.hueAt(e.offsetY - 4);
self.hue(color.toString());
self.emit('change', color);
self._huePos = e.offsetY;
diff --git a/docs/index.html b/docs/index.html
index 751ddd8..4de48d3 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -216,7 +216,7 @@
UIkit
Modern UI components for the modern web
- UIKit is a small collection of flexible, decoupled components for the modern web. With an emphasis on structure-only styling making it it simple to apply application specific styling.
+ UIKit is a small collection of flexible, decoupled jQuery JavaScript components for the modern web. With an emphasis on structure-only styling making it it simple to apply application specific styling.
diff --git a/docs/style.css b/docs/style.css
index 1eba339..1c15c03 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -24,12 +24,58 @@ body {
#card .wrapper .front {
line-height: 150px;
}
+#dialog {
+ border-bottom-color: #cacaca;
+ border-radius: 3px;
+ box-shadow: 0 1px 4px 0 #ddd;
+}
#dialog .card p {
text-align: center;
line-height: 100px;
font-weight: bold;
font-size: 22px;
}
+#dialog .actions button {
+ padding: 5px;
+ background: transparent;
+ border: none;
+ outline: none;
+ cursor: pointer;
+}
+#dialog .actions button:hover {
+ text-decoration: underline;
+}
+#dialog .actions button.main {
+ padding: 5px 15px;
+ background: -webkit-linear-gradient(top, #fff 20%, #eee);
+ border: 1px solid #eee;
+ border-bottom-color: #cacaca;
+ border-radius: 3px;
+ outline: none;
+}
+#dialog .actions button.main:hover {
+ text-decoration: none;
+ background: -webkit-linear-gradient(top, #fff 50%, #eee);
+}
+#dialog .actions button.main:active {
+ background: -webkit-linear-gradient(bottom, #fff 20%, #eee);
+}
+#context-menu {
+ font-size: 12px;
+ -webkit-border-radius: 5px;
+ -webkit-box-shadow: 0 10px 30px 0 rgba(0,0,0,0.1), 0 2px 6px 0 rgba(0,0,0,0.2);
+}
+#context-menu li:first-child a {
+ -webkit-border-radius: 5px 5px 0 0;
+}
+#context-menu li:last-child a {
+ -webkit-border-radius: 0 0 5px 5px;
+}
+.notification {
+ border-bottom-color: #cacaca;
+ -webkit-border-radius: 3px;
+ -webkit-box-shadow: 0 1px 4px 0 #ddd;
+}
#wrapper > section {
margin: 30px 0;
width: 350px;
diff --git a/lib/components/context-menu/context-menu.css b/lib/components/context-menu/context-menu.css
index e6cca57..4aec746 100644
--- a/lib/components/context-menu/context-menu.css
+++ b/lib/components/context-menu/context-menu.css
@@ -7,10 +7,7 @@
margin: 0;
padding: 0;
background: white;
- border-radius: 5px;
- font-size: 12px;
border: 1px solid rgba(0,0,0,0.2);
- box-shadow: 0 10px 30px 0 rgba(0,0,0,0.1), 0 2px 6px 0 rgba(0,0,0,0.2);
}
#context-menu li {
diff --git a/lib/components/dialog/dialog.css b/lib/components/dialog/dialog.css
index 56729dc..be7cbb7 100644
--- a/lib/components/dialog/dialog.css
+++ b/lib/components/dialog/dialog.css
@@ -5,9 +5,6 @@
max-width: 600px;
min-width: 250px;
border: 1px solid #eee;
- border-bottom-color: #cacaca;
- border-radius: 3px;
- box-shadow: 0 1px 4px 0 #ddd;
background: white;
z-index: 1000;
}
@@ -28,36 +25,6 @@
font-size: .9em;
}
-#dialog .actions button {
- padding: 5px;
- background: transparent;
- border: none;
- outline: none;
- cursor: pointer;
-}
-
-#dialog .actions button:hover {
- text-decoration: underline;
-}
-
-#dialog .actions button.main {
- padding: 5px 15px;
- background: linear-gradient(top, #fff 20%, #eee);
- border: 1px solid #eee;
- border-bottom-color: #cacaca;
- border-radius: 3px;
- outline: none;
-}
-
-#dialog .actions button.main:hover {
- text-decoration: none;
- background: linear-gradient(top, #fff 50%, #eee);
-}
-
-#dialog .actions button.main:active {
- background: linear-gradient(bottom, #fff 20%, #eee);
-}
-
#dialog.modal {
box-shadow: 0 1px 8px 0 black;
}
diff --git a/lib/components/notification/notification.css b/lib/components/notification/notification.css
index 56fe4ea..678447b 100644
--- a/lib/components/notification/notification.css
+++ b/lib/components/notification/notification.css
@@ -15,9 +15,6 @@
max-width: 600px;
min-width: 250px;
border: 1px solid #eee;
- border-bottom-color: #cacaca;
- border-radius: 3px;
- box-shadow: 0 1px 4px 0 #ddd;
background: white;
z-index: 100;
}