diff --git a/.gitignore b/.gitignore index e69de29..b512c09 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1 @@ +node_modules \ No newline at end of file diff --git a/Gruntfile.js b/Gruntfile.js new file mode 100644 index 0000000..0946ae8 --- /dev/null +++ b/Gruntfile.js @@ -0,0 +1,84 @@ +module.exports = function(grunt){ + 'use strict'; + + // banner + grunt.log.writeln(""); + grunt.log.writeln(" <<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>"); + grunt.log.writeln(""); + grunt.log.writeln(" Just what do you think you're doing, Matthias? "); + grunt.log.writeln(""); + grunt.log.writeln(" <<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>"); + grunt.log.writeln(""); + + // Grunt config + grunt.initConfig({ + pkg: grunt.file.readJSON('package.json'), + + // less + less: { + dist: { + options: { + compress: true, + cleancss: true, + report: 'min' + }, + files: { + 'badged/admin/assets/css/badged.min.css' : 'badged/admin/assets/less/badged.less', + 'badged/admin/assets/css/badged-ios6.min.css' : 'badged/admin/assets/less/badged-ios6.less', + 'badged/admin/assets/css/admin.min.css' : 'badged/admin/assets/less/admin.less', + }, + }, + }, + + // image optimization + imagemin: { + assets: { + options: { + optimizationLevel: 7 + }, + files: [ + { + expand: true, + cwd: 'badged/admin/assets/img/', + src: ['**/*.{png,jpg,jpeg,gif,svg}'], + dest: 'badged/admin/assets/img/' + } + ] + }, + }, + + // watch + watch: { + less: { + files: ['badged/admin/assets/less/*.less'], + tasks: ['less'] + } + } + + }); + + // Load NPM Tasks, smart code stolen from @bluemaex + require('fs').readdirSync('node_modules').filter(function (file) { + return file && file.indexOf('grunt-') > -1; + }).forEach(function (file) { + grunt.loadNpmTasks(file); + }); + + // Default Task + grunt.registerTask('default', [ + 'watch' + ]); + + // Dev server + grunt.registerTask('server', [ + 'less', + 'watch' + ]); + + // Production build + grunt.registerTask('build', [ + 'imagemin', + 'less' + ]); + +}; \ No newline at end of file diff --git a/badged/admin/assets/css/admin.css b/badged/admin/assets/css/admin.css deleted file mode 100644 index c8005ad..0000000 --- a/badged/admin/assets/css/admin.css +++ /dev/null @@ -1,79 +0,0 @@ -/* ============================================================== */ -/* The Options Page */ -/* ============================================================== */ - -#badgedoptions a, -input.button-primary, -.kremalicious { - text-decoration: none; - -webkit-transition: all .2s ease-in-out 0s; - -moz-transition: all .2s ease-in-out 0s; - -o-transition: all .2s ease-in-out 0s; - -ms-transition: all .2s ease-in-out 0s; - transition: all .2s ease-in-out 0s; -} - -#badgedoptions form h3 { - border-bottom: 1px solid #eee; - border-top: 1px solid #eee; - margin-top: .5em; - padding: 10px 0; - font-family: HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",sans-serif; - font-size: 18px; - font-weight: 400; -} - -#badgedoptions footer { - border-top: 1px solid #eee; - color: #666; -} - -#badgedoptions .icon32 { - background-image: url('../img/icon-badged-32.png'); - background-repeat: no-repeat; - background-position: center center; -} - -#badgedoptions p.submit { - background: #fcfcfc; - padding: .7em .5em; - border-top: 1px solid #eee; - margin-top: 4em; - margin-bottom: 3em; -} - -#badgedoptions .radio-row { - margin-bottom: 0; -} - -.kremalicious { - background: url('../img/kremalicious-cloud.svg') no-repeat left -2px; - background-size: 16px; - width: 16px; - height: 16px; - margin-left: 10px; - margin-right: 1px; - margin-bottom: -1px; - display: inline-block; - vertical-align: bottom; - opacity: .5; -} - -.kremalicious-link:hover .kremalicious { - opacity: 1; -} - - - -@media -only screen and (-webkit-min-device-pixel-ratio: 1.5), -only screen and ( min--moz-device-pixel-ratio: 1.5), -only screen and ( -o-min-device-pixel-ratio: 3/2), -only screen and ( min-device-pixel-ratio: 1.5) { - #badgedoptions .icon32 { - background-image: url('../img/icon-badged-32@2x.png') !important; - -webkit-background-size: 32px 32px; - -moz-background-size: 32px 32px; - background-size: 32px 32px; - } -} \ No newline at end of file diff --git a/badged/admin/assets/css/admin.min.css b/badged/admin/assets/css/admin.min.css new file mode 100644 index 0000000..d0c65e5 --- /dev/null +++ b/badged/admin/assets/css/admin.min.css @@ -0,0 +1,8 @@ + +#badgedoptions a,#badgedoptions input.button-primary,#badgedoptions .kremalicious{text-decoration:none;-webkit-transition:all .2s ease-in-out 0;transition:all .2s ease-in-out 0} +#badgedoptions form h3{font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",sans-serif;font-size:18px;font-weight:400;border-bottom:1px solid #eee;border-top:1px solid #eee;margin-top:.5em;padding:10px 0} +#badgedoptions footer{border-top:1px solid #eee;color:#666} +#badgedoptions .icon32{background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAADi0lEQVRIx42VbUyVZRjH/xwTBHG4wkgHW2YuF8sMKmvuzKJWSeW01iznh2qrsVq1NqutRqMXdFbo5oIPAplIviR4GK9RB20m5kmQQoFUOgbyKgcIHe8cf314zvGc5zzIvH9fnl3/+7nu9/8lTdfCFat79JDsekIpWqUkLdF83aKbaGGaq7ujUj/adfhMq8c9AONTrZ6m3kLX65larQRFzPx7hO6865X9fwxPME3rvZpVphTF3Xgmc/Xw1yVXx5mh/Tv49g4tm34eMQueKWnydxzjMm7cNNOCmzb6mfQpk95tZUpSpGX0Bamnu4wuo1zkr2loZ8qXZHetVijcvPaVpS2G2MdpE7X8fv37b4Z9KdIPaalmBXZ+8VelhtCGy0Q5TiqpCYoMADA+tTFDsf4EUYs3DY0BdHHcRA3FQDc/BsVqGQHgZKdWabYx/rI9dQDD/BpEFQ4KOQ90sc+k1PuW8c4uxUlSxKKXjXP/E+d1DlBGHR6Mee0NUpw4cQNQ361HFCYt/PwQwBWqgsgJOvtOvjNpVRwBwHst+S1FSvc7zgOcpTyIPThw4KAF6CDPpJVT7tvKLxxaJK1u9gCUkmcik0y+5Chwka0hWh4uAPafUaL0rHF5d7DFwsdUAhfYbFGKADjWqZXSC5NegG/YZiGdKuACH1qUgwDU9courR+fAtjJdgufUQ208olFOQyAq0d26bm+UYDdfGthK07gHzIsSjUAzg49KqU0eADKybWQ5dvELRblFADfN2q5lFTQBNDIXgvZHAPayLIo/QC8f1AJUnxaAcAIRRbyOQG0kx0S/8X3oG5P0zwpKnJj9zBAPRUh/IDLd5HM8TYAKi/JrlmSTQ9sPwkwgYsaE0XUA10UmqINviv+fI4SjOd8a8wbHcPGezhh4jdyKSCHn4NijT5z+6lTT2uOkcCmxFcPeK8BDNIQ4khmzmEY9sBYYrriFRbw4yd31vvt1E3TDWjzW6530z6tMOzEb2qxWp971v+APbhpDaGdIZ86MpVWIruiza5sU5zWfXBkzOtPMs4g/fTSRz9DBCpNz+iafNkVE5h+IMVteiw1t/m/mQpLRce9GUpWtGzTlRab5mm5Xnu34vjlSW/or1cmSjvW5OtFLdEc6+iBvQhXnB7Uhjs+3VxdcK7o0qn+oz3F7dmNbxbrPa1V4s3UaJsiFKN4JesprdMGvaS1elz3aaGiNds69v/dlhd6/99OsgAAAABJRU5ErkJggg==') no-repeat center center}@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {#badgedoptions .icon32 #badgedoptions .icon32{background-image:url('../img/icon-badged-32@2x.png') !important;background-size:32px 32px}} +#badgedoptions p.submit{background:#fcfcfc;padding:.7em .5em;border-top:1px solid #eee;margin-top:4em;margin-bottom:3em} +#badgedoptions .radio-row{margin-bottom:0} +.kremalicious{background:url('../img/kremalicious-cloud.svg') no-repeat left -2px;background-size:16px;width:16px;height:16px;margin-left:10px;margin-right:1px;margin-bottom:-1px;display:inline-block;vertical-align:bottom;opacity:.5}.kremalicious-link:hover .kremalicious{opacity:1} diff --git a/badged/admin/assets/css/badged-ios6.css b/badged/admin/assets/css/badged-ios6.css deleted file mode 100644 index c2ac340..0000000 --- a/badged/admin/assets/css/badged-ios6.css +++ /dev/null @@ -1,137 +0,0 @@ - -/* ============================================================== */ -/* Badged pre-iOS7 styles */ -/* ------------------------ */ -/* by Matthias Kretschmann | http://mkretschmann.com */ -/* ============================================================== */ - - -/* Select all instances of the WP notification bubble using the - same selectors WP uses */ - -#adminmenu .awaiting-mod, -#adminmenu span.update-plugins, -#sidemenu li a span.update-plugins, -#sidemenu a .update-plugins, -#rightnow .reallynow, -#wp-admin-bar-updates .ab-label, -#wp-admin-bar-comments .ab-label { - - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - - /* need to be rude for these */ - background-color: #d5231f !important; - -webkit-box-shadow: 0px 2px 2px #888 !important; - -moz-box-shadow: 0px 2px 2px #888 !important; - box-shadow: 0px 2px 2px #888 !important; - - color: #fff; /* just in case, is white per WP default */ - font: 11px/17px Helvetica, Verdana, Geneva, sans-serif; - text-align: center; - text-shadow: 0 1px 1px #771717; - - background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 100%); - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.3)), color-stop(100%,rgba(255,255,255,0))); - background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); - background-image: -o-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); - background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); - background-image: linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ); - - border: 2px solid #fff; - - -webkit-background-clip: padding-box; - -moz-background-clip: padding-box; - background-clip: padding-box; - - margin-top: -2px; - min-width: 20px; - height: 20px; - display: inline-block; - -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; - padding-left: 3px; - padding-right: 3px; - position: relative; - margin-left: 2px; - -} - - /* darker shadow for badged on active menus */ - #adminmenu li.current a .awaiting-mod, - #adminmenu li a.wp-has-current-submenu .update-plugins { - -webkit-box-shadow: 0px 2px 2px #444 !important; - -moz-box-shadow: 0px 2px 2px #444 !important; - box-shadow: 0px 2px 2px #444 !important; - } - - /* inject another styling layer, for inset shadow & shine gradient */ - #adminmenu .awaiting-mod:before, - #adminmenu .update-plugins:before, - #sidemenu .update-plugins:before, - .reallynow:before, - #wp-admin-bar-updates .ab-label:before, - #wp-admin-bar-comments .ab-label:before { - content: ""; - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - - -webkit-border-radius: 50%; - -moz-border-radius: 50%; - border-radius: 50%; - - -webkit-box-shadow: inset 0 0 3px #631212; - -moz-box-shadow: inset 0 0 3px #631212; - box-shadow: inset 0 0 3px #631212; - - background: -moz-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 59%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%); - background: -webkit-gradient(radial, center -5px, 0px, center -5px, 100%, color-stop(0%,rgba(255,255,255,0.3)), color-stop(59%,rgba(255,255,255,0.3)), color-stop(65%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0))); - background: -webkit-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); - background: -o-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); - background: -ms-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); - background: radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=1 ); - - } - -/* a bit less padding on the number inside */ -#adminmenu li .awaiting-mod span, -#adminmenu li span.update-plugins span, -#sidemenu li a span.update-plugins span { - padding: 0 2px; -} - - -/* ============================================================== */ -/* IE 8 Only Styles */ -/* ============================================================== */ - -.ie8 #adminmenu .awaiting-mod, -.ie8 #adminmenu span.update-plugins, -.ie8 #sidemenu li a span.update-plugins, -.ie8 #sidemenu a .update-plugins, -.ie8 #rightnow .reallynow, -.ie8 #wp-admin-bar-updates .ab-label, -.ie8 #wp-admin-bar-comments .ab-label { - filter: - progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ) - progid:DXImageTransform.Microsoft.Shadow(color=#888888,direction=180,strength=3) /* box-shadow replacement, bottom */ - progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=90,strength=2) /* right */ - progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=270,strength=2) /* left */; -} - - /* darker shadow for badged on active menus */ - .ie8 #adminmenu li.current a .awaiting-mod, - .ie8 #adminmenu li a.wp-has-current-submenu .update-plugins { - filter: - progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ) - progid:DXImageTransform.Microsoft.Shadow(color=#444444,direction=180,strength=3) /* bottom */ - progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=90,strength=2) /* right */ - progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=270,strength=2) /* left */; - } \ No newline at end of file diff --git a/badged/admin/assets/css/badged-ios6.min.css b/badged/admin/assets/css/badged-ios6.min.css new file mode 100644 index 0000000..8ab6db3 --- /dev/null +++ b/badged/admin/assets/css/badged-ios6.min.css @@ -0,0 +1,6 @@ + +#adminmenu .awaiting-mod,#adminmenu span.update-plugins,#sidemenu li a span.update-plugins,#sidemenu a .update-plugins,#rightnow .reallynow,#wp-admin-bar-updates .ab-label,#wp-admin-bar-comments .ab-label{font-size:11px;font-weight:normal;font-family:Helvetica,Verdana,Geneva,sans-serif;line-height:17px;color:#fff;text-align:center;text-shadow:0 1px 1px #771717;background-color:#d5231f !important;box-shadow:0px 2px 2px #888 !important;border:2px solid #fff;background-image:-webkit-linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));background-image:linear-gradient(top, rgba(255,255,255,0.3), rgba(255,255,255,0));background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4dffffff', endColorstr='#00ffffff', GradientType=0);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:10px;background-clip:padding-box;min-width:20px;height:20px;padding-left:3px;padding-right:3px;display:inline-block;margin-left:2px;margin-top:-2px;position:relative}#adminmenu .awaiting-mod:before,#adminmenu span.update-plugins:before,#sidemenu li a span.update-plugins:before,#sidemenu a .update-plugins:before,#rightnow .reallynow:before,#wp-admin-bar-updates .ab-label:before,#wp-admin-bar-comments .ab-label:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;border-radius:10px;background-clip:padding-box;box-shadow:inset 0 0 3px #631212;background:-webkit-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 59%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%);background:radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 59%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4dffffff', endColorstr='#00ffffff', GradientType=1)} +#adminmenu li.current a .awaiting-mod,#adminmenu li a.wp-has-current-submenu .update-plugins{box-shadow:0px 2px 2px #444 !important} +#adminmenu li .awaiting-mod span,#adminmenu li span.update-plugins span,#sidemenu li a span.update-plugins span{padding:0 2px} +.ie8 #adminmenu .awaiting-mod,.ie8 #adminmenu span.update-plugins,.ie8 #sidemenu li a span.update-plugins,.ie8 #sidemenu a .update-plugins,.ie8 #rightnow .reallynow,.ie8 #wp-admin-bar-updates .ab-label,.ie8 #wp-admin-bar-comments .ab-label{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4dffffff', endColorstr='#00ffffff', GradientType=0) progid:DXImageTransform.Microsoft.Shadow(color=#888888, direction=180, strength=3) progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3, direction=90, strength=2) progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3, direction=270, strength=2) } +.ie8 #adminmenu li.current a .awaiting-mod,.ie8 #adminmenu li a.wp-has-current-submenu .update-plugins{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4dffffff', endColorstr='#00ffffff', GradientType=0) progid:DXImageTransform.Microsoft.Shadow(color=#444444, direction=180, strength=3) progid:DXImageTransform.Microsoft.Shadow(color=#666666, direction=90, strength=2) progid:DXImageTransform.Microsoft.Shadow(color=#666666, direction=270, strength=2) } diff --git a/badged/admin/assets/css/badged.css b/badged/admin/assets/css/badged.css deleted file mode 100644 index 163a06b..0000000 --- a/badged/admin/assets/css/badged.css +++ /dev/null @@ -1,65 +0,0 @@ -/* ============================================================== */ -/* Badged */ -/* ------------------------ */ -/* by Matthias Kretschmann | http://mkretschmann.com */ -/* ============================================================== */ - - -/* Select all instances of the WP notification bubble using the - same selectors WP uses */ - -#adminmenu .awaiting-mod, -#adminmenu span.update-plugins, -#sidemenu li a span.update-plugins, -#sidemenu a .update-plugins, -#rightnow .reallynow, -#wp-admin-bar-updates .ab-label, -#wp-admin-bar-comments .ab-label { - - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - - /* WP defaults overwrites, need to be rude for these */ - background: #ff0000 !important; - box-shadow: 0 1px 0 rgba(0,0,0,.2) !important; - text-shadow: none !important; - - color: #fff; /* just in case, is white per WP default */ - font: 12px/20px 'Helvetica Neue', Helvetica, Verdana, Geneva, sans-serif; - font-weight: 200; - text-align: center; - - min-width: 20px; - height: 20px; - display: inline-block; - -moz-border-radius: 10px; - -webkit-border-radius: 10px; - border-radius: 10px; - padding: 0 2px; - - margin-top: -2px; - vertical-align: baseline; -} - -#adminmenu li .awaiting-mod span, -#adminmenu li span.update-plugins span, -#sidemenu li a span.update-plugins span { - padding: 0; -} - - -/* ============================================================== */ -/* IE 8 Only Styles */ -/* ============================================================== */ - -.ie8 #adminmenu .awaiting-mod, -.ie8 #adminmenu span.update-plugins, -.ie8 #sidemenu li a span.update-plugins, -.ie8 #sidemenu a .update-plugins, -.ie8 #rightnow .reallynow { - filter: - progid:DXImageTransform.Microsoft.Shadow(color=#888888,direction=180,strength=3) /* box-shadow replacement, bottom */ - progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=90,strength=2) /* right */ - progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=270,strength=2) /* left */; -} \ No newline at end of file diff --git a/badged/admin/assets/css/badged.min.css b/badged/admin/assets/css/badged.min.css new file mode 100644 index 0000000..8ce590f --- /dev/null +++ b/badged/admin/assets/css/badged.min.css @@ -0,0 +1,3 @@ + +#adminmenu .awaiting-mod,#adminmenu span.update-plugins,#sidemenu li a span.update-plugins,#sidemenu a .update-plugins,#rightnow .reallynow,#wp-admin-bar-updates .ab-label,#wp-admin-bar-comments .ab-label{font-size:12px;font-weight:200;font-family:'Helvetica Neue',Helvetica,Verdana,Geneva,sans-serif;line-height:20px;color:#fff;text-align:center;background:#ff0000 !important;box-shadow:0 1px 0 rgba(0,0,0,0.2) !important;text-shadow:none !important;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:10px;background-clip:padding-box;min-width:20px;height:20px;padding:0 2px;display:inline-block;margin-top:-2px;vertical-align:baseline} +#adminmenu li .awaiting-mod span,#adminmenu li span.update-plugins span,#sidemenu li a span.update-plugins span{padding:0} diff --git a/badged/admin/assets/less/admin.less b/badged/admin/assets/less/admin.less new file mode 100644 index 0000000..8df1909 --- /dev/null +++ b/badged/admin/assets/less/admin.less @@ -0,0 +1,73 @@ +///////////////////////////////////// +// +// Badged Settings Page +// ------------------------ +// by Matthias Kretschmann +// mkretschmann.com +// +///////////////////////////////////// + + +@import 'scaffolding.less'; + +// isolate settings style just in case +#badgedoptions { + + a, + input.button-primary, + .kremalicious { + text-decoration: none; + .transition; + } + + form h3 { + font-family: HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",sans-serif; + font-size: 18px; + font-weight: 400; + border-bottom: 1px solid #eee; + border-top: 1px solid #eee; + margin-top: .5em; + padding: 10px 0; + } + + footer { + border-top: 1px solid #eee; + color: #666; + } + + .icon32 { + background: data-uri('../img/icon-badged-32.png') no-repeat center center; + + @media @highDPI { + #badgedoptions .icon32 { + background-image: url('../img/icon-badged-32@2x.png') !important; + background-size: 32px 32px; + } + } + } + + p.submit { + background: #fcfcfc; + padding: .7em .5em; + border-top: 1px solid #eee; + margin-top: 4em; + margin-bottom: 3em; + } + + .radio-row { margin-bottom: 0 } +} + +.kremalicious { + background: url('../img/kremalicious-cloud.svg') no-repeat left -2px; + background-size: 16px; + width: 16px; + height: 16px; + margin-left: 10px; + margin-right: 1px; + margin-bottom: -1px; + display: inline-block; + vertical-align: bottom; + opacity: .5; + + .kremalicious-link:hover & { opacity: 1 } +} \ No newline at end of file diff --git a/badged/admin/assets/less/badged-ios6.less b/badged/admin/assets/less/badged-ios6.less new file mode 100644 index 0000000..a07500f --- /dev/null +++ b/badged/admin/assets/less/badged-ios6.less @@ -0,0 +1,109 @@ +///////////////////////////////////// +// +// Badged pre-iOS7 styles +// ------------------------ +// by Matthias Kretschmann +// mkretschmann.com +// +///////////////////////////////////// + + +@import 'scaffolding.less'; + +// Select all instances of the WP notification bubble +// using the same selectors WP uses +#adminmenu .awaiting-mod, +#adminmenu span.update-plugins, +#sidemenu li a span.update-plugins, +#sidemenu a .update-plugins, +#rightnow .reallynow, +#wp-admin-bar-updates .ab-label, +#wp-admin-bar-comments .ab-label { + + font-size: @font-size-ios6; + font-weight: @font-weight-ios6; + font-family: @font-family-ios6; + line-height: @line-height-ios6; + color: @font-color-ios6; + text-align: center; + text-shadow: 0 1px 1px #771717; + + /* need to be rude for these */ + background-color: #d5231f !important; + box-shadow: 0px 2px 2px #888 !important; + border: 2px solid #fff; + + #gradient > .vertical(rgba(255,255,255,0.3), rgba(255,255,255,0)); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ); + + .box-sizing(border-box); + .border-radius; + + min-width: 20px; + height: 20px; + padding-left: 3px; + padding-right: 3px; + display: inline-block; + margin-left: 2px; + margin-top: -2px; + position: relative; + + // inject another styling layer, for inset shadow & shine gradient + &:before { + content: ""; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + + .border-radius; + box-shadow: inset 0 0 3px #631212; + + background: -webkit-radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); + background: radial-gradient(center -5px, circle, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.3) 59%,rgba(255,255,255,0) 65%,rgba(255,255,255,0) 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=1 ); + } +} + +/* darker shadow for badged on active menus */ +#adminmenu li.current a .awaiting-mod, +#adminmenu li a.wp-has-current-submenu .update-plugins { + box-shadow: 0px 2px 2px #444 !important; +} + +/* a bit less padding on the number inside */ +#adminmenu li .awaiting-mod span, +#adminmenu li span.update-plugins span, +#sidemenu li a span.update-plugins span { + padding: 0 2px; +} + + +/* ============================================================== */ +/* IE 8 Only Styles */ +/* ============================================================== */ + +.ie8 #adminmenu .awaiting-mod, +.ie8 #adminmenu span.update-plugins, +.ie8 #sidemenu li a span.update-plugins, +.ie8 #sidemenu a .update-plugins, +.ie8 #rightnow .reallynow, +.ie8 #wp-admin-bar-updates .ab-label, +.ie8 #wp-admin-bar-comments .ab-label { + filter: + progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ) + progid:DXImageTransform.Microsoft.Shadow(color=#888888,direction=180,strength=3) /* box-shadow replacement, bottom */ + progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=90,strength=2) /* right */ + progid:DXImageTransform.Microsoft.Shadow(color=#b3b3b3,direction=270,strength=2) /* left */; +} + + /* darker shadow for badged on active menus */ + .ie8 #adminmenu li.current a .awaiting-mod, + .ie8 #adminmenu li a.wp-has-current-submenu .update-plugins { + filter: + progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dffffff', endColorstr='#00ffffff',GradientType=0 ) + progid:DXImageTransform.Microsoft.Shadow(color=#444444,direction=180,strength=3) /* bottom */ + progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=90,strength=2) /* right */ + progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=270,strength=2) /* left */; + } \ No newline at end of file diff --git a/badged/admin/assets/less/badged.less b/badged/admin/assets/less/badged.less new file mode 100644 index 0000000..0df9240 --- /dev/null +++ b/badged/admin/assets/less/badged.less @@ -0,0 +1,51 @@ +///////////////////////////////////// +// +// Badged +// ------------------------ +// by Matthias Kretschmann +// mkretschmann.com +// +///////////////////////////////////// + + +@import 'scaffolding.less'; + +// Select all instances of the WP notification bubble +// using the same selectors WP uses +#adminmenu .awaiting-mod, +#adminmenu span.update-plugins, +#sidemenu li a span.update-plugins, +#sidemenu a .update-plugins, +#rightnow .reallynow, +#wp-admin-bar-updates .ab-label, +#wp-admin-bar-comments .ab-label { + + font-size: @font-size; + font-weight: @font-weight; + font-family: @font-family; + line-height: @line-height; + color: @font-color; + text-align: center; + + // WP defaults overwrites, need to be rude for these + background: #ff0000 !important; + box-shadow: 0 1px 0 rgba(0,0,0,.2) !important; + text-shadow: none !important; + + .box-sizing(border-box); + .border-radius; + + min-width: 20px; + height: 20px; + padding: 0 2px; + display: inline-block; + + margin-top: -2px; + vertical-align: baseline; +} + +#adminmenu li .awaiting-mod span, +#adminmenu li span.update-plugins span, +#sidemenu li a span.update-plugins span { + padding: 0; +} \ No newline at end of file diff --git a/badged/admin/assets/less/index.php b/badged/admin/assets/less/index.php new file mode 100755 index 0000000..a99ea83 --- /dev/null +++ b/badged/admin/assets/less/index.php @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/badged/admin/assets/less/scaffolding.less b/badged/admin/assets/less/scaffolding.less new file mode 100644 index 0000000..6e02c99 --- /dev/null +++ b/badged/admin/assets/less/scaffolding.less @@ -0,0 +1,55 @@ +///////////////////////////////////// +// Scaffolding +///////////////////////////////////// + + +// +// Variables +// + +@font-size: 12px; +@line-height: 20px; +@font-weight: 200; +@font-family: 'Helvetica Neue', Helvetica, Verdana, Geneva, sans-serif; +@font-color: #fff; + +@font-size-ios6: 11px; +@line-height-ios6: 17px; +@font-weight-ios6: normal; +@font-family-ios6: Helvetica, Verdana, Geneva, sans-serif; +@font-color-ios6: #fff; + +// High DPI Media Query +@highDPI: ~"print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) "; + +// +// Mixins +// + +// Border Radius +.border-radius(@radius: 10px) { + border-radius: @radius; + background-clip: padding-box; +} + +// Gradients +#gradient { + .vertical(@startColor: #555, @endColor: #333) { + background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: linear-gradient(top, @startColor, @endColor); // The standard + background-repeat: repeat-x; + } +} + +// Transitions +.transition(@transition: all .2s ease-in-out 0s) { + -webkit-transition: @transition; + transition: @transition; +} + +// Box sizing +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} \ No newline at end of file diff --git a/badged/admin/class-badged-admin.php b/badged/admin/class-badged-admin.php index 96b4e8b..2f8efbe 100755 --- a/badged/admin/class-badged-admin.php +++ b/badged/admin/class-badged-admin.php @@ -277,7 +277,7 @@ class Badged { $screen = get_current_screen(); if ( $screen->id == $this->plugin_screen_hook_suffix ) { - wp_register_style( $this->plugin_slug .'-admin-styles', BADGED_URL . 'admin/assets/css/admin.css', array(), self::VERSION ); + wp_register_style( $this->plugin_slug .'-admin-styles', BADGED_URL . 'admin/assets/css/admin.min.css', array(), self::VERSION ); wp_enqueue_style( $this->plugin_slug .'-admin-styles' ); } @@ -285,13 +285,13 @@ class Badged { // Default Style if ( 'ios7' == $options['style'] ) { - wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged.css', array(), self::VERSION ); + wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged.min.css', array(), self::VERSION ); wp_enqueue_style( $this->plugin_slug .'-badged-styles' ); } // Old Style if ( 'ios6' == $options['style'] ) { - wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged-ios6.css', array(), self::VERSION ); + wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged-ios6.min.css', array(), self::VERSION ); wp_enqueue_style( $this->plugin_slug .'-badged-styles' ); } @@ -308,13 +308,13 @@ class Badged { // Default Style if ( 'ios7' == $options['style'] ) { - wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged.css', array(), self::VERSION ); + wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged.min.css', array(), self::VERSION ); wp_enqueue_style( $this->plugin_slug .'-badged-styles' ); } // Old Style if ( 'ios6' == $options['style'] ) { - wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged-ios6.css', array(), self::VERSION ); + wp_register_style( $this->plugin_slug .'-badged-styles', BADGED_URL . 'admin/assets/css/badged-ios6.min.css', array(), self::VERSION ); wp_enqueue_style( $this->plugin_slug .'-badged-styles' ); } diff --git a/package.json b/package.json new file mode 100644 index 0000000..13fade9 --- /dev/null +++ b/package.json @@ -0,0 +1,18 @@ +{ + "name": "Badged", + "author": "Matthias Kretschmann ", + "description": "iOS Style Notification Badges for WordPress", + "version": "1.0.0", + "main": "Gruntfile.js", + "dependencies": {}, + "devDependencies": { + "grunt": "~0.4.1", + "grunt-contrib-less": "~0.6.4", + "grunt-contrib-watch": "~0.5.3", + "grunt-contrib-imagemin": "~0.1.4" + }, + "repository": { + "type": "git", + "url": "git@github.com:kremalicious/Badged.git" + } +}