initial
This commit is contained in:
+3
@@ -0,0 +1,3 @@
|
||||
.idea
|
||||
node_modules
|
||||
test-results.xml
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
language: node_js
|
||||
|
||||
node_js:
|
||||
- 6
|
||||
|
||||
cache:
|
||||
directories:
|
||||
- node_modules
|
||||
+157
@@ -0,0 +1,157 @@
|
||||
1.2.2
|
||||
-----
|
||||
|
||||
- new option added: `allowEmpty`
|
||||
|
||||
- new option added: `emptyValue`
|
||||
|
||||
- bugfix: accept empty string in set method (@kzmi, [#85](https://github.com/antennaio/jquery-bar-rating/pull/85))
|
||||
|
||||
- bugfix: little CSS fix (@bygiro, [#74](https://github.com/antennaio/jquery-bar-rating/pull/74))
|
||||
|
||||
- bugfix: syntax error within example in documentation (@sorter, [#72](https://github.com/antennaio/jquery-bar-rating/pull/72))
|
||||
|
||||
- added optimal travis config (@amilajack, [#71](https://github.com/antennaio/jquery-bar-rating/pull/71))
|
||||
|
||||
1.2.1
|
||||
-----
|
||||
|
||||
- fixed variable declaration (@schurig, [#68](https://github.com/antennaio/jquery-bar-rating/pull/68))
|
||||
|
||||
- added a note about [R language integration](https://github.com/harveyl888/barRating) to the FAQ (@harveyl888, [#67](https://github.com/antennaio/jquery-bar-rating/issues/67))
|
||||
|
||||
1.2.0
|
||||
-----
|
||||
|
||||
- deprecated `wrapperClass` option removed
|
||||
|
||||
- readonly ratings - `cursor: default` rule added to all themes
|
||||
|
||||
- support for displaying of fractional star ratings (2.5, 3.7, 4.9) - fractional ratings will be marked with `br-fractional` and `br-fractional-*` classes (where * is 10, 20, 30...)
|
||||
|
||||
- reset select field when ratings are cleared
|
||||
|
||||
- `deselectable` option added
|
||||
|
||||
1.1.4
|
||||
-----
|
||||
|
||||
- license file added
|
||||
|
||||
- bugfix: when using "set" method the colors are reversed (@hrishiballal, [#59](https://github.com/antennaio/jquery-bar-rating/issues/59))
|
||||
|
||||
- update selected rating value when tabbing (fixes issue [#51](https://github.com/antennaio/jquery-bar-rating/issues/51))
|
||||
|
||||
- bugfix: click doesn't fire onSelect after changing readonly to true and then to false (@zimarai, [#54](https://github.com/antennaio/jquery-bar-rating/pull/54))
|
||||
|
||||
1.1.3
|
||||
-----
|
||||
|
||||
- new option added: `silent`
|
||||
|
||||
- `readonly` method added
|
||||
|
||||
- namespaced events
|
||||
|
||||
- rating widget - redundant span elements dropped
|
||||
|
||||
- `wrapperClass` option deprecated
|
||||
|
||||
- pass event object to onSelect callback
|
||||
|
||||
- print styles added
|
||||
|
||||
- new option added: `hoverState`
|
||||
|
||||
1.1.2
|
||||
-----
|
||||
|
||||
- AMD and CommonJS compatibility
|
||||
|
||||
- FAQ section added to the docs
|
||||
|
||||
- triggering onSelect callback when using `set` method
|
||||
|
||||
1.1.1
|
||||
-----
|
||||
|
||||
- themes for basic stars in flavors for css, fontawesome and bootstrap (@garygreen, [#35](https://github.com/antennaio/jquery-bar-rating/pull/35))
|
||||
|
||||
- switch to using karma and phantomjs for testing (@garygreen, [#37](https://github.com/antennaio/jquery-bar-rating/pull/37))
|
||||
|
||||
- gulp tasks added
|
||||
|
||||
- minified version with source map file stored in `dist` directory
|
||||
|
||||
1.1.0
|
||||
-----
|
||||
|
||||
- new & improved demo page
|
||||
|
||||
- plugin will create a wrapper div by itself
|
||||
|
||||
- new option added: `wrapperClass`
|
||||
|
||||
- new option added: `fastClicks`
|
||||
|
||||
1.0.6
|
||||
-----
|
||||
|
||||
- vertical rating example
|
||||
|
||||
- bugfix: Knockout doesn't recognize values set by the widget unless we call change() on the select tag. (@akshaykarle, [#25](https://github.com/antennaio/jquery-bar-rating/pull/25))
|
||||
|
||||
- documentation updated with detailed installation instructions
|
||||
|
||||
- `set` method added
|
||||
|
||||
- bugfix: onClear and onDestroy callbacks fixed
|
||||
|
||||
- allow html in ratings (fixes issue [#30](https://github.com/antennaio/jquery-bar-rating/issues/30)), thanks @techmantoolz
|
||||
|
||||
1.0.5
|
||||
-----
|
||||
|
||||
- bugfix: selected option changed by propterties, not attributes (fixes issue [#7](https://github.com/antennaio/jquery-bar-rating/issues/7))
|
||||
|
||||
- `initialRating` setting added
|
||||
|
||||
- prefixed class names:
|
||||
|
||||
`.bar-rating` changed to `.br-widget`
|
||||
|
||||
`.current-rating` changed to `.br-current-rating`
|
||||
|
||||
`.active` changed to `.br-active`
|
||||
|
||||
`.selected` changed to `.br-selected`
|
||||
|
||||
`.current` changed to `.br-current`
|
||||
|
||||
- read-only and reversed rating marked with `.br-readonly` and `.br-reverse` classes respectively
|
||||
|
||||
- bugfix: removed touch detection - improved cross-browser compatibility (fixes issue [#11](https://github.com/antennaio/jquery-bar-rating/issues/11))
|
||||
|
||||
- bower.json added
|
||||
|
||||
1.0.4
|
||||
-----
|
||||
|
||||
- `readonly` setting added
|
||||
- `reverse` setting added
|
||||
|
||||
1.0.3
|
||||
-----
|
||||
- `destroy` method will destroy a single instance of the plugin
|
||||
- `clear` method added
|
||||
- `onClear` and `onDestroy` callbacks added
|
||||
|
||||
1.0.2
|
||||
-----
|
||||
- `.current-rating` div gets updated on mouseenter
|
||||
|
||||
1.0.1
|
||||
-----
|
||||
- new scenario: empty ratings are allowed, user can deselect a previously selected rating (@linko, @antennaio, [#2](https://github.com/antennaio/jquery-bar-rating/pull/2))
|
||||
|
||||
- the plugin will throw an error if called on anything other than `select` field
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
Copyright Kazik Pietruszewski <http://antenna.io/>
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
# jQuery Bar Rating Plugin [](https://travis-ci.org/antennaio/jquery-bar-rating)
|
||||
|
||||
Minimal, light-weight jQuery ratings.
|
||||
|
||||
## How to use
|
||||
|
||||
Documentation and examples of use can be found here:
|
||||
|
||||
[http://antenna.io/demo/jquery-bar-rating/examples/](http://antenna.io/demo/jquery-bar-rating/examples/)
|
||||
|
||||
## How to run tests
|
||||
|
||||
```
|
||||
git clone https://github.com/antennaio/jquery-bar-rating
|
||||
cd jquery-bar-rating
|
||||
npm install
|
||||
npm test
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
This plugin is available under [the MIT license](http://www.opensource.org/licenses/mit-license.php).
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
{
|
||||
"name": "jquery-bar-rating",
|
||||
"version": "1.2.2",
|
||||
"homepage": "http://antenna.io/demo/jquery-bar-rating/examples/",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/antennaio/jquery-bar-rating.git"
|
||||
},
|
||||
"authors": [
|
||||
"Antenna.io <antenna@antenna.io>"
|
||||
],
|
||||
"description": "Minimal, light-weight jQuery ratings.",
|
||||
"main": "jquery.barrating.js",
|
||||
"keywords": [
|
||||
"jquery",
|
||||
"ratings",
|
||||
"rating"
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"jquery": ">=1.7.2"
|
||||
},
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"bower_components",
|
||||
"test",
|
||||
"examples"
|
||||
]
|
||||
}
|
||||
+2
File diff suppressed because one or more lines are too long
Generated
Vendored
+1
File diff suppressed because one or more lines are too long
+54
@@ -0,0 +1,54 @@
|
||||
.br-theme-bars-1to10 .br-widget {
|
||||
height: 50px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-widget a {
|
||||
display: block;
|
||||
width: 12px;
|
||||
padding: 5px 0;
|
||||
height: 28px;
|
||||
float: left;
|
||||
background-color: #fbedd9;
|
||||
margin: 1px;
|
||||
text-align: center;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-widget a.br-active,
|
||||
.br-theme-bars-1to10 .br-widget a.br-selected {
|
||||
background-color: #EDB867;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-widget .br-current-rating {
|
||||
font-size: 20px;
|
||||
line-height: 2;
|
||||
float: left;
|
||||
padding: 0 20px 0 20px;
|
||||
color: #EDB867;
|
||||
font-weight: 400;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-readonly a.br-active,
|
||||
.br-theme-bars-1to10 .br-readonly a.br-selected {
|
||||
background-color: #f2cd95;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-readonly .br-current-rating {
|
||||
color: #f2cd95;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-1to10 .br-widget a {
|
||||
border: 1px solid #b3b3b3;
|
||||
background: white;
|
||||
height: 38px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-widget a.br-active,
|
||||
.br-theme-bars-1to10 .br-widget a.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
.br-theme-bars-1to10 .br-widget .br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
Generated
Vendored
+50
@@ -0,0 +1,50 @@
|
||||
.br-theme-bars-horizontal .br-widget {
|
||||
width: 120px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-widget a {
|
||||
display: block;
|
||||
width: 120px;
|
||||
height: 5px;
|
||||
background-color: #fbedd9;
|
||||
margin: 1px;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-widget a.br-active,
|
||||
.br-theme-bars-horizontal .br-widget a.br-selected {
|
||||
background-color: #EDB867;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-widget .br-current-rating {
|
||||
width: 120px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 2;
|
||||
text-align: center;
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-readonly a.br-active,
|
||||
.br-theme-bars-horizontal .br-readonly a.br-selected {
|
||||
background-color: #f2cd95;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-readonly .br-current-rating {
|
||||
color: #f2cd95;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-horizontal .br-widget a {
|
||||
border: 1px solid #b3b3b3;
|
||||
background: white;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-widget a.br-active,
|
||||
.br-theme-bars-horizontal .br-widget a.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
.br-theme-bars-horizontal .br-widget .br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
.br-theme-bars-movie .br-widget {
|
||||
height: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-movie .br-widget a {
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 8px;
|
||||
float: left;
|
||||
background-color: #bbcefb;
|
||||
margin: 1px;
|
||||
}
|
||||
.br-theme-bars-movie .br-widget a.br-active,
|
||||
.br-theme-bars-movie .br-widget a.br-selected {
|
||||
background-color: #4278F5;
|
||||
}
|
||||
.br-theme-bars-movie .br-widget .br-current-rating {
|
||||
clear: both;
|
||||
width: 240px;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
padding: .5em 0;
|
||||
color: #4278F5;
|
||||
font-weight: 400;
|
||||
}
|
||||
.br-theme-bars-movie .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-movie .br-readonly a.br-active,
|
||||
.br-theme-bars-movie .br-readonly a.br-selected {
|
||||
background-color: #729bf8;
|
||||
}
|
||||
.br-theme-bars-movie .br-readonly .br-current-rating {
|
||||
color: #729bf8;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-movie .br-widget a {
|
||||
border: 1px solid #b3b3b3;
|
||||
background: white;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.br-theme-bars-movie .br-widget a.br-active,
|
||||
.br-theme-bars-movie .br-widget a.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
.br-theme-bars-movie .br-widget .br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
+61
@@ -0,0 +1,61 @@
|
||||
.br-theme-bars-pill .br-widget {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a {
|
||||
padding: 7px 15px;
|
||||
background-color: #bef5e8;
|
||||
color: #50E3C2;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
line-height: 3;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a:first-child {
|
||||
-webkit-border-top-left-radius: 999px;
|
||||
-webkit-border-bottom-left-radius: 999px;
|
||||
-moz-border-radius-topleft: 999px;
|
||||
-moz-border-radius-bottomleft: 999px;
|
||||
border-top-left-radius: 999px;
|
||||
border-bottom-left-radius: 999px;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a:last-child {
|
||||
-webkit-border-top-right-radius: 999px;
|
||||
-webkit-border-bottom-right-radius: 999px;
|
||||
-moz-border-radius-topright: 999px;
|
||||
-moz-border-radius-bottomright: 999px;
|
||||
border-top-right-radius: 999px;
|
||||
border-bottom-right-radius: 999px;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a.br-active,
|
||||
.br-theme-bars-pill .br-widget a.br-selected {
|
||||
background-color: #50E3C2;
|
||||
color: white;
|
||||
}
|
||||
.br-theme-bars-pill .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-pill .br-readonly a.br-active,
|
||||
.br-theme-bars-pill .br-readonly a.br-selected {
|
||||
background-color: #7cead1;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-pill .br-widget a {
|
||||
border: 1px solid #b3b3b3;
|
||||
border-left: none;
|
||||
background: white;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a.br-active,
|
||||
.br-theme-bars-pill .br-widget a.br-selected {
|
||||
border: 1px solid black;
|
||||
border-left: none;
|
||||
background: white;
|
||||
color: black;
|
||||
}
|
||||
.br-theme-bars-pill .br-widget a:first-child {
|
||||
border-left: 1px solid black;
|
||||
}
|
||||
}
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
.br-theme-bars-reversed .br-widget {
|
||||
height: 25px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-reversed .br-widget a {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
float: left;
|
||||
background-color: #bef5e8;
|
||||
margin: 1px;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
color: #50E3C2;
|
||||
text-align: center;
|
||||
}
|
||||
.br-theme-bars-reversed .br-widget a.br-active,
|
||||
.br-theme-bars-reversed .br-widget a.br-selected {
|
||||
background-color: #50E3C2;
|
||||
color: white;
|
||||
}
|
||||
.br-theme-bars-reversed .br-widget .br-current-rating {
|
||||
line-height: 1.3;
|
||||
float: left;
|
||||
padding: 0 20px 0 20px;
|
||||
color: #50E3C2;
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.br-theme-bars-reversed .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-reversed .br-readonly a.br-active,
|
||||
.br-theme-bars-reversed .br-readonly a.br-selected {
|
||||
background-color: #7cead1;
|
||||
}
|
||||
.br-theme-bars-reversed .br-readonly .br-current-rating {
|
||||
color: #7cead1;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-reversed .br-widget a {
|
||||
border: 1px solid #b3b3b3;
|
||||
background: white;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.br-theme-bars-reversed .br-widget a.br-active,
|
||||
.br-theme-bars-reversed .br-widget a.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
.br-theme-bars-reversed .br-widget .br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
.br-theme-bars-square .br-widget {
|
||||
height: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bars-square .br-widget a {
|
||||
display: block;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
float: left;
|
||||
border: 2px solid #bbcefb;
|
||||
background-color: white;
|
||||
margin: 2px;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 2;
|
||||
text-align: center;
|
||||
color: #bbcefb;
|
||||
font-weight: 600;
|
||||
}
|
||||
.br-theme-bars-square .br-widget a.br-active,
|
||||
.br-theme-bars-square .br-widget a.br-selected {
|
||||
border: 2px solid #4278F5;
|
||||
color: #4278F5;
|
||||
}
|
||||
.br-theme-bars-square .br-widget .br-current-rating {
|
||||
clear: both;
|
||||
width: 330px;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
padding: .5em 0;
|
||||
color: #646464;
|
||||
}
|
||||
.br-theme-bars-square .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-bars-square .br-readonly a.br-active,
|
||||
.br-theme-bars-square .br-readonly a.br-selected {
|
||||
border: 2px solid #729bf8;
|
||||
color: #729bf8;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bars-square .br-widget a {
|
||||
border: 2px solid #b3b3b3;
|
||||
color: #b3b3b3;
|
||||
}
|
||||
.br-theme-bars-square .br-widget a.br-active,
|
||||
.br-theme-bars-square .br-widget a.br-selected {
|
||||
border: 2px solid black;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
Generated
Vendored
+38
@@ -0,0 +1,38 @@
|
||||
.br-theme-bootstrap-stars .br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget a {
|
||||
font: normal normal normal 18px/1 'Glyphicons Halflings';
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget a:after {
|
||||
content: '\e006';
|
||||
color: #d2d2d2;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget a.br-active:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget a.br-selected:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget .br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-bootstrap-stars .br-widget a:after {
|
||||
content: '\e007';
|
||||
color: black;
|
||||
}
|
||||
.br-theme-bootstrap-stars .br-widget a.br-active:after,
|
||||
.br-theme-bootstrap-stars .br-widget a.br-selected:after {
|
||||
content: '\e006';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
+39
@@ -0,0 +1,39 @@
|
||||
.br-theme-css-stars .br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-css-stars .br-widget a {
|
||||
text-decoration: none;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
float: left;
|
||||
font-size: 23px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.br-theme-css-stars .br-widget a:after {
|
||||
content: "\2605";
|
||||
color: #d2d2d2;
|
||||
}
|
||||
.br-theme-css-stars .br-widget a.br-active:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-css-stars .br-widget a.br-selected:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-css-stars .br-widget .br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
.br-theme-css-stars .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-css-stars .br-widget a:after {
|
||||
content: "\2606";
|
||||
color: black;
|
||||
}
|
||||
.br-theme-css-stars .br-widget a.br-active:after,
|
||||
.br-theme-css-stars .br-widget a.br-selected:after {
|
||||
content: "\2605";
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
Generated
Vendored
+56
@@ -0,0 +1,56 @@
|
||||
.br-theme-fontawesome-stars-o .br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a {
|
||||
font: normal normal normal 20px/1 FontAwesome;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a:after {
|
||||
content: '\f006';
|
||||
color: #d2d2d2;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-active:after {
|
||||
content: '\f005';
|
||||
color: #50E3C2;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: #50E3C2;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-fractional:after {
|
||||
content: '\f123';
|
||||
color: #50E3C2;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget .br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-reverse a.br-fractional {
|
||||
display: inline-block;
|
||||
transform: scaleX(-1);
|
||||
-moz-transform: scaleX(-1);
|
||||
-webkit-transform: scaleX(-1);
|
||||
filter: FlipH;
|
||||
-ms-filter: "FlipH";
|
||||
}
|
||||
@media print {
|
||||
.br-theme-fontawesome-stars-o .br-widget a:after {
|
||||
content: '\f006';
|
||||
color: black;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-active:after,
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: black;
|
||||
}
|
||||
.br-theme-fontawesome-stars-o .br-widget a.br-fractional:after {
|
||||
content: '\f123';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
Generated
Vendored
+38
@@ -0,0 +1,38 @@
|
||||
.br-theme-fontawesome-stars .br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget a {
|
||||
font: normal normal normal 20px/1 FontAwesome;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget a:after {
|
||||
content: '\f005';
|
||||
color: #d2d2d2;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget a.br-active:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget a.br-selected:after {
|
||||
color: #EDB867;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget .br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-readonly a {
|
||||
cursor: default;
|
||||
}
|
||||
@media print {
|
||||
.br-theme-fontawesome-stars .br-widget a:after {
|
||||
content: '\f006';
|
||||
color: black;
|
||||
}
|
||||
.br-theme-fontawesome-stars .br-widget a.br-active:after,
|
||||
.br-theme-fontawesome-stars .br-widget a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
+156
@@ -0,0 +1,156 @@
|
||||
/* Center ratings in container */
|
||||
.box-example-1to10 .br-wrapper {
|
||||
width: 210px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -105px;
|
||||
left: 50%;
|
||||
}
|
||||
.box-example-movie .br-wrapper {
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -125px;
|
||||
left: 50%;
|
||||
}
|
||||
.box-example-square .br-wrapper {
|
||||
width: 190px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -95px;
|
||||
left: 50%;
|
||||
}
|
||||
.box-example-pill .br-wrapper {
|
||||
width: 232px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -116px;
|
||||
left: 50%;
|
||||
}
|
||||
.box-example-reversed .br-wrapper {
|
||||
padding-top: 1.3em;
|
||||
width: 356px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -178px;
|
||||
left: 50%;
|
||||
}
|
||||
.box-example-horizontal .br-wrapper {
|
||||
width: 120px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -60px;
|
||||
left: 50%;
|
||||
}
|
||||
/* Display star ratings */
|
||||
.star-ratings h1 {
|
||||
font-size: 1.5em;
|
||||
line-height: 2;
|
||||
margin-top: 3em;
|
||||
color: #757575;
|
||||
}
|
||||
.star-ratings p {
|
||||
margin-bottom: 3em;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.star-ratings h1,
|
||||
.star-ratings p {
|
||||
text-align: center;
|
||||
}
|
||||
.star-ratings .stars {
|
||||
width: 120px;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
padding: 0 95px;
|
||||
}
|
||||
.star-ratings .stars .title {
|
||||
font-size: 14px;
|
||||
color: #cccccc;
|
||||
line-height: 3;
|
||||
}
|
||||
.star-ratings .stars select {
|
||||
width: 120px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.star-ratings .stars-example-fontawesome,
|
||||
.star-ratings .stars-example-css,
|
||||
.star-ratings .stars-example-bootstrap {
|
||||
float: left;
|
||||
}
|
||||
.star-ratings .stars-example-fontawesome-o {
|
||||
width: 200px;
|
||||
}
|
||||
.star-ratings .stars-example-fontawesome-o select {
|
||||
width: 200px;
|
||||
}
|
||||
.start-ratings-main {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
/* Boxes */
|
||||
.box {
|
||||
width: 100%;
|
||||
float: left;
|
||||
margin: 1em 0;
|
||||
}
|
||||
.box .box-header {
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
padding: .5em 0;
|
||||
}
|
||||
.box .box-body {
|
||||
padding-top: 2em;
|
||||
height: 85px;
|
||||
/* rating widgets will be absolutely centered relative to box body */
|
||||
position: relative;
|
||||
}
|
||||
.box select {
|
||||
width: 120px;
|
||||
margin: 10px auto 0 auto;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
}
|
||||
.box-large .box-body {
|
||||
padding-top: 2em;
|
||||
height: 120px;
|
||||
}
|
||||
.box-orange .box-header {
|
||||
background-color: #edb867;
|
||||
color: white;
|
||||
}
|
||||
.box-orange .box-body {
|
||||
background-color: white;
|
||||
border: 2px solid #f5d8ab;
|
||||
border-top: 0;
|
||||
}
|
||||
.box-green .box-header {
|
||||
background-color: #50e3c2;
|
||||
color: white;
|
||||
}
|
||||
.box-green .box-body {
|
||||
background-color: white;
|
||||
border: 2px solid #92eed9;
|
||||
border-top: 0;
|
||||
}
|
||||
.box-blue .box-header {
|
||||
background-color: #4278f5;
|
||||
color: white;
|
||||
}
|
||||
.box-blue .box-body {
|
||||
background-color: white;
|
||||
border: 2px solid #8bacf9;
|
||||
border-top: 0;
|
||||
}
|
||||
@media print {
|
||||
.star-ratings h1 {
|
||||
color: black;
|
||||
}
|
||||
.star-ratings .stars .title {
|
||||
color: black;
|
||||
}
|
||||
.box-orange .box-header,
|
||||
.box-green .box-header,
|
||||
.box-blue .box-header {
|
||||
background-color: transparent;
|
||||
color: black;
|
||||
}
|
||||
.box-orange .box-body,
|
||||
.box-green .box-body,
|
||||
.box-blue .box-body {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
+578
@@ -0,0 +1,578 @@
|
||||
/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
|
||||
html {
|
||||
color: #222;
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
::-moz-selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
::selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
}
|
||||
fieldset {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
textarea {
|
||||
resize: vertical;
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: 400;
|
||||
}
|
||||
.browserupgrade {
|
||||
margin: 0;
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
padding: 1em 2em;
|
||||
text-align: center;
|
||||
}
|
||||
.browserupgrade a {
|
||||
color: #000;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.browserupgrade a:hover {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
/* Dead Simple Grid (c) 2012 Vladimir Agafonkin */
|
||||
.col {
|
||||
padding: 0 1em;
|
||||
}
|
||||
.row .row {
|
||||
margin: 0 -1em;
|
||||
}
|
||||
.row:before,
|
||||
.row:after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
.row:after {
|
||||
clear: both;
|
||||
}
|
||||
.col {
|
||||
float: left;
|
||||
width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/* ==========================================================================
|
||||
Author's custom styles
|
||||
========================================================================== */
|
||||
body {
|
||||
font-family: "Lato", sans-serif;
|
||||
color: #757575;
|
||||
font-weight: 300;
|
||||
font-size: 1.25em;
|
||||
/* 20px */
|
||||
line-height: 1.6;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
font-weight: 400;
|
||||
color: #2d2d2d;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2.8em;
|
||||
/* 56px */
|
||||
margin: 0;
|
||||
}
|
||||
a {
|
||||
color: #50e3c2;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
a:hover,
|
||||
a:focus {
|
||||
color: #1cb18f;
|
||||
text-decoration: none;
|
||||
}
|
||||
p {
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
.warning {
|
||||
color: red;
|
||||
}
|
||||
.github {
|
||||
background-image: url("../img/github.png");
|
||||
position: fixed;
|
||||
right: 25px;
|
||||
top: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
opacity: 0.3;
|
||||
-webkit-transition: opacity .2s;
|
||||
transition: opacity .2s;
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
.github {
|
||||
background-image: url("../img/github@2x.png");
|
||||
background-size: 50px 50px;
|
||||
}
|
||||
}
|
||||
.github:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
.antennaio {
|
||||
background-image: url("../img/antenna.png");
|
||||
background-repeat: no-repeat;
|
||||
color: #cecece;
|
||||
width: 280px;
|
||||
height: 60px;
|
||||
display: block;
|
||||
margin: auto;
|
||||
font-weight: 400;
|
||||
font-size: 0.6em;
|
||||
/* 12px */
|
||||
line-height: 5.5;
|
||||
letter-spacing: 2px;
|
||||
margin-bottom: 7em;
|
||||
-webkit-transition: color .2s;
|
||||
transition: color .2s;
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
.antennaio {
|
||||
background-image: url("../img/antenna@2x.png");
|
||||
background-size: 60px 60px;
|
||||
}
|
||||
}
|
||||
.antennaio:hover {
|
||||
color: #757575;
|
||||
}
|
||||
.antennaio span {
|
||||
padding: 0 0 0 70px;
|
||||
}
|
||||
.bars {
|
||||
background-image: url("../img/bars.png");
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
.bars {
|
||||
background-image: url("../img/bars@2x.png");
|
||||
background-size: 80px 80px;
|
||||
}
|
||||
}
|
||||
.section {
|
||||
padding: 2em 0;
|
||||
}
|
||||
.section-intro {
|
||||
text-align: center;
|
||||
margin: 3em 0 4em 0;
|
||||
max-height: 9999px;
|
||||
/* no font boosting please */
|
||||
}
|
||||
.section-intro h1 {
|
||||
line-height: 2.4;
|
||||
}
|
||||
.section-intro p {
|
||||
max-width: 560px;
|
||||
margin: auto;
|
||||
}
|
||||
.section-intro p.tagline {
|
||||
font-size: 0.8em;
|
||||
/* 16px */
|
||||
color: #a8a8a8;
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.section-examples {
|
||||
position: relative;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
.examples {
|
||||
margin: auto;
|
||||
width: 980px;
|
||||
padding: 3em 0;
|
||||
}
|
||||
.examples .col {
|
||||
width: 50%;
|
||||
}
|
||||
.examples .col-fullwidth {
|
||||
width: 100%;
|
||||
}
|
||||
.section-docs {
|
||||
margin: 3em 0;
|
||||
}
|
||||
.docs {
|
||||
width: 800px;
|
||||
margin: auto;
|
||||
max-height: 9999px;
|
||||
/* no font boosting please */
|
||||
}
|
||||
.docs header {
|
||||
text-align: center;
|
||||
padding: 1em 0;
|
||||
letter-spacing: 3px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
color: white;
|
||||
width: 100%;
|
||||
font-size: .9em;
|
||||
}
|
||||
.docs .how-to-use header,
|
||||
.docs .callbacks header,
|
||||
.docs .download header {
|
||||
background: #4278f5;
|
||||
}
|
||||
.docs .how-to-use strong,
|
||||
.docs .callbacks strong,
|
||||
.docs .download strong {
|
||||
color: #4278f5;
|
||||
}
|
||||
.docs .how-to-use a,
|
||||
.docs .callbacks a,
|
||||
.docs .download a {
|
||||
color: #4278f5;
|
||||
}
|
||||
.docs .how-to-use a:hover,
|
||||
.docs .callbacks a:hover,
|
||||
.docs .download a:hover {
|
||||
color: #0b43c6;
|
||||
}
|
||||
.docs .how-to-use pre,
|
||||
.docs .callbacks pre,
|
||||
.docs .download pre {
|
||||
background: white;
|
||||
border-left: 2px solid #4278f5;
|
||||
padding: 0 2em;
|
||||
}
|
||||
.docs .how-to-use code,
|
||||
.docs .callbacks code,
|
||||
.docs .download code {
|
||||
font-family: "Source Code Pro", sans-serif;
|
||||
font-size: 0.9em;
|
||||
/* 18px */
|
||||
color: #4278f5;
|
||||
}
|
||||
.docs .configuration header,
|
||||
.docs .faq header {
|
||||
background: #50e3c2;
|
||||
}
|
||||
.docs .configuration strong,
|
||||
.docs .faq strong {
|
||||
color: #50e3c2;
|
||||
}
|
||||
.docs .configuration a,
|
||||
.docs .faq a {
|
||||
color: #50e3c2;
|
||||
}
|
||||
.docs .configuration a:hover,
|
||||
.docs .faq a:hover {
|
||||
color: #1cb18f;
|
||||
}
|
||||
.docs .configuration pre,
|
||||
.docs .faq pre {
|
||||
background: white;
|
||||
border-left: 2px solid #50e3c2;
|
||||
padding: 0 2em;
|
||||
}
|
||||
.docs .configuration code,
|
||||
.docs .faq code {
|
||||
font-family: "Source Code Pro", sans-serif;
|
||||
font-size: 0.9em;
|
||||
/* 18px */
|
||||
color: #50e3c2;
|
||||
}
|
||||
.docs .license header,
|
||||
.docs .methods header {
|
||||
background: #edb867;
|
||||
}
|
||||
.docs .license strong,
|
||||
.docs .methods strong {
|
||||
color: #edb867;
|
||||
}
|
||||
.docs .license a,
|
||||
.docs .methods a {
|
||||
color: #edb867;
|
||||
}
|
||||
.docs .license a:hover,
|
||||
.docs .methods a:hover {
|
||||
color: #d58b19;
|
||||
}
|
||||
.docs .license pre,
|
||||
.docs .methods pre {
|
||||
background: white;
|
||||
border-left: 2px solid #edb867;
|
||||
padding: 0 2em;
|
||||
}
|
||||
.docs .license code,
|
||||
.docs .methods code {
|
||||
font-family: "Source Code Pro", sans-serif;
|
||||
font-size: 0.9em;
|
||||
/* 18px */
|
||||
color: #edb867;
|
||||
}
|
||||
.docs .instructions {
|
||||
padding: 2em 3em;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
.docs .faq p {
|
||||
margin: 0 0 .5em 0;
|
||||
}
|
||||
.docs .faq .question {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
.docs .faq .question:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.controls {
|
||||
position: absolute;
|
||||
top: -23px;
|
||||
left: 50%;
|
||||
margin-left: -190px;
|
||||
}
|
||||
.controls a {
|
||||
display: block;
|
||||
width: 150px;
|
||||
background-color: #50e3c2;
|
||||
color: white;
|
||||
float: left;
|
||||
padding: .3em 1em .5em 1em;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
-webkit-transition: background-color 0.2s;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
.controls a:hover {
|
||||
background-color: #3adfba;
|
||||
}
|
||||
.controls a:focus {
|
||||
color: #d4f8f0;
|
||||
background-color: #199b7e;
|
||||
}
|
||||
.controls a.rating-enable {
|
||||
-webkit-border-top-left-radius: 999px;
|
||||
-webkit-border-bottom-left-radius: 999px;
|
||||
-moz-border-radius-topleft: 999px;
|
||||
-moz-border-radius-bottomleft: 999px;
|
||||
border-top-left-radius: 999px;
|
||||
border-bottom-left-radius: 999px;
|
||||
}
|
||||
.controls a.rating-disable {
|
||||
-webkit-border-top-right-radius: 999px;
|
||||
-webkit-border-bottom-right-radius: 999px;
|
||||
-moz-border-radius-topright: 999px;
|
||||
-moz-border-radius-bottomright: 999px;
|
||||
border-top-right-radius: 999px;
|
||||
border-bottom-right-radius: 999px;
|
||||
}
|
||||
.controls a:last-child {
|
||||
border-left: 0;
|
||||
}
|
||||
.controls a.deactivated {
|
||||
background: #20c7a1;
|
||||
color: white;
|
||||
}
|
||||
/* ==========================================================================
|
||||
Media Queries
|
||||
========================================================================== */
|
||||
@media print {
|
||||
body {
|
||||
color: black;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
color: black;
|
||||
}
|
||||
.controls,
|
||||
.github,
|
||||
.antennaio {
|
||||
display: none;
|
||||
}
|
||||
.section-intro {
|
||||
margin: 1em 0 2em 0;
|
||||
}
|
||||
.section-intro p.tagline {
|
||||
color: black;
|
||||
}
|
||||
.section-examples {
|
||||
background: transparent;
|
||||
}
|
||||
.section-examples .examples {
|
||||
padding: 1em 0;
|
||||
}
|
||||
.section-docs {
|
||||
margin: 1em 0;
|
||||
}
|
||||
.docs .how-to-use a,
|
||||
.docs .callbacks a,
|
||||
.docs .download a,
|
||||
.docs .configuration a,
|
||||
.docs .faq a,
|
||||
.docs .license a,
|
||||
.docs .methods a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
.docs .how-to-use a:hover,
|
||||
.docs .callbacks a:hover,
|
||||
.docs .download a:hover,
|
||||
.docs .configuration a:hover,
|
||||
.docs .faq a:hover,
|
||||
.docs .license a:hover,
|
||||
.docs .methods a:hover {
|
||||
color: black;
|
||||
}
|
||||
.docs .how-to-use header,
|
||||
.docs .callbacks header,
|
||||
.docs .download header,
|
||||
.docs .configuration header,
|
||||
.docs .faq header,
|
||||
.docs .license header,
|
||||
.docs .methods header {
|
||||
background: transparent;
|
||||
color: black;
|
||||
}
|
||||
.docs .how-to-use code,
|
||||
.docs .callbacks code,
|
||||
.docs .download code,
|
||||
.docs .configuration code,
|
||||
.docs .faq code,
|
||||
.docs .license code,
|
||||
.docs .methods code,
|
||||
.docs .how-to-use strong,
|
||||
.docs .callbacks strong,
|
||||
.docs .download strong,
|
||||
.docs .configuration strong,
|
||||
.docs .faq strong,
|
||||
.docs .license strong,
|
||||
.docs .methods strong {
|
||||
color: black;
|
||||
}
|
||||
.docs .how-to-use pre,
|
||||
.docs .callbacks pre,
|
||||
.docs .download pre,
|
||||
.docs .configuration pre,
|
||||
.docs .faq pre,
|
||||
.docs .license pre,
|
||||
.docs .methods pre {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.docs .how-to-use .instructions,
|
||||
.docs .callbacks .instructions,
|
||||
.docs .download .instructions,
|
||||
.docs .configuration .instructions,
|
||||
.docs .faq .instructions,
|
||||
.docs .license .instructions,
|
||||
.docs .methods .instructions {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
/* ==========================================================================
|
||||
Helper classes
|
||||
========================================================================== */
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden;
|
||||
}
|
||||
.visuallyhidden {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
.visuallyhidden.focusable:active,
|
||||
.visuallyhidden.focusable:focus {
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
width: auto;
|
||||
}
|
||||
.invisible {
|
||||
visibility: hidden;
|
||||
}
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
/* ==========================================================================
|
||||
Print styles
|
||||
========================================================================== */
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
pre,
|
||||
blockquote {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
+427
@@ -0,0 +1,427 @@
|
||||
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
|
||||
|
||||
/**
|
||||
* 1. Set default font family to sans-serif.
|
||||
* 2. Prevent iOS text size adjust after orientation change, without disabling
|
||||
* user zoom.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove default margin.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Correct `block` display not defined for any HTML5 element in IE 8/9.
|
||||
* Correct `block` display not defined for `details` or `summary` in IE 10/11
|
||||
* and Firefox.
|
||||
* Correct `block` display not defined for `main` in IE 11.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
menu,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct `inline-block` display not defined in IE 8/9.
|
||||
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent modern browsers from displaying `audio` without controls.
|
||||
* Remove excess height in iOS 5 devices.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address `[hidden]` styling not present in IE 8/9/10.
|
||||
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
*/
|
||||
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Links
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background color from active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* Improve readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address styling not present in Safari and Chrome.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address variable `h1` font-size and margin within `section` and `article`
|
||||
* contexts in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address styling not present in IE 8/9.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove border when inside `a` element in IE 8/9/10.
|
||||
*/
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct overflow not hidden in IE 9/10/11.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Address margin not present in IE 8/9 and Safari.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address differences between Firefox and other browsers.
|
||||
*/
|
||||
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Contain overflow in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address odd `em`-unit font size rendering in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
* styling of `select`, unless a `border` property is set.
|
||||
*/
|
||||
|
||||
/**
|
||||
* 1. Correct color not being inherited.
|
||||
* Known issue: affects color of disabled elements.
|
||||
* 2. Correct font properties not being inherited.
|
||||
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
margin: 0; /* 3 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Address `overflow` set to `hidden` in IE 8/9/10/11.
|
||||
*/
|
||||
|
||||
button {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
* All other form control elements do not inherit `text-transform` values.
|
||||
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||
* Correct `select` style inheritance in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Correct inability to style clickable `input` types in iOS.
|
||||
* 3. Improve usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
*/
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
cursor: pointer; /* 3 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove inner padding and border in Firefox 4+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
|
||||
input {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/**
|
||||
* It's recommended that you don't attempt to style these elements.
|
||||
* Firefox's implementation doesn't respect box-sizing, padding, or width.
|
||||
*
|
||||
* 1. Address box sizing set to `content-box` in IE 8/9/10.
|
||||
* 2. Remove excess padding in IE 8/9/10.
|
||||
*/
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
* `font-size` values of the `input`, it causes the cursor style of the
|
||||
* decrement button to change from `default` to `text`.
|
||||
*/
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box; /* 2 */
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
* Safari (but not Chrome) clips the cancel button when the search input has
|
||||
* padding (and `textfield` appearance).
|
||||
*/
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
*/
|
||||
|
||||
legend {
|
||||
border: 0; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove default vertical scrollbar in IE 8/9/10/11.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Don't inherit the `font-weight` (applied by a rule above).
|
||||
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
*/
|
||||
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Tables
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
+601
@@ -0,0 +1,601 @@
|
||||
<!doctype html>
|
||||
<html class="no-js" lang="">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<title>jQuery Bar Rating - Minimal, light-weight jQuery ratings</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=1024, initial-scale=1">
|
||||
|
||||
<link rel="stylesheet" href="css/normalize.min.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<link rel="stylesheet" href="css/examples.css">
|
||||
|
||||
<!-- Icons -->
|
||||
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: 'Glyphicons Halflings';
|
||||
src:url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/fonts/glyphicons-halflings-regular.eot');
|
||||
src:url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
|
||||
url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/fonts/glyphicons-halflings-regular.woff') format('woff'),
|
||||
url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/fonts/glyphicons-halflings-regular.ttf') format('truetype'),
|
||||
url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Themes -->
|
||||
<link rel="stylesheet" href="../dist/themes/bars-1to10.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bars-movie.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bars-square.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bars-pill.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bars-reversed.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bars-horizontal.css">
|
||||
|
||||
<link rel="stylesheet" href="../dist/themes/fontawesome-stars.css">
|
||||
<link rel="stylesheet" href="../dist/themes/css-stars.css">
|
||||
<link rel="stylesheet" href="../dist/themes/bootstrap-stars.css">
|
||||
<link rel="stylesheet" href="../dist/themes/fontawesome-stars-o.css">
|
||||
|
||||
<!-- Fonts -->
|
||||
<link href="http://fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet" type="text/css">
|
||||
<link href="http://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css">
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<!--[if lt IE 9]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<a href="http://github.com/antennaio/jquery-bar-rating" target="_blank" class="github" title="Fork me on GitHub"></a>
|
||||
|
||||
<section class="section section-intro">
|
||||
<div class="bars"></div>
|
||||
<h1>jQuery Bar Rating</h1>
|
||||
<p class="tagline">Minimal, light-weight jQuery ratings.</p>
|
||||
<p>
|
||||
jQuery Bar Rating Plugin works by transforming a standard
|
||||
select field into a rating widget. The rating widget can be
|
||||
flexibly styled with CSS. Take a look at a few examples.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="section section-examples">
|
||||
<div class="controls">
|
||||
<a href="#" class="deactivated rating-enable">enable</a>
|
||||
<a href="#" class="rating-disable">disable</a>
|
||||
</div>
|
||||
<div class="examples">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="box box-orange box-example-1to10">
|
||||
<div class="box-header">1/10 Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-1to10" name="rating" autocomplete="off">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
<option value="7" selected="selected">7</option>
|
||||
<option value="8">8</option>
|
||||
<option value="9">9</option>
|
||||
<option value="10">10</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="box box-blue box-example-movie">
|
||||
<div class="box-header">Movie Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-movie" name="rating" autocomplete="off">
|
||||
<option value="Bad">Bad</option>
|
||||
<option value="Mediocre">Mediocre</option>
|
||||
<option value="Good" selected="selected">Good</option>
|
||||
<option value="Awesome">Awesome</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="box box-blue box-example-square">
|
||||
<div class="box-header">Square Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-square" name="rating" autocomplete="off">
|
||||
<option value=""></option>
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="box box-green box-example-pill">
|
||||
<div class="box-header">Pill Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-pill" name="rating" autocomplete="off">
|
||||
<option value="A">A</option>
|
||||
<option value="B">B</option>
|
||||
<option value="C">C</option>
|
||||
<option value="D">D</option>
|
||||
<option value="E">E</option>
|
||||
<option value="F">F</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="box box-green box-large box-example-reversed">
|
||||
<div class="box-header">Reversed Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-reversed" name="rating" autocomplete="off">
|
||||
<option value="Strongly Agree">Strongly Agree</option>
|
||||
<option value="Agree">Agree</option>
|
||||
<option value="Neither Agree or Disagree" selected="selected">Neither Agree or Disagree</option>
|
||||
<option value="Disagree">Disagree</option>
|
||||
<option value="Strongly Disagree">Strongly Disagree</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="box box-orange box-large box-example-horizontal">
|
||||
<div class="box-header">Horizontal Rating</div>
|
||||
<div class="box-body">
|
||||
<select id="example-horizontal" name="rating" autocomplete="off">
|
||||
<option value="10">10</option>
|
||||
<option value="9">9</option>
|
||||
<option value="8">8</option>
|
||||
<option value="7">7</option>
|
||||
<option value="6">6</option>
|
||||
<option value="5">5</option>
|
||||
<option value="4">4</option>
|
||||
<option value="3">3</option>
|
||||
<option value="2">2</option>
|
||||
<option value="1" selected="selected">1</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col col-fullwidth">
|
||||
<div class="star-ratings start-ratings-main clearfix">
|
||||
<h1>How about star ratings?</h1>
|
||||
<p>The plugin comes with a few flavours of star ratings compatible with popular libraries.</p>
|
||||
<div class="stars stars-example-fontawesome">
|
||||
<select id="example-fontawesome" name="rating" autocomplete="off">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
<span class="title">Font Awesome</span>
|
||||
</div>
|
||||
<div class="stars stars-example-css">
|
||||
<select id="example-css" name="rating" autocomplete="off">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
<span class="title">CSS Stars</span>
|
||||
</div>
|
||||
<div class="stars stars-example-bootstrap">
|
||||
<select id="example-bootstrap" name="rating" autocomplete="off">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
<span class="title">Bootstrap</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col col-fullwidth">
|
||||
<div class="star-ratings">
|
||||
<p>It can be used to display fractional star ratings.</p>
|
||||
<div class="stars stars-example-fontawesome-o">
|
||||
<select id="example-fontawesome-o" name="rating" data-current-rating="5.6" autocomplete="off">
|
||||
<option value=""></option>
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
<option value="7">7</option>
|
||||
<option value="8">8</option>
|
||||
<option value="9">9</option>
|
||||
<option value="10">10</option>
|
||||
</select>
|
||||
<span class="title current-rating">
|
||||
Current rating: <span class="value"></span>
|
||||
</span>
|
||||
<span class="title your-rating hidden">
|
||||
Your rating: <span class="value"></span>
|
||||
<a href="#" class="clear-rating"><i class="fa fa-times-circle"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section section-docs">
|
||||
<div class="docs">
|
||||
<div class="how-to-use">
|
||||
<header>How to use</header>
|
||||
<div class="instructions">
|
||||
<ol>
|
||||
<li>
|
||||
<p>
|
||||
Get the plugin from <a href="http://github.com/antennaio/jquery-bar-rating">GitHub</a>
|
||||
or install with Bower or NPM:
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
bower install jquery-bar-rating
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
npm install jquery-bar-rating
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<p>Create a select field:</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<select id="example">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
If you would like to use one of the provided themes include the theme
|
||||
in the head section of the page. Adjust the path to the CSS file
|
||||
and make sure it points to the correct theme file. In this example we are
|
||||
also pulling Font Awesome icons from a CDN.
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="fontawesome-stars.css">
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
Include and call the plugin (after jQuery v1.7.2+)
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
|
||||
<script src="jquery.barrating.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$('#example').barrating({
|
||||
theme: 'fontawesome-stars'
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
</li>
|
||||
<li>
|
||||
You are done.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="configuration" id="nav-configuration">
|
||||
<header>Configuration</header>
|
||||
<div class="instructions">
|
||||
<p>
|
||||
<strong>theme: ''</strong><br>
|
||||
Defines a theme.
|
||||
</p>
|
||||
<p>
|
||||
<strong>initialRating: null</strong><br>
|
||||
Defines initial rating.
|
||||
</p>
|
||||
<p>
|
||||
The default value is `null`, which means that the plugin will try to set the initial rating by finding an option with a `selected` attribute.
|
||||
</p>
|
||||
<p>
|
||||
Optionally, if your ratings are numeric, you can pass a fractional rating here (2.5, 2.8, 5.5). Currently the only theme that supports displaying of fractional ratings is the `fontawesome-stars-o` theme.
|
||||
</p>
|
||||
<p>
|
||||
<strong>allowEmpty: null</strong><br>
|
||||
If set to true, users will be able to submit empty ratings.
|
||||
</p>
|
||||
<p>
|
||||
The default value is `null`, which means that empty ratings will be allowed under the condition that the select field already contains a first option with an empty value.
|
||||
</p>
|
||||
<p>
|
||||
<strong>emptyValue: ''</strong><br>
|
||||
Defines a value that will be considered empty. It is unlikely you will need to modify this setting.
|
||||
</p>
|
||||
<p>
|
||||
<strong>showValues: false</strong><br>
|
||||
If set to true, rating values will be displayed on the bars.
|
||||
</p>
|
||||
<p>
|
||||
<strong>showSelectedRating: true</strong><br>
|
||||
If set to true, user selected rating will be displayed next to the widget.
|
||||
</p>
|
||||
<p>
|
||||
<strong>deselectable: true</strong><br>
|
||||
If set to true, users will be able to deselect ratings.
|
||||
</p>
|
||||
<p>
|
||||
For this feature to work the `allowEmpty` setting needs to be set to `true` or the select field must contain a first option with an empty value.
|
||||
</p>
|
||||
<p>
|
||||
<strong>reverse: false</strong><br>
|
||||
If set to true, the ratings will be reversed.
|
||||
</p>
|
||||
<p>
|
||||
<strong>readonly: false</strong><br>
|
||||
If set to true, the ratings will be read-only.
|
||||
</p>
|
||||
<p>
|
||||
<strong>fastClicks: true</strong><br>
|
||||
Remove 300ms click delay on touch devices.
|
||||
</p>
|
||||
<p>
|
||||
<strong>hoverState: true</strong><br>
|
||||
Change state on hover.
|
||||
</p>
|
||||
<p>
|
||||
<strong>silent: false</strong><br>
|
||||
Supress callbacks when controlling ratings programatically.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="methods" id="nav-methods">
|
||||
<header>Methods</header>
|
||||
<div class="instructions">
|
||||
<p>
|
||||
<strong>$('select').barrating('show');</strong><br>
|
||||
Shows the rating widget.
|
||||
</p>
|
||||
<p>
|
||||
<strong>$('select').barrating('set', value);</strong><br>
|
||||
Sets the value of the rating widget.<br>
|
||||
The value needs to exist in the underlying select field.
|
||||
</p>
|
||||
<p>
|
||||
<strong>$('select').barrating('readonly', state);</strong><br>
|
||||
Switches the read-only state to true or false.<br>
|
||||
</p>
|
||||
<p>
|
||||
<strong>$('select').barrating('clear');</strong><br>
|
||||
Clears the rating.
|
||||
</p>
|
||||
<p>
|
||||
<strong>$('select').barrating('destroy');</strong><br>
|
||||
Destroys the rating widget.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="callbacks" id="nav-callbacks">
|
||||
<header>Callbacks</header>
|
||||
<div class="instructions">
|
||||
<p>
|
||||
<strong>onSelect:function(value, text, event)</strong><br>
|
||||
Fired when a rating is selected.<br>
|
||||
If the rating was set programmatically by using the `set` method event will be null.
|
||||
</p>
|
||||
<p>
|
||||
<strong>onClear:function(value, text)</strong><br>
|
||||
Fired when a rating is cleared.
|
||||
</p>
|
||||
<p>
|
||||
<strong>onDestroy:function(value, text)</strong><br>
|
||||
Fired when a rating is destroyed.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq" id="nav-faq">
|
||||
<header>FAQ</header>
|
||||
<div class="instructions">
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>How does this plugin work?</strong>
|
||||
</p>
|
||||
<p>
|
||||
When you initialise the plugin the select field will be wrapped in a div
|
||||
with a `.br-theme-fontawesome-stars` class (or a different class indicating
|
||||
the theme currently in use). The select field will get hidden and a rating widget
|
||||
will be appended right after the select field.
|
||||
</p>
|
||||
<p>Expected result:</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<div class="br-wrapper br-theme-fontawesome-stars">
|
||||
<select id="example"> <!-- now hidden -->
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
</select>
|
||||
...rating widget...
|
||||
</div>
|
||||
</code>
|
||||
</pre>
|
||||
|
||||
</div>
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>How do I allow users to select empty ratings?</strong>
|
||||
</p>
|
||||
<p>
|
||||
To allow users to select empty ratings simply set the `allowEmpty`
|
||||
setting to `true` or alternatively include an option with an empty value
|
||||
in your select field:
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<select id="example">
|
||||
<option value=""></option>
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
</select>
|
||||
</code>
|
||||
</pre>
|
||||
</div>
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>How can I specify text that is displayed on the bars?</strong>
|
||||
</p>
|
||||
<p>
|
||||
The `showValues` plugin setting already makes it easy to display
|
||||
option values directly on the bars. For more control over the text
|
||||
that is displayed on the bars you can define `data-html` attribute
|
||||
on each of the <option> elements that will take precedence
|
||||
over actual option value.
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
<select id="example">
|
||||
<option value="1" data-html="good">1</option>
|
||||
<option value="2" data-html="better">2</option>
|
||||
<option value="3" data-html="best">3</option>
|
||||
</select>
|
||||
</code>
|
||||
</pre>
|
||||
</div>
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>How do I use the onSelect callback?</strong>
|
||||
</p>
|
||||
<p>
|
||||
The onSelect callback is fired when a user selects a rating or when the
|
||||
`set` method is called to select a rating programmatically. The optional
|
||||
third argument will give you access to the event object if it's available.
|
||||
</p>
|
||||
|
||||
<pre>
|
||||
<code>
|
||||
$('#example').barrating('show', {
|
||||
theme: 'my-awesome-theme',
|
||||
onSelect: function(value, text, event) {
|
||||
if (typeof(event) !== 'undefined') {
|
||||
// rating was selected by a user
|
||||
console.log(event.target);
|
||||
} else {
|
||||
// rating was selected programmatically
|
||||
// by calling `set` method
|
||||
}
|
||||
}
|
||||
});
|
||||
</code>
|
||||
</pre>
|
||||
<p>
|
||||
Often you don't want the callback to run at all when a rating is selected
|
||||
with the `set` method. If this is the case please use the <a href="#nav-configuration">
|
||||
`silent`</a> option.
|
||||
</p>
|
||||
</div>
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>Is keyboard navigation supported?</strong>
|
||||
</p>
|
||||
<p>
|
||||
Since the rating widget consists of anchor elements, you can tab or shift-tab between
|
||||
elements and press `Enter` to select a rating.
|
||||
</p>
|
||||
</div>
|
||||
<div class="question">
|
||||
<p>
|
||||
<strong>Can the plugin be used outside of Javascript ecosystem?</strong>
|
||||
</p>
|
||||
<p>
|
||||
Harvey Lieberman (<a href="https://github.com/harveyl888" target="_blank">@harveyl888</a>) created
|
||||
an R htmlwidget wrapper for the jQuery Bar Rating plugin. For more details go to:
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://github.com/harveyl888/barRating" target="_blank">
|
||||
https://github.com/harveyl888/barRating</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="license" id="nav-license">
|
||||
<header>License</header>
|
||||
<div class="instructions">
|
||||
<p>This plugin is available under the MIT license:</p>
|
||||
<p>
|
||||
<a href="http://www.opensource.org/licenses/mit-license.php" target="_blank">
|
||||
http://www.opensource.org/licenses/mit-license.php</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="download" id="nav-download">
|
||||
<header>Download</header>
|
||||
<div class="instructions">
|
||||
<p>Download it at GitHub:</p>
|
||||
<p>
|
||||
<a href="http://github.com/antennaio/jquery-bar-rating" target="_blank">
|
||||
http://github.com/antennaio/jquery-bar-rating</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<a href="http://antenna.io" class="antennaio" target="_blank">
|
||||
<span>Made by ANTENNA.IO</span>
|
||||
</a>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>
|
||||
|
||||
<script src="../jquery.barrating.js"></script>
|
||||
<script src="js/examples.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
+123
@@ -0,0 +1,123 @@
|
||||
$(function() {
|
||||
function ratingEnable() {
|
||||
$('#example-1to10').barrating('show', {
|
||||
theme: 'bars-1to10'
|
||||
});
|
||||
|
||||
$('#example-movie').barrating('show', {
|
||||
theme: 'bars-movie'
|
||||
});
|
||||
|
||||
$('#example-movie').barrating('set', 'Mediocre');
|
||||
|
||||
$('#example-square').barrating('show', {
|
||||
theme: 'bars-square',
|
||||
showValues: true,
|
||||
showSelectedRating: false
|
||||
});
|
||||
|
||||
$('#example-pill').barrating('show', {
|
||||
theme: 'bars-pill',
|
||||
initialRating: 'A',
|
||||
showValues: true,
|
||||
showSelectedRating: false,
|
||||
allowEmpty: true,
|
||||
emptyValue: '-- no rating selected --',
|
||||
onSelect: function(value, text) {
|
||||
alert('Selected rating: ' + value);
|
||||
}
|
||||
});
|
||||
|
||||
$('#example-reversed').barrating('show', {
|
||||
theme: 'bars-reversed',
|
||||
showSelectedRating: true,
|
||||
reverse: true
|
||||
});
|
||||
|
||||
$('#example-horizontal').barrating('show', {
|
||||
theme: 'bars-horizontal',
|
||||
reverse: true,
|
||||
hoverState: false
|
||||
});
|
||||
|
||||
$('#example-fontawesome').barrating({
|
||||
theme: 'fontawesome-stars',
|
||||
showSelectedRating: false
|
||||
});
|
||||
|
||||
$('#example-css').barrating({
|
||||
theme: 'css-stars',
|
||||
showSelectedRating: false
|
||||
});
|
||||
|
||||
$('#example-bootstrap').barrating({
|
||||
theme: 'bootstrap-stars',
|
||||
showSelectedRating: false
|
||||
});
|
||||
|
||||
var currentRating = $('#example-fontawesome-o').data('current-rating');
|
||||
|
||||
$('.stars-example-fontawesome-o .current-rating')
|
||||
.find('span')
|
||||
.html(currentRating);
|
||||
|
||||
$('.stars-example-fontawesome-o .clear-rating').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
$('#example-fontawesome-o')
|
||||
.barrating('clear');
|
||||
});
|
||||
|
||||
$('#example-fontawesome-o').barrating({
|
||||
theme: 'fontawesome-stars-o',
|
||||
showSelectedRating: false,
|
||||
initialRating: currentRating,
|
||||
onSelect: function(value, text) {
|
||||
if (!value) {
|
||||
$('#example-fontawesome-o')
|
||||
.barrating('clear');
|
||||
} else {
|
||||
$('.stars-example-fontawesome-o .current-rating')
|
||||
.addClass('hidden');
|
||||
|
||||
$('.stars-example-fontawesome-o .your-rating')
|
||||
.removeClass('hidden')
|
||||
.find('span')
|
||||
.html(value);
|
||||
}
|
||||
},
|
||||
onClear: function(value, text) {
|
||||
$('.stars-example-fontawesome-o')
|
||||
.find('.current-rating')
|
||||
.removeClass('hidden')
|
||||
.end()
|
||||
.find('.your-rating')
|
||||
.addClass('hidden');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function ratingDisable() {
|
||||
$('select').barrating('destroy');
|
||||
}
|
||||
|
||||
$('.rating-enable').click(function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
ratingEnable();
|
||||
|
||||
$(this).addClass('deactivated');
|
||||
$('.rating-disable').removeClass('deactivated');
|
||||
});
|
||||
|
||||
$('.rating-disable').click(function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
ratingDisable();
|
||||
|
||||
$(this).addClass('deactivated');
|
||||
$('.rating-enable').removeClass('deactivated');
|
||||
});
|
||||
|
||||
ratingEnable();
|
||||
});
|
||||
Generated
Vendored
+5
@@ -0,0 +1,5 @@
|
||||
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
|
||||
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
|
||||
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
|
||||
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
|
||||
for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
|
||||
Generated
Vendored
+4
File diff suppressed because one or more lines are too long
+191
@@ -0,0 +1,191 @@
|
||||
@import "variables.less";
|
||||
|
||||
/* Center ratings in container */
|
||||
|
||||
.box-example-1to10 .br-wrapper {
|
||||
width: 210px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -105px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.box-example-movie .br-wrapper {
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -125px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.box-example-square .br-wrapper {
|
||||
width: 190px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -95px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.box-example-pill .br-wrapper {
|
||||
width: 232px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -116px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.box-example-reversed .br-wrapper {
|
||||
padding-top: 1.3em;
|
||||
width: 356px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -178px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.box-example-horizontal .br-wrapper {
|
||||
width: 120px;
|
||||
position: absolute;
|
||||
margin: 0px 0 0 -60px;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
/* Display star ratings */
|
||||
|
||||
.star-ratings {
|
||||
h1 {
|
||||
font-size: 1.5em;
|
||||
line-height: 2;
|
||||
margin-top: 3em;
|
||||
color: @textColor;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 3em;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
h1, p {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.stars {
|
||||
width: 120px;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
padding: 0 95px;
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
color: #cccccc;
|
||||
line-height: 3;
|
||||
}
|
||||
|
||||
select {
|
||||
width: 120px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.stars-example-fontawesome,
|
||||
.stars-example-css,
|
||||
.stars-example-bootstrap {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.stars-example-fontawesome-o {
|
||||
width: 200px;
|
||||
|
||||
select {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.start-ratings-main {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
|
||||
/* Boxes */
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
float: left;
|
||||
margin: 1em 0;
|
||||
|
||||
.box-header {
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
padding: .5em 0;
|
||||
}
|
||||
|
||||
.box-body {
|
||||
padding-top: 2em;
|
||||
height: 85px;
|
||||
|
||||
/* rating widgets will be absolutely centered relative to box body */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
select {
|
||||
width: 120px;
|
||||
margin: 10px auto 0 auto;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.box-large {
|
||||
.box-body {
|
||||
padding-top: 2em;
|
||||
height: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
.box-color(@color) {
|
||||
.box-header {
|
||||
background-color: @color;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.box-body {
|
||||
background-color: white;
|
||||
border: 2px solid lighten(@color, 15%);
|
||||
border-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.box-orange {
|
||||
.box-color(@orangeColor);
|
||||
}
|
||||
|
||||
.box-green {
|
||||
.box-color(@greenColor);
|
||||
}
|
||||
|
||||
.box-blue {
|
||||
.box-color(@blueColor);
|
||||
}
|
||||
|
||||
@media print {
|
||||
.star-ratings {
|
||||
h1 {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.stars {
|
||||
.title {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-orange,
|
||||
.box-green,
|
||||
.box-blue {
|
||||
.box-header {
|
||||
background-color: transparent;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.box-body {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
+577
@@ -0,0 +1,577 @@
|
||||
/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
|
||||
|
||||
html {
|
||||
color: #222;
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
b, strong {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.browserupgrade {
|
||||
margin: 0;
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
padding: 1em 2em;
|
||||
text-align: center;
|
||||
|
||||
a {
|
||||
color: #000;
|
||||
text-decoration: underline;
|
||||
|
||||
&:hover {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Dead Simple Grid (c) 2012 Vladimir Agafonkin */
|
||||
|
||||
.col {
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.row .row {
|
||||
margin: 0 -1em;
|
||||
}
|
||||
|
||||
.row:before, .row:after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
|
||||
.row:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.col {
|
||||
float: left;
|
||||
width: 100%;
|
||||
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Author's custom styles
|
||||
========================================================================== */
|
||||
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
body {
|
||||
font-family: @fontFamily;
|
||||
color: @textColor;
|
||||
font-weight: 300;
|
||||
font-size: 1.25em; /* 20px */
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-weight: 400;
|
||||
color: @headerColor;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.8em; /* 56px */
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: @greenColor;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: darken(@greenColor, 20%);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 1em 0;
|
||||
}
|
||||
|
||||
.warning {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.github {
|
||||
.retina-image('../img/github.png', '../img/github@2x.png', 50px, 50px);
|
||||
position: fixed;
|
||||
right: 25px;
|
||||
top: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
opacity: 0.3;
|
||||
|
||||
-webkit-transition: opacity .2s;
|
||||
transition: opacity .2s;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.antennaio {
|
||||
.retina-image('../img/antenna.png', '../img/antenna@2x.png', 60px, 60px);
|
||||
background-repeat: no-repeat;
|
||||
color: lighten(@textColor, 35%);
|
||||
width: 280px;
|
||||
height: 60px;
|
||||
display: block;
|
||||
margin: auto;
|
||||
font-weight: 400;
|
||||
font-size: 0.6em; /* 12px */
|
||||
line-height: 5.5;
|
||||
letter-spacing: 2px;
|
||||
margin-bottom: 7em;
|
||||
|
||||
-webkit-transition: color .2s;
|
||||
transition: color .2s;
|
||||
|
||||
&:hover {
|
||||
color: @textColor;
|
||||
}
|
||||
|
||||
span {
|
||||
padding: 0 0 0 70px;
|
||||
}
|
||||
}
|
||||
|
||||
.bars {
|
||||
.retina-image('../img/bars.png', '../img/bars@2x.png', 80px, 80px);
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 2em 0;
|
||||
}
|
||||
|
||||
.section-intro {
|
||||
text-align: center;
|
||||
margin: 3em 0 4em 0;
|
||||
max-height: 9999px; /* no font boosting please */
|
||||
|
||||
h1 {
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
p {
|
||||
max-width: 560px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
p.tagline {
|
||||
font-size: 0.8em; /* 16px */
|
||||
color: lighten(@textColor, 20%);
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
}
|
||||
|
||||
.section-examples {
|
||||
position: relative;
|
||||
background: @backgroundColor;
|
||||
}
|
||||
|
||||
.examples {
|
||||
margin: auto;
|
||||
width: 980px;
|
||||
padding: 3em 0;
|
||||
|
||||
.col {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.col-fullwidth {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.section-docs {
|
||||
margin: 3em 0;
|
||||
}
|
||||
|
||||
.coloredDocs(@color) {
|
||||
header {
|
||||
background: @color;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: @color;
|
||||
}
|
||||
|
||||
a {
|
||||
color: @color;
|
||||
|
||||
&:hover {
|
||||
color: darken(@color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
background: white;
|
||||
border-left: 2px solid @color;
|
||||
padding: 0 2em;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: @fontFamilyMonospaced;
|
||||
font-size: 0.9em; /* 18px */
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
.docs {
|
||||
width: 800px;
|
||||
margin: auto;
|
||||
max-height: 9999px; /* no font boosting please */
|
||||
|
||||
header {
|
||||
text-align: center;
|
||||
padding: 1em 0;
|
||||
letter-spacing: 3px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
color: white;
|
||||
width: 100%;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.how-to-use, .callbacks, .download {
|
||||
.coloredDocs(@blueColor);
|
||||
}
|
||||
|
||||
.configuration, .faq {
|
||||
.coloredDocs(@greenColor);
|
||||
}
|
||||
|
||||
.license, .methods {
|
||||
.coloredDocs(@orangeColor);
|
||||
}
|
||||
|
||||
.instructions {
|
||||
padding: 2em 3em;
|
||||
background: @backgroundColor;
|
||||
}
|
||||
|
||||
.faq {
|
||||
p {
|
||||
margin: 0 0 .5em 0;
|
||||
}
|
||||
|
||||
.question {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.question:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.controls {
|
||||
position: absolute;
|
||||
top: -23px;
|
||||
left: 50%;
|
||||
margin-left: -190px;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 150px;
|
||||
background-color: @greenColor;
|
||||
color: white;
|
||||
float: left;
|
||||
padding: .3em 1em .5em 1em;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
|
||||
-webkit-transition: background-color .2s;
|
||||
transition: background-color .2s;
|
||||
|
||||
&:hover {
|
||||
background-color: darken(@greenColor, 5%);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
color: lighten(@greenColor, 30%);
|
||||
background-color: darken(@greenColor, 25%);
|
||||
}
|
||||
}
|
||||
|
||||
a.rating-enable {
|
||||
-webkit-border-top-left-radius: 999px;
|
||||
-webkit-border-bottom-left-radius: 999px;
|
||||
-moz-border-radius-topleft: 999px;
|
||||
-moz-border-radius-bottomleft: 999px;
|
||||
border-top-left-radius: 999px;
|
||||
border-bottom-left-radius: 999px;
|
||||
}
|
||||
|
||||
a.rating-disable {
|
||||
-webkit-border-top-right-radius: 999px;
|
||||
-webkit-border-bottom-right-radius: 999px;
|
||||
-moz-border-radius-topright: 999px;
|
||||
-moz-border-radius-bottomright: 999px;
|
||||
border-top-right-radius: 999px;
|
||||
border-bottom-right-radius: 999px;
|
||||
}
|
||||
|
||||
a:last-child {
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
a.deactivated {
|
||||
background: darken(@greenColor, 15%);
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Media Queries
|
||||
========================================================================== */
|
||||
|
||||
@media only screen and (min-width: 35em) {
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
color: black;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.controls,
|
||||
.github,
|
||||
.antennaio {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.section-intro {
|
||||
margin: 1em 0 2em 0;
|
||||
|
||||
p.tagline {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
.section-examples {
|
||||
background: transparent;
|
||||
|
||||
.examples {
|
||||
padding: 1em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section-docs {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.docs {
|
||||
.how-to-use,
|
||||
.callbacks,
|
||||
.download,
|
||||
.configuration,
|
||||
.faq,
|
||||
.license,
|
||||
.methods {
|
||||
a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
header {
|
||||
background: transparent;
|
||||
color: black;
|
||||
}
|
||||
|
||||
code, strong {
|
||||
color: black;
|
||||
}
|
||||
|
||||
pre {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.instructions {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Helper classes
|
||||
========================================================================== */
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.visuallyhidden {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.visuallyhidden.focusable:active,
|
||||
.visuallyhidden.focusable:focus {
|
||||
clip: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
position: static;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.invisible {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Print styles
|
||||
========================================================================== */
|
||||
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
// Retina image
|
||||
.retina-image(@file-1x, @file-2x, @width-1x, @height-1x) {
|
||||
background-image: url("@{file-1x}");
|
||||
|
||||
@media
|
||||
only screen and (-webkit-min-device-pixel-ratio: 2),
|
||||
only screen and ( min--moz-device-pixel-ratio: 2),
|
||||
only screen and ( -o-min-device-pixel-ratio: 2/1),
|
||||
only screen and ( min-device-pixel-ratio: 2),
|
||||
only screen and ( min-resolution: 192dpi),
|
||||
only screen and ( min-resolution: 2dppx) {
|
||||
background-image: url("@{file-2x}");
|
||||
background-size: @width-1x @height-1x;
|
||||
}
|
||||
}
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
// Fonts
|
||||
@fontFamily: "Lato", sans-serif;
|
||||
@fontFamilyMonospaced: "Source Code Pro", sans-serif;
|
||||
|
||||
// Colors
|
||||
@textColor: #757575;
|
||||
@headerColor: #2d2d2d;
|
||||
@backgroundColor: #f8f8f8;
|
||||
@orangeColor: #EDB867;
|
||||
@greenColor: #50E3C2;
|
||||
@blueColor: #4278F5;
|
||||
@greyColor: #b4b4b4;
|
||||
@redColor: #f7605a;
|
||||
+72
@@ -0,0 +1,72 @@
|
||||
var gulp = require('gulp'),
|
||||
less = require('gulp-less'),
|
||||
jshint = require('gulp-jshint'),
|
||||
uglify = require('gulp-uglify'),
|
||||
KarmaServer = require('karma').Server,
|
||||
rename = require('gulp-rename'),
|
||||
sourcemaps = require('gulp-sourcemaps'),
|
||||
runSequence = require('run-sequence');
|
||||
|
||||
var path = require('path');
|
||||
|
||||
var srcFile = 'jquery.barrating.js';
|
||||
|
||||
var lessFiles = [
|
||||
path.join(__dirname, 'examples', 'less', 'examples.less'),
|
||||
path.join(__dirname, 'examples', 'less', 'main.less'),
|
||||
];
|
||||
|
||||
var cssPath = path.join(__dirname, 'examples', 'css'),
|
||||
distPath = 'dist';
|
||||
|
||||
var themePath = path.join(__dirname, 'dist', 'themes');
|
||||
|
||||
var themeLessFiles = 'themes/*.less';
|
||||
|
||||
gulp.task('jshint', function() {
|
||||
return gulp.src(srcFile)
|
||||
.pipe(jshint())
|
||||
.pipe(jshint.reporter('default'))
|
||||
.pipe(jshint.reporter('fail'));
|
||||
});
|
||||
|
||||
gulp.task('uglify', function() {
|
||||
return gulp.src(srcFile)
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(uglify())
|
||||
.pipe(rename(function(path) {
|
||||
path.basename += '.min';
|
||||
}))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(distPath));
|
||||
});
|
||||
|
||||
gulp.task('test', function(done) {
|
||||
new KarmaServer({
|
||||
configFile: __dirname + '/karma.conf.js'
|
||||
}, done).start();
|
||||
});
|
||||
|
||||
gulp.task('less', function() {
|
||||
return gulp.src(lessFiles)
|
||||
.pipe(less())
|
||||
.pipe(gulp.dest(cssPath));
|
||||
});
|
||||
|
||||
gulp.task('themes', function() {
|
||||
return gulp.src([themeLessFiles, '!themes/variables.less', '!themes/mixins.less'])
|
||||
.pipe(less())
|
||||
.pipe(gulp.dest(themePath));
|
||||
});
|
||||
|
||||
gulp.task('build', function() {
|
||||
runSequence('jshint', 'test', 'themes', 'uglify');
|
||||
});
|
||||
|
||||
gulp.task('watch', function() {
|
||||
gulp.watch(srcFile, ['jshint']);
|
||||
gulp.watch(lessFiles, ['less']);
|
||||
gulp.watch(themeLessFiles, ['themes']);
|
||||
});
|
||||
|
||||
gulp.task('default', ['build']);
|
||||
+585
@@ -0,0 +1,585 @@
|
||||
/**
|
||||
* jQuery Bar Rating Plugin v1.2.2
|
||||
*
|
||||
* http://github.com/antennaio/jquery-bar-rating
|
||||
*
|
||||
* Copyright (c) 2012-2016 Kazik Pietruszewski
|
||||
*
|
||||
* This plugin is available under the MIT license.
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
(function (factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof module === 'object' && module.exports) {
|
||||
// Node/CommonJS
|
||||
module.exports = factory(require('jquery'));
|
||||
} else {
|
||||
// browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function ($) {
|
||||
|
||||
var BarRating = (function() {
|
||||
|
||||
function BarRating() {
|
||||
var self = this;
|
||||
|
||||
// wrap element in a wrapper div
|
||||
var wrapElement = function() {
|
||||
var classes = ['br-wrapper'];
|
||||
|
||||
if (self.options.theme !== '') {
|
||||
classes.push('br-theme-' + self.options.theme);
|
||||
}
|
||||
|
||||
self.$elem.wrap($('<div />', {
|
||||
'class': classes.join(' ')
|
||||
}));
|
||||
};
|
||||
|
||||
// unwrap element
|
||||
var unwrapElement = function() {
|
||||
self.$elem.unwrap();
|
||||
};
|
||||
|
||||
// find option by value
|
||||
var findOption = function(value) {
|
||||
if ($.isNumeric(value)) {
|
||||
value = Math.floor(value);
|
||||
}
|
||||
|
||||
return $('option[value="' + value + '"]', self.$elem);
|
||||
};
|
||||
|
||||
// get initial option
|
||||
var getInitialOption = function() {
|
||||
var initialRating = self.options.initialRating;
|
||||
|
||||
if (!initialRating) {
|
||||
return $('option:selected', self.$elem);
|
||||
}
|
||||
|
||||
return findOption(initialRating);
|
||||
};
|
||||
|
||||
// get empty option
|
||||
var getEmptyOption = function() {
|
||||
var $emptyOpt = self.$elem.find('option[value="' + self.options.emptyValue + '"]');
|
||||
|
||||
if (!$emptyOpt.length && self.options.allowEmpty) {
|
||||
$emptyOpt = $('<option />', { 'value': self.options.emptyValue });
|
||||
|
||||
return $emptyOpt.prependTo(self.$elem);
|
||||
}
|
||||
|
||||
return $emptyOpt;
|
||||
};
|
||||
|
||||
// get data
|
||||
var getData = function(key) {
|
||||
var data = self.$elem.data('barrating');
|
||||
|
||||
if (typeof key !== 'undefined') {
|
||||
return data[key];
|
||||
}
|
||||
|
||||
return data;
|
||||
};
|
||||
|
||||
// set data
|
||||
var setData = function(key, value) {
|
||||
if (value !== null && typeof value === 'object') {
|
||||
self.$elem.data('barrating', value);
|
||||
} else {
|
||||
self.$elem.data('barrating')[key] = value;
|
||||
}
|
||||
};
|
||||
|
||||
// save data on element
|
||||
var saveDataOnElement = function() {
|
||||
var $opt = getInitialOption();
|
||||
var $emptyOpt = getEmptyOption();
|
||||
|
||||
var value = $opt.val();
|
||||
var text = $opt.data('html') ? $opt.data('html') : $opt.text();
|
||||
|
||||
// if the allowEmpty option is not set let's check if empty option exists in the select field
|
||||
var allowEmpty = (self.options.allowEmpty !== null) ?
|
||||
self.options.allowEmpty :
|
||||
!!$emptyOpt.length;
|
||||
|
||||
var emptyValue = ($emptyOpt.length) ? $emptyOpt.val() : null;
|
||||
var emptyText = ($emptyOpt.length) ? $emptyOpt.text() : null;
|
||||
|
||||
setData(null, {
|
||||
userOptions: self.options,
|
||||
|
||||
// initial rating based on the OPTION value
|
||||
ratingValue: value,
|
||||
ratingText: text,
|
||||
|
||||
// rating will be restored by calling clear method
|
||||
originalRatingValue: value,
|
||||
originalRatingText: text,
|
||||
|
||||
// allow empty ratings?
|
||||
allowEmpty: allowEmpty,
|
||||
|
||||
// rating value and text of the empty OPTION
|
||||
emptyRatingValue: emptyValue,
|
||||
emptyRatingText: emptyText,
|
||||
|
||||
// read-only state
|
||||
readOnly: self.options.readonly,
|
||||
|
||||
// did the user already select a rating?
|
||||
ratingMade: false
|
||||
});
|
||||
};
|
||||
|
||||
// remove data on element
|
||||
var removeDataOnElement = function() {
|
||||
self.$elem.removeData('barrating');
|
||||
};
|
||||
|
||||
// return current rating text
|
||||
var ratingText = function() {
|
||||
return getData('ratingText');
|
||||
};
|
||||
|
||||
// return current rating value
|
||||
var ratingValue = function() {
|
||||
return getData('ratingValue');
|
||||
};
|
||||
|
||||
// build widget and return jQuery element
|
||||
var buildWidget = function() {
|
||||
var $w = $('<div />', { 'class': 'br-widget' });
|
||||
|
||||
// create A elements that will replace OPTIONs
|
||||
self.$elem.find('option').each(function() {
|
||||
var val, text, html, $a;
|
||||
|
||||
val = $(this).val();
|
||||
|
||||
// create ratings - but only if val is not defined as empty
|
||||
if (val !== getData('emptyRatingValue')) {
|
||||
text = $(this).text();
|
||||
html = $(this).data('html');
|
||||
if (html) { text = html; }
|
||||
|
||||
$a = $('<a />', {
|
||||
'href': '#',
|
||||
'data-rating-value': val,
|
||||
'data-rating-text': text,
|
||||
'html': (self.options.showValues) ? text : ''
|
||||
});
|
||||
|
||||
$w.append($a);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// append .br-current-rating div to the widget
|
||||
if (self.options.showSelectedRating) {
|
||||
$w.append($('<div />', { 'text': '', 'class': 'br-current-rating' }));
|
||||
}
|
||||
|
||||
// additional classes for the widget
|
||||
if (self.options.reverse) {
|
||||
$w.addClass('br-reverse');
|
||||
}
|
||||
|
||||
if (self.options.readonly) {
|
||||
$w.addClass('br-readonly');
|
||||
}
|
||||
|
||||
return $w;
|
||||
};
|
||||
|
||||
// return a jQuery function name depending on the 'reverse' setting
|
||||
var nextAllorPreviousAll = function() {
|
||||
if (getData('userOptions').reverse) {
|
||||
return 'nextAll';
|
||||
} else {
|
||||
return 'prevAll';
|
||||
}
|
||||
};
|
||||
|
||||
// set the value of the select field
|
||||
var setSelectFieldValue = function(value) {
|
||||
// change selected option
|
||||
findOption(value).prop('selected', true);
|
||||
|
||||
self.$elem.change();
|
||||
};
|
||||
|
||||
// reset select field
|
||||
var resetSelectField = function() {
|
||||
$('option', self.$elem).prop('selected', function() {
|
||||
return this.defaultSelected;
|
||||
});
|
||||
|
||||
self.$elem.change();
|
||||
};
|
||||
|
||||
// display the currently selected rating
|
||||
var showSelectedRating = function(text) {
|
||||
// text undefined?
|
||||
text = text ? text : ratingText();
|
||||
|
||||
// special case when the selected rating is defined as empty
|
||||
if (text == getData('emptyRatingText')) {
|
||||
text = '';
|
||||
}
|
||||
|
||||
// update .br-current-rating div
|
||||
if (self.options.showSelectedRating) {
|
||||
self.$elem.parent().find('.br-current-rating').text(text);
|
||||
}
|
||||
};
|
||||
|
||||
// return rounded fraction of a value (14.4 -> 40, 0.99 -> 90)
|
||||
var fraction = function(value) {
|
||||
return Math.round(((Math.floor(value * 10) / 10) % 1) * 100);
|
||||
};
|
||||
|
||||
// remove all classes from elements
|
||||
var resetStyle = function() {
|
||||
// remove all classes starting with br-*
|
||||
self.$widget.find('a').removeClass(function(index, classes) {
|
||||
return (classes.match(/(^|\s)br-\S+/g) || []).join(' ');
|
||||
});
|
||||
};
|
||||
|
||||
// apply style by setting classes on elements
|
||||
var applyStyle = function() {
|
||||
var $a = self.$widget.find('a[data-rating-value="' + ratingValue() + '"]');
|
||||
var initialRating = getData('userOptions').initialRating;
|
||||
var baseValue = $.isNumeric(ratingValue()) ? ratingValue() : 0;
|
||||
var f = fraction(initialRating);
|
||||
var $all, $fractional;
|
||||
|
||||
resetStyle();
|
||||
|
||||
// add classes
|
||||
$a.addClass('br-selected br-current')[nextAllorPreviousAll()]()
|
||||
.addClass('br-selected');
|
||||
|
||||
if (!getData('ratingMade') && $.isNumeric(initialRating)) {
|
||||
if ((initialRating <= baseValue) || !f) {
|
||||
return;
|
||||
}
|
||||
|
||||
$all = self.$widget.find('a');
|
||||
|
||||
$fractional = ($a.length) ?
|
||||
$a[(getData('userOptions').reverse) ? 'prev' : 'next']() :
|
||||
$all[(getData('userOptions').reverse) ? 'last' : 'first']();
|
||||
|
||||
$fractional.addClass('br-fractional');
|
||||
$fractional.addClass('br-fractional-' + f);
|
||||
}
|
||||
};
|
||||
|
||||
// check if the element is deselectable?
|
||||
var isDeselectable = function($element) {
|
||||
if (!getData('allowEmpty') || !getData('userOptions').deselectable) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return (ratingValue() == $element.attr('data-rating-value'));
|
||||
};
|
||||
|
||||
// handle click events
|
||||
var attachClickHandler = function($elements) {
|
||||
$elements.on('click.barrating', function(event) {
|
||||
var $a = $(this),
|
||||
options = getData('userOptions'),
|
||||
value,
|
||||
text;
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
value = $a.attr('data-rating-value');
|
||||
text = $a.attr('data-rating-text');
|
||||
|
||||
// is current and deselectable?
|
||||
if (isDeselectable($a)) {
|
||||
value = getData('emptyRatingValue');
|
||||
text = getData('emptyRatingText');
|
||||
}
|
||||
|
||||
// remember selected rating
|
||||
setData('ratingValue', value);
|
||||
setData('ratingText', text);
|
||||
setData('ratingMade', true);
|
||||
|
||||
setSelectFieldValue(value);
|
||||
showSelectedRating(text);
|
||||
|
||||
applyStyle();
|
||||
|
||||
// onSelect callback
|
||||
options.onSelect.call(
|
||||
self,
|
||||
ratingValue(),
|
||||
ratingText(),
|
||||
event
|
||||
);
|
||||
|
||||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
// handle mouseenter events
|
||||
var attachMouseEnterHandler = function($elements) {
|
||||
$elements.on('mouseenter.barrating', function() {
|
||||
var $a = $(this);
|
||||
|
||||
resetStyle();
|
||||
|
||||
$a.addClass('br-active')[nextAllorPreviousAll()]()
|
||||
.addClass('br-active');
|
||||
|
||||
showSelectedRating($a.attr('data-rating-text'));
|
||||
});
|
||||
};
|
||||
|
||||
// handle mouseleave events
|
||||
var attachMouseLeaveHandler = function($elements) {
|
||||
self.$widget.on('mouseleave.barrating blur.barrating', function() {
|
||||
showSelectedRating();
|
||||
applyStyle();
|
||||
});
|
||||
};
|
||||
|
||||
// somewhat primitive way to remove 300ms click delay on touch devices
|
||||
// for a more advanced solution consider setting `fastClicks` option to false
|
||||
// and using a library such as fastclick (https://github.com/ftlabs/fastclick)
|
||||
var fastClicks = function($elements) {
|
||||
$elements.on('touchstart.barrating', function(event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
$(this).click();
|
||||
});
|
||||
};
|
||||
|
||||
// disable clicks
|
||||
var disableClicks = function($elements) {
|
||||
$elements.on('click.barrating', function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
};
|
||||
|
||||
var attachHandlers = function($elements) {
|
||||
// attach click event handler
|
||||
attachClickHandler($elements);
|
||||
|
||||
if (self.options.hoverState) {
|
||||
// attach mouseenter event handler
|
||||
attachMouseEnterHandler($elements);
|
||||
|
||||
// attach mouseleave event handler
|
||||
attachMouseLeaveHandler($elements);
|
||||
}
|
||||
};
|
||||
|
||||
var detachHandlers = function($elements) {
|
||||
// remove event handlers in the ".barrating" namespace
|
||||
$elements.off('.barrating');
|
||||
};
|
||||
|
||||
var setupHandlers = function(readonly) {
|
||||
var $elements = self.$widget.find('a');
|
||||
|
||||
if (fastClicks) {
|
||||
fastClicks($elements);
|
||||
}
|
||||
|
||||
if (readonly) {
|
||||
detachHandlers($elements);
|
||||
disableClicks($elements);
|
||||
} else {
|
||||
attachHandlers($elements);
|
||||
}
|
||||
};
|
||||
|
||||
this.show = function() {
|
||||
// run only once
|
||||
if (getData()) return;
|
||||
|
||||
// wrap element
|
||||
wrapElement();
|
||||
|
||||
// save data
|
||||
saveDataOnElement();
|
||||
|
||||
// build & append widget to the DOM
|
||||
self.$widget = buildWidget();
|
||||
self.$widget.insertAfter(self.$elem);
|
||||
|
||||
applyStyle();
|
||||
|
||||
showSelectedRating();
|
||||
|
||||
setupHandlers(self.options.readonly);
|
||||
|
||||
// hide the select field
|
||||
self.$elem.hide();
|
||||
};
|
||||
|
||||
this.readonly = function(state) {
|
||||
if (typeof state !== 'boolean' || getData('readOnly') == state) return;
|
||||
|
||||
setupHandlers(state);
|
||||
setData('readOnly', state);
|
||||
self.$widget.toggleClass('br-readonly');
|
||||
};
|
||||
|
||||
this.set = function(value) {
|
||||
var options = getData('userOptions');
|
||||
|
||||
if (self.$elem.find('option[value="' + value + '"]').length === 0) return;
|
||||
|
||||
// set data
|
||||
setData('ratingValue', value);
|
||||
setData('ratingText', self.$elem.find('option[value="' + value + '"]').text());
|
||||
setData('ratingMade', true);
|
||||
|
||||
setSelectFieldValue(ratingValue());
|
||||
showSelectedRating(ratingText());
|
||||
|
||||
applyStyle();
|
||||
|
||||
// onSelect callback
|
||||
if (!options.silent) {
|
||||
options.onSelect.call(
|
||||
this,
|
||||
ratingValue(),
|
||||
ratingText()
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
this.clear = function() {
|
||||
var options = getData('userOptions');
|
||||
|
||||
// restore original data
|
||||
setData('ratingValue', getData('originalRatingValue'));
|
||||
setData('ratingText', getData('originalRatingText'));
|
||||
setData('ratingMade', false);
|
||||
|
||||
resetSelectField();
|
||||
showSelectedRating(ratingText());
|
||||
|
||||
applyStyle();
|
||||
|
||||
// onClear callback
|
||||
options.onClear.call(
|
||||
this,
|
||||
ratingValue(),
|
||||
ratingText()
|
||||
);
|
||||
};
|
||||
|
||||
this.destroy = function() {
|
||||
var value = ratingValue();
|
||||
var text = ratingText();
|
||||
var options = getData('userOptions');
|
||||
|
||||
// detach handlers
|
||||
detachHandlers(self.$widget.find('a'));
|
||||
|
||||
// remove widget
|
||||
self.$widget.remove();
|
||||
|
||||
// remove data
|
||||
removeDataOnElement();
|
||||
|
||||
// unwrap the element
|
||||
unwrapElement();
|
||||
|
||||
// show the element
|
||||
self.$elem.show();
|
||||
|
||||
// onDestroy callback
|
||||
options.onDestroy.call(
|
||||
this,
|
||||
value,
|
||||
text
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
BarRating.prototype.init = function (options, elem) {
|
||||
this.$elem = $(elem);
|
||||
this.options = $.extend({}, $.fn.barrating.defaults, options);
|
||||
|
||||
return this.options;
|
||||
};
|
||||
|
||||
return BarRating;
|
||||
})();
|
||||
|
||||
$.fn.barrating = function (method, options) {
|
||||
return this.each(function () {
|
||||
var plugin = new BarRating();
|
||||
|
||||
// plugin works with select fields
|
||||
if (!$(this).is('select')) {
|
||||
$.error('Sorry, this plugin only works with select fields.');
|
||||
}
|
||||
|
||||
// method supplied
|
||||
if (plugin.hasOwnProperty(method)) {
|
||||
plugin.init(options, this);
|
||||
if (method === 'show') {
|
||||
return plugin.show(options);
|
||||
} else {
|
||||
// plugin exists?
|
||||
if (plugin.$elem.data('barrating')) {
|
||||
plugin.$widget = $(this).next('.br-widget');
|
||||
return plugin[method](options);
|
||||
}
|
||||
}
|
||||
|
||||
// no method supplied or only options supplied
|
||||
} else if (typeof method === 'object' || !method) {
|
||||
options = method;
|
||||
plugin.init(options, this);
|
||||
return plugin.show();
|
||||
|
||||
} else {
|
||||
$.error('Method ' + method + ' does not exist on jQuery.barrating');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
$.fn.barrating.defaults = {
|
||||
theme:'',
|
||||
initialRating:null, // initial rating
|
||||
allowEmpty:null, // allow empty ratings?
|
||||
emptyValue:'', // this is the expected value of the empty rating
|
||||
showValues:false, // display rating values on the bars?
|
||||
showSelectedRating:true, // append a div with a rating to the widget?
|
||||
deselectable:true, // allow to deselect ratings?
|
||||
reverse:false, // reverse the rating?
|
||||
readonly:false, // make the rating ready-only?
|
||||
fastClicks:true, // remove 300ms click delay on touch devices?
|
||||
hoverState:true, // change state on hover?
|
||||
silent:false, // supress callbacks when controlling ratings programatically
|
||||
onSelect:function (value, text, event) {
|
||||
}, // callback fired when a rating is selected
|
||||
onClear:function (value, text) {
|
||||
}, // callback fired when a rating is cleared
|
||||
onDestroy:function (value, text) {
|
||||
} // callback fired when a widget is destroyed
|
||||
};
|
||||
|
||||
$.fn.barrating.BarRating = BarRating;
|
||||
|
||||
}));
|
||||
+74
@@ -0,0 +1,74 @@
|
||||
module.exports = function (config) {
|
||||
config.set({
|
||||
// base path, that will be used to resolve files and exclude
|
||||
basePath: '',
|
||||
|
||||
frameworks: ['mocha', 'chai'],
|
||||
|
||||
// list of files / patterns to load in the browser
|
||||
files: [
|
||||
'node_modules/jquery/dist/jquery.js',
|
||||
'jquery.barrating.js',
|
||||
'test/*.js'
|
||||
],
|
||||
|
||||
// list of files to exclude
|
||||
exclude: [
|
||||
|
||||
],
|
||||
|
||||
preprocessors: {
|
||||
|
||||
},
|
||||
|
||||
// possible values: 'progress', 'junit'
|
||||
// CLI --reporters progress
|
||||
reporters: ['progress', 'junit'],
|
||||
|
||||
junitReporter: {
|
||||
outputDir: '',
|
||||
outputFile: 'test-results.xml'
|
||||
},
|
||||
|
||||
// web server port
|
||||
// CLI --port 9876
|
||||
port: 9876,
|
||||
|
||||
// enable / disable colors in the output (reporters and logs)
|
||||
// CLI --colors --no-colors
|
||||
colors: true,
|
||||
|
||||
// level of logging
|
||||
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
|
||||
// CLI --log-level debug
|
||||
logLevel: config.LOG_INFO,
|
||||
|
||||
// enable / disable watching file and executing tests whenever any file changes
|
||||
// CLI --auto-watch --no-auto-watch
|
||||
autoWatch: true,
|
||||
|
||||
// Start these browsers, currently available:
|
||||
// - Chrome
|
||||
// - ChromeCanary
|
||||
// - Firefox
|
||||
// - Opera
|
||||
// - Safari (only Mac)
|
||||
// - PhantomJS
|
||||
// - IE (only Windows)
|
||||
// CLI --browsers Chrome,Firefox,Safari
|
||||
browsers: ['PhantomJS'],
|
||||
|
||||
// If browser does not capture in given timeout [ms], kill it
|
||||
// CLI --capture-timeout 5000
|
||||
captureTimeout: 20000,
|
||||
|
||||
// Auto run tests on start (when browsers are captured) and exit
|
||||
// CLI --single-run --no-single-run
|
||||
singleRun: true,
|
||||
|
||||
// report which specs are slower than 500ms
|
||||
// CLI --report-slower-than 500
|
||||
reportSlowerThan: 500
|
||||
|
||||
})
|
||||
}
|
||||
+74
@@ -0,0 +1,74 @@
|
||||
{
|
||||
"_args": [
|
||||
[
|
||||
"jquery-bar-rating@1.2.2",
|
||||
"E:\\project\\amma\\victoryadmin\\victory"
|
||||
]
|
||||
],
|
||||
"_from": "jquery-bar-rating@1.2.2",
|
||||
"_id": "jquery-bar-rating@1.2.2",
|
||||
"_inBundle": false,
|
||||
"_integrity": "sha1-lZTWYs/53rD+ezclEbskkqQ285I=",
|
||||
"_location": "/jquery-bar-rating",
|
||||
"_phantomChildren": {},
|
||||
"_requested": {
|
||||
"type": "version",
|
||||
"registry": true,
|
||||
"raw": "jquery-bar-rating@1.2.2",
|
||||
"name": "jquery-bar-rating",
|
||||
"escapedName": "jquery-bar-rating",
|
||||
"rawSpec": "1.2.2",
|
||||
"saveSpec": null,
|
||||
"fetchSpec": "1.2.2"
|
||||
},
|
||||
"_requiredBy": [
|
||||
"/"
|
||||
],
|
||||
"_resolved": "https://registry.npmjs.org/jquery-bar-rating/-/jquery-bar-rating-1.2.2.tgz",
|
||||
"_spec": "1.2.2",
|
||||
"_where": "E:\\project\\amma\\victoryadmin\\victory",
|
||||
"bugs": {
|
||||
"url": "https://github.com/antennaio/jquery-bar-rating/issues"
|
||||
},
|
||||
"dependencies": {
|
||||
"jquery": ">=1.7.2"
|
||||
},
|
||||
"description": "Minimal, light-weight jQuery ratings.",
|
||||
"devDependencies": {
|
||||
"chai": "3.5.0",
|
||||
"gulp": "3.9.1",
|
||||
"gulp-jshint": "2.0.1",
|
||||
"gulp-less": "3.1.0",
|
||||
"gulp-rename": "1.2.2",
|
||||
"gulp-sourcemaps": "1.5.2",
|
||||
"gulp-uglify": "1.5.3",
|
||||
"jshint": "2.9.2",
|
||||
"karma": "0.13.22",
|
||||
"karma-chai": "0.1.0",
|
||||
"karma-chrome-launcher": "0.2.3",
|
||||
"karma-junit-reporter": "0.4.2",
|
||||
"karma-mocha": "0.2.2",
|
||||
"karma-phantomjs-launcher": "1.0.0",
|
||||
"mocha": "2.5.3",
|
||||
"phantomjs-prebuilt": "2.1.7",
|
||||
"run-sequence": "1.2.1"
|
||||
},
|
||||
"homepage": "https://github.com/antennaio/jquery-bar-rating#readme",
|
||||
"keywords": [
|
||||
"jquery",
|
||||
"jquery-plugin",
|
||||
"ratings",
|
||||
"rating"
|
||||
],
|
||||
"license": "MIT",
|
||||
"main": "jquery.barrating.js",
|
||||
"name": "jquery-bar-rating",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/antennaio/jquery-bar-rating.git"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "karma start"
|
||||
},
|
||||
"version": "1.2.2"
|
||||
}
|
||||
+503
@@ -0,0 +1,503 @@
|
||||
var expect = window.chai.expect;
|
||||
|
||||
function createSelect() {
|
||||
$('<select />', { 'id':'rating', 'name':'rating' }).appendTo('body');
|
||||
|
||||
for (var i = 1; i <= 10; i++) {
|
||||
var attributes = (i == 5) ?
|
||||
attributes = { 'value':i, 'selected':'selected' } :
|
||||
attributes = { 'value':i };
|
||||
|
||||
$('<option />', attributes).appendTo('#rating').html('rating-text-'+i);
|
||||
}
|
||||
}
|
||||
|
||||
function destroySelect() {
|
||||
$('#rating').remove();
|
||||
}
|
||||
|
||||
|
||||
|
||||
describe('bar rating plugin on init with custom options', function () {
|
||||
|
||||
it('should update defaults', function () {
|
||||
var BarRating;
|
||||
BarRating = new $.fn.barrating.BarRating();
|
||||
BarRating.init({
|
||||
showValues: false
|
||||
});
|
||||
expect(BarRating.options).to.be.a('object');
|
||||
expect(BarRating.options.theme).to.equal('');
|
||||
expect(BarRating.options.initialRating).to.equal(null);
|
||||
expect(BarRating.options.allowEmpty).to.equal(null);
|
||||
expect(BarRating.options.emptyValue).to.equal('');
|
||||
expect(BarRating.options.showValues).to.equal(false);
|
||||
expect(BarRating.options.showSelectedRating).to.equal(true);
|
||||
expect(BarRating.options.deselectable).to.equal(true);
|
||||
expect(BarRating.options.reverse).to.equal(false);
|
||||
expect(BarRating.options.readonly).to.equal(false);
|
||||
expect(BarRating.options.fastClicks).to.equal(true);
|
||||
expect(BarRating.options.hoverState).to.equal(true);
|
||||
expect(BarRating.options.silent).to.equal(false);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on show', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
$('#rating').barrating('show');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should have data', function () {
|
||||
expect($('#rating').data('barrating')).to.be.a('object');
|
||||
});
|
||||
|
||||
it('should wrap the select field into a wrapper div', function () {
|
||||
expect($('.br-widget').parent().hasClass('br-wrapper')).to.equal(true);
|
||||
});
|
||||
|
||||
it('should transform the select field into a rating widget', function () {
|
||||
expect($('.br-widget a')).to.have.length(10);
|
||||
});
|
||||
|
||||
it('should store rating values in data attributes', function () {
|
||||
expect($('.br-widget a:first').attr('data-rating-value')).to.equal('1');
|
||||
expect($('.br-widget a:nth-child(8)').attr('data-rating-value')).to.equal('8');
|
||||
expect($('.br-widget a:first').attr('data-rating-text')).to.equal('rating-text-1');
|
||||
expect($('.br-widget a:nth-child(8)').attr('data-rating-text')).to.equal('rating-text-8');
|
||||
});
|
||||
|
||||
it('should read the selected rating from the select field', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('5');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-selected')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(5)').hasClass('br-selected br-current')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(6)').hasClass('br-selected')).to.equal(false);
|
||||
});
|
||||
|
||||
it('should append a rating div', function () {
|
||||
expect($('div.br-current-rating')).to.have.length(1);
|
||||
});
|
||||
|
||||
it('should display a correct rating', function () {
|
||||
expect($('div.br-current-rating').html()).to.equal(
|
||||
$('#rating').data('barrating').ratingText
|
||||
);
|
||||
});
|
||||
|
||||
it('should hide the select field', function () {
|
||||
expect($('#rating').css('display')).to.equal('none');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('bar rating plugin on set fractional value', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
$('#rating')
|
||||
.barrating('show', { initialRating: 3.3 });
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set .br-half class', function () {
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-fractional')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-fractional-30')).to.equal(true);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('bar rating plugin on set fractional value < 1', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
$('#rating')
|
||||
.barrating('show', { initialRating: 0.99 });
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set .br-half class', function () {
|
||||
expect($('.br-widget a:first').hasClass('br-fractional')).to.equal(true);
|
||||
expect($('.br-widget a:first').hasClass('br-fractional-90')).to.equal(true);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('bar rating themes', function() {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set the theme class', function() {
|
||||
$('#rating').barrating({
|
||||
theme: 'bootstrap-stars'
|
||||
});
|
||||
|
||||
expect($('.br-wrapper').hasClass('br-theme-bootstrap-stars')).to.be.true;
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on show and rating selected', function () {
|
||||
|
||||
var valuesFromCallback = [];
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
onSelect:function (value, text, event) {
|
||||
valuesFromCallback.push(value, text, event);
|
||||
}
|
||||
});
|
||||
|
||||
$('.br-widget a:nth-child(2)').trigger('click');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should update data', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('2');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-2');
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(1)').hasClass('br-selected')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(2)').hasClass('br-selected br-current')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(3)').hasClass('br-selected')).to.equal(false);
|
||||
});
|
||||
|
||||
it('should display a correct rating', function () {
|
||||
expect($('div.br-current-rating').html()).to.equal(
|
||||
$('#rating').data('barrating').ratingText
|
||||
);
|
||||
});
|
||||
|
||||
it('should pass correct values to a callback', function () {
|
||||
expect(valuesFromCallback[0]).to.equal('2');
|
||||
expect(valuesFromCallback[1]).to.equal('rating-text-2');
|
||||
expect(valuesFromCallback[2]).to.be.a('object');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on show and empty ratings are allowed', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
allowEmpty: true,
|
||||
emptyValue: '-- not defined --'
|
||||
});
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should update data', function () {
|
||||
expect($('#rating').data('barrating').allowEmpty).to.equal(true);
|
||||
expect($('#rating').data('barrating').emptyRatingValue).to.equal('-- not defined --');
|
||||
expect($('#rating').data('barrating').emptyRatingText).to.equal('');
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('#rating option').first().val()).to.equal('-- not defined --');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin reversed', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
reverse:true
|
||||
});
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set correct widget class', function () {
|
||||
expect($('.br-widget').hasClass('br-reverse')).to.equal(true);
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-selected')).to.equal(false);
|
||||
expect($('.br-widget a:nth-child(5)').hasClass('br-selected br-current')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(6)').hasClass('br-selected')).to.equal(true);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin read-only', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
readonly:true
|
||||
});
|
||||
|
||||
$('.br-widget a:nth-child(6)').trigger('click');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-selected')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(5)').hasClass('br-selected br-current')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(6)').hasClass('br-selected')).to.equal(false);
|
||||
});
|
||||
|
||||
it('should ignore user input', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('5');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on deselect', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
// prepend empty OPTION to test deselectable ratings
|
||||
$('#rating').prepend($('<option />', { 'value':'' }));
|
||||
$('#rating').barrating('show');
|
||||
|
||||
// deselect rating
|
||||
$('.br-widget a:nth-child(5)').trigger('click');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should successfully deselect rating', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on clear', function () {
|
||||
|
||||
var valuesFromCallback = [];
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
onClear:function (value, text) {
|
||||
valuesFromCallback.push(value, text);
|
||||
}
|
||||
});
|
||||
$('.br-widget a:nth-child(6)').trigger('click');
|
||||
$('#rating').barrating('clear');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
$('#rating').barrating('destroy');
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should restore original rating', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('5');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
it('should reset select field', function () {
|
||||
expect($('#rating').val()).to.equal('5');
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(4)').hasClass('br-selected')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(5)').hasClass('br-selected br-current')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(6)').hasClass('br-selected')).to.equal(false);
|
||||
});
|
||||
|
||||
it('should pass correct values to a callback', function () {
|
||||
expect(valuesFromCallback[0]).to.equal('5');
|
||||
expect(valuesFromCallback[1]).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on destroy', function () {
|
||||
|
||||
var valuesFromCallback = [];
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
onDestroy:function (value, text) {
|
||||
valuesFromCallback.push(value, text);
|
||||
}
|
||||
});
|
||||
|
||||
$('#rating').barrating('destroy');
|
||||
|
||||
});
|
||||
|
||||
after(function () {
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should remove data', function () {
|
||||
expect($('#rating').data('barrating')).to.equal(undefined);
|
||||
});
|
||||
|
||||
it('should unwrap the select field', function () {
|
||||
expect($('.br-wrapper').length).to.equal(0);
|
||||
});
|
||||
|
||||
it('should remove the widget', function () {
|
||||
expect($('.br-widget').length).to.equal(0);
|
||||
});
|
||||
|
||||
it('should show the select field back again', function () {
|
||||
expect($('#rating').is(":visible")).to.equal(true);
|
||||
});
|
||||
|
||||
it('should pass correct values to a callback', function () {
|
||||
expect(valuesFromCallback[0]).to.equal('5');
|
||||
expect(valuesFromCallback[1]).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on set value', function () {
|
||||
|
||||
var valuesFromCallback = [];
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
|
||||
$('#rating').barrating('show', {
|
||||
onSelect:function (value, text) {
|
||||
valuesFromCallback.push(value, text);
|
||||
}
|
||||
}).barrating('set', 3);
|
||||
|
||||
});
|
||||
|
||||
after(function () {
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should set correct value', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal(3);
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-3');
|
||||
});
|
||||
|
||||
it('should set correct class', function () {
|
||||
expect($('.br-widget a:nth-child(3)').hasClass('br-selected')).to.equal(true);
|
||||
expect($('.br-widget a:nth-child(3)').hasClass('br-current')).to.equal(true);
|
||||
});
|
||||
|
||||
it('should pass correct values to a callback', function () {
|
||||
expect(valuesFromCallback[0]).to.equal(3);
|
||||
expect(valuesFromCallback[1]).to.equal('rating-text-3');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on set non-existing value', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
$('#rating')
|
||||
.barrating('show', { initialRating: 5 })
|
||||
.barrating('set', 9999);
|
||||
});
|
||||
|
||||
after(function () {
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should do nothing', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('5');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-5');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('bar rating plugin on change read-only state', function () {
|
||||
|
||||
before(function () {
|
||||
createSelect();
|
||||
$('#rating')
|
||||
.barrating('show', { initialRating: 1 })
|
||||
.barrating('readonly', true);
|
||||
|
||||
$('.br-widget a:last-child').trigger('click');
|
||||
});
|
||||
|
||||
after(function () {
|
||||
destroySelect();
|
||||
});
|
||||
|
||||
it('should ignore user input', function () {
|
||||
expect($('#rating').data('barrating').ratingValue).to.equal('1');
|
||||
expect($('#rating').data('barrating').ratingText).to.equal('rating-text-1');
|
||||
});
|
||||
|
||||
it('should update data', function () {
|
||||
expect($('#rating').data('barrating').readOnly).to.equal(true);
|
||||
});
|
||||
|
||||
it('should set correct widget class', function () {
|
||||
expect($('.br-widget').hasClass('br-readonly')).to.equal(true);
|
||||
});
|
||||
|
||||
});
|
||||
+75
@@ -0,0 +1,75 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-1to10 {
|
||||
|
||||
.br-widget {
|
||||
height: 50px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 12px;
|
||||
padding: 5px 0;
|
||||
height: 28px;
|
||||
float: left;
|
||||
background-color: lighten(@orange-color, 25%);
|
||||
margin: 1px;
|
||||
text-align: center;
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
background-color: @orange-color;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
font-size: 20px;
|
||||
line-height: 2;
|
||||
float: left;
|
||||
padding: 0 20px 0 20px;
|
||||
color: @orange-color;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
background-color: lighten(@orange-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: lighten(@orange-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-1to10 {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 1px solid lighten(black, 70%);
|
||||
background: white;
|
||||
height: 38px;
|
||||
.box-sizing(border-box);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+71
@@ -0,0 +1,71 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-horizontal {
|
||||
|
||||
.br-widget {
|
||||
width: 120px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 120px;
|
||||
height: 5px;
|
||||
background-color: lighten(@orange-color, 25%);
|
||||
margin: 1px;
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
background-color: @orange-color;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
width: 120px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 2;
|
||||
text-align: center;
|
||||
color: @orange-color;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
background-color: lighten(@orange-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: lighten(@orange-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-horizontal {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 1px solid lighten(black, 70%);
|
||||
background: white;
|
||||
.box-sizing(border-box);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+74
@@ -0,0 +1,74 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-movie {
|
||||
|
||||
.br-widget {
|
||||
height: 10px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 8px;
|
||||
float: left;
|
||||
background-color: lighten(@blue-color, 25%);
|
||||
margin: 1px;
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
background-color: @blue-color;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
clear: both;
|
||||
width: 240px;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
padding: .5em 0;
|
||||
color: @blue-color;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
background-color: lighten(@blue-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: lighten(@blue-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-movie {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 1px solid lighten(black, 70%);
|
||||
background: white;
|
||||
.box-sizing(border-box);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+82
@@ -0,0 +1,82 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-pill {
|
||||
|
||||
.br-widget {
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
padding: 7px 15px;
|
||||
background-color: lighten(@green-color, 25%);
|
||||
color: @green-color;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
line-height: 3;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
|
||||
&:first-child {
|
||||
-webkit-border-top-left-radius: 999px;
|
||||
-webkit-border-bottom-left-radius: 999px;
|
||||
-moz-border-radius-topleft: 999px;
|
||||
-moz-border-radius-bottomleft: 999px;
|
||||
border-top-left-radius: 999px;
|
||||
border-bottom-left-radius: 999px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
-webkit-border-top-right-radius: 999px;
|
||||
-webkit-border-bottom-right-radius: 999px;
|
||||
-moz-border-radius-topright: 999px;
|
||||
-moz-border-radius-bottomright: 999px;
|
||||
border-top-right-radius: 999px;
|
||||
border-bottom-right-radius: 999px;
|
||||
}
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
background-color: @green-color;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
background-color: lighten(@green-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-pill {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 1px solid lighten(black, 70%);
|
||||
border-left: none;
|
||||
background: white;
|
||||
.box-sizing(border-box);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 1px solid black;
|
||||
border-left: none;
|
||||
background: white;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
a:first-child {
|
||||
border-left: 1px solid black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+78
@@ -0,0 +1,78 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-reversed {
|
||||
|
||||
.br-widget {
|
||||
height: 25px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
float: left;
|
||||
background-color: lighten(@green-color, 25%);
|
||||
margin: 1px;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
line-height: 1.4;
|
||||
color: @green-color;
|
||||
text-align: center;
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
background-color: @green-color;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
line-height: 1.3;
|
||||
float: left;
|
||||
padding: 0 20px 0 20px;
|
||||
color: @green-color;
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
background-color: lighten(@green-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: lighten(@green-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-reversed {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 1px solid lighten(black, 70%);
|
||||
background: white;
|
||||
.box-sizing(border-box);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 1px solid black;
|
||||
background: white;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+74
@@ -0,0 +1,74 @@
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
|
||||
.br-theme-bars-square {
|
||||
|
||||
.br-widget {
|
||||
height: 15px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
float: left;
|
||||
border: 2px solid lighten(@blue-color, 25%);
|
||||
background-color: white;
|
||||
margin: 2px;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 2;
|
||||
text-align: center;
|
||||
color: lighten(@blue-color, 25%);
|
||||
font-weight: 600;
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 2px solid @blue-color;
|
||||
color: @blue-color;
|
||||
}
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
clear: both;
|
||||
width: 330px;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
padding: .5em 0;
|
||||
color: #646464;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
|
||||
&.br-active, &.br-selected {
|
||||
border: 2px solid lighten(@blue-color, 10%);
|
||||
color: lighten(@blue-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bars-square {
|
||||
|
||||
.br-widget {
|
||||
a {
|
||||
border: 2px solid lighten(black, 70%);
|
||||
color: lighten(black, 70%);
|
||||
|
||||
&.br-active,
|
||||
&.br-selected {
|
||||
border: 2px solid black;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
@import "variables.less";
|
||||
|
||||
.br-theme-bootstrap-stars {
|
||||
|
||||
.br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
font: normal normal normal 18px/1 'Glyphicons Halflings';
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: '\e006';
|
||||
color: @star-default;
|
||||
}
|
||||
|
||||
a.br-active:after {
|
||||
color: @star-active;
|
||||
}
|
||||
|
||||
a.br-selected:after {
|
||||
color: @star-selected;
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-bootstrap-stars {
|
||||
|
||||
.br-widget {
|
||||
a:after {
|
||||
content: '\e007';
|
||||
color: black;
|
||||
}
|
||||
|
||||
a.br-active:after,
|
||||
a.br-selected:after {
|
||||
content: '\e006';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+61
@@ -0,0 +1,61 @@
|
||||
@import "variables.less";
|
||||
|
||||
.br-theme-css-stars {
|
||||
|
||||
.br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
float: left;
|
||||
font-size: 23px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: "\2605";
|
||||
color: @star-default;
|
||||
}
|
||||
|
||||
a.br-active:after {
|
||||
color: @star-active;
|
||||
}
|
||||
|
||||
a.br-selected:after {
|
||||
color: @star-selected;
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-css-stars {
|
||||
|
||||
.br-widget {
|
||||
a:after {
|
||||
content: "\2606";
|
||||
color: black;
|
||||
}
|
||||
|
||||
a.br-active:after,
|
||||
a.br-selected:after {
|
||||
content: "\2605";
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
Generated
Vendored
+83
@@ -0,0 +1,83 @@
|
||||
@import "variables.less";
|
||||
|
||||
.br-theme-fontawesome-stars-o {
|
||||
|
||||
.br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
font: normal normal normal 20px/1 FontAwesome;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: '\f006';
|
||||
color: @star-default;
|
||||
}
|
||||
|
||||
a.br-active:after {
|
||||
content: '\f005';
|
||||
color: @green-color;
|
||||
}
|
||||
|
||||
a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: @green-color;
|
||||
}
|
||||
|
||||
a.br-fractional:after {
|
||||
content: '\f123';
|
||||
color: @green-color;
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
.br-reverse {
|
||||
a.br-fractional {
|
||||
display: inline-block;
|
||||
transform: scaleX(-1);
|
||||
-moz-transform: scaleX(-1);
|
||||
-webkit-transform: scaleX(-1);
|
||||
filter: FlipH;
|
||||
-ms-filter: "FlipH";
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-fontawesome-stars-o {
|
||||
|
||||
.br-widget {
|
||||
a:after {
|
||||
content: '\f006';
|
||||
color: black;
|
||||
}
|
||||
|
||||
a.br-active:after,
|
||||
a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: black;
|
||||
}
|
||||
|
||||
a.br-fractional:after {
|
||||
content: '\f123';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
@import "variables.less";
|
||||
|
||||
.br-theme-fontawesome-stars {
|
||||
|
||||
.br-widget {
|
||||
height: 28px;
|
||||
white-space: nowrap;
|
||||
|
||||
a {
|
||||
font: normal normal normal 20px/1 FontAwesome;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-decoration: none;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
a:after {
|
||||
content: '\f005';
|
||||
color: @star-default;
|
||||
}
|
||||
|
||||
a.br-active:after {
|
||||
color: @star-active;
|
||||
}
|
||||
|
||||
a.br-selected:after {
|
||||
color: @star-selected;
|
||||
}
|
||||
|
||||
.br-current-rating {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.br-readonly {
|
||||
a {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media print {
|
||||
.br-theme-fontawesome-stars {
|
||||
|
||||
.br-widget {
|
||||
a:after {
|
||||
content: '\f006';
|
||||
color: black;
|
||||
}
|
||||
|
||||
a.br-active:after,
|
||||
a.br-selected:after {
|
||||
content: '\f005';
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
// Box sizing
|
||||
.box-sizing (@type: border-box) {
|
||||
-webkit-box-sizing: @type;
|
||||
-moz-box-sizing: @type;
|
||||
box-sizing: @type;
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
// Bars
|
||||
@orange-color: #EDB867;
|
||||
@green-color: #50E3C2;
|
||||
@blue-color: #4278F5;
|
||||
|
||||
// Stars
|
||||
@star-default: #d2d2d2;
|
||||
@star-active: #EDB867;
|
||||
@star-selected: #EDB867;
|
||||
Reference in New Issue
Block a user