1. Mathias Panzenböck
  2. Greattune Player

Commits

Mathias Panzenböck  committed 3567ce2

style checkboxes (in webkit)

  • Participants
  • Parent commits 41146b9
  • Branches default

Comments (0)

Files changed (12)

File images/Makefile

View file
 		current.png \
 		random.png \
 		playlists.png \
-		save.png
+		save.png \
+		check_mark.png
 	convert -append $+ $@
 
 sprite_bright.png: \
 		current_bright.png \
 		random_bright.png \
 		playlists_bright.png \
-		save_bright.png
+		save_bright.png \
+		check_mark_bright.png
 	convert -append $+ $@
 
 %.png: %.svg

File images/check_mark.png

Added
New image

File images/check_mark.svg

View file
Added
New image

File images/check_mark_bright.png

Added
New image

File images/check_mark_bright.svg

View file
Added
New image

File images/sprite.png

Old
Old image
New
New image

File images/sprite_bright.png

Old
Old image
New
New image

File index.html

View file
 			</div>
 
 			<div id="member-container" title="Check if you are a stream member.">
-				<input id="member" type="checkbox" autocomplete="off"/>
-				<label for="member">Member</label>
+				<label for="member"><input id="member" type="checkbox" autocomplete="off"/>
+				Member</label>
 			</div>
 			<form action="javascript:void(0)" id="credentials" class="popup-menu popup-form" onsubmit="Magnatune.login(); return false;"
 					data-button="member-container" data-hide-action="Magnatune.Player.cancelCredentials();" style="display:none;">

File javascripts/magnatune.js

View file
 if ($.browser.msie) {
 	$(document.documentElement).addClass('ie ie'+$.browser.parsedVersion[0]);
 }
+else if ($.browser.mozilla) {
+	$(document.documentElement).addClass('mozilla firefox'+$.browser.parsedVersion[0]);
+}
+else if ($.browser.webkit) {
+	$(document.documentElement).addClass('webkit');
+	if ($.browser.chrome) {
+		$(document.documentElement).addClass('chrome chrome'+$.browser.parsedVersion[0]);
+	}
+	else if ($.browser.safari) {
+		$(document.documentElement).addClass('safari safari'+$.browser.parsedVersion[0]);
+	}
+}
+else if ($.browser.opera) {
+		$(document.documentElement).addClass('opera opera'+$.browser.parsedVersion[0]);
+}
 
 $.extend($.fn.socialSharePrivacy.settings, {
 	order: ['facebook', 'gplus', 'twitter', 'reddit', 'pinterest', 'tumblr', 'mail'],

File package.json

View file
 {
   "name": "GreattunePlayer",
   "subdomain": "greattuneplayer",
-  "version": "0.1.0-147",
+  "version": "0.1.0-154",
   "author": "Mathias Panzenböck",
   "description": "This is a HTML5 audio player based on the music from Magnatune.com",
   "bin": {

File style.css

View file
 }
 
 input[type="checkbox"] {
-	vertical-align: middle;
 	margin: 0;
+	padding: 0;
+	cursor: pointer;
+}
+
+html:not(.ie8) input[type="checkbox"] {
+	background-repeat: no-repeat;
+	-webkit-appearance: none;
+	width: 16px;
+	height: 16px;
+	background-color: #111111;
+	background-position: 0px -128px;
+	box-sizing: content-box;
+	color: #9f9f9f;
+}
+
+html:not(.mozilla) input[type="checkbox"] {
+	vertical-align: top;
+}
+
+html.mozilla input[type="checkbox"] {
+	vertical-align: bottom;
+}
+
+html:not(.mozilla) input[type="checkbox"]:checked {
+	background-image: url(/images/sprite.png);
+}
+
+input[type="checkbox"]:hover,
+input[type="checkbox"]:focus,
+input[type="checkbox"]:active {
+	background-color: #363636;
 }
 
 #play-button,
 textarea,
 input[type="submit"],
 input[type="button"],
+input[type="checkbox"],
 .text-input-container,
 #play-control-buttons {
 	display: inline-block;
 		1px 1px 0px rgba(255,255,255,0.04);
 }
 
+html.ie8 input[type="checkbox"] {
+	border-radius: 0;
+	border: 0;
+	box-shadow: none;
+	vertical-align: baseline;
+}
+
 #currently-playing,
 .button,
 button,
 	left: 270px;
 }
 
+label.notification-controls,
 #member-container input,
 #member-container label,
 #export-member-options label {

File style_bright.css

View file
 	border-right-color: transparent;
 }
 
+html:not(.ie8) input[type="checkbox"] {
+	background-color: #ffffff;
+	color: #333333;
+}
+
+html:not(.mozilla) input[type="checkbox"]:checked {
+	background-image: url(/images/sprite_bright.png);
+}
+
+input[type="checkbox"]:hover,
+input[type="checkbox"]:focus,
+input[type="checkbox"]:active {
+	background-color: #E6E6E6;
+}
+
 #play-button,
 #breadcrumbs a,
 .button,
 
 textarea,
 #currently-playing,
-.text-input-container {
+.text-input-container,
+input[type="checkbox"] {
 	box-shadow: inset 0px 1px 2px 0px rgba(0,0,0,0.1);
 }
 
 textarea,
 input[type="submit"],
 input[type="button"],
+input[type="checkbox"],
 .text-input-container,
 #play-control-buttons {
 	border-color: #cccccc;