diff --git a/website/public/css/index.styl b/website/public/css/index.styl index 82f5c39d47..b61018e878 100644 --- a/website/public/css/index.styl +++ b/website/public/css/index.styl @@ -193,4 +193,12 @@ a.label text-decoration line-through .markdown-preview markdown code - white-space inherit \ No newline at end of file + white-space inherit + +// By default everything should render as pixelart, except images from img tags (which tend to be things like gravatars, +// screenshots and so on) +* + image-rendering: pixelated + +.rasterize + image-rendering: auto diff --git a/website/views/options/profile.jade b/website/views/options/profile.jade index 5d3904bd56..bd39d80ba8 100644 --- a/website/views/options/profile.jade +++ b/website/views/options/profile.jade @@ -251,7 +251,7 @@ script(id='partials/options.profile.profile.html', type='text/ng-template') |  - h4=env.t('displayPhoto') - img(ng-show='profile.profile.imageUrl', ng-src='{{profile.profile.imageUrl}}') + img.rasterize(ng-show='profile.profile.imageUrl', ng-src='{{profile.profile.imageUrl}}') span.muted(ng-hide='profile.profile.imageUrl') -  =env.t('none') |  - diff --git a/website/views/options/settings.jade b/website/views/options/settings.jade index 0a6c59027e..2ef85b72a0 100644 --- a/website/views/options/settings.jade +++ b/website/views/options/settings.jade @@ -191,7 +191,7 @@ script(type='text/ng-template', id='partials/options.settings.api.html') h6=env.t('APIToken') pre.prettyprint {{user.apiToken}} h6=env.t('qrCode') - img(src='https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=%7B%22address%22%3A%22https%3A%2F%2Fhabitrpg.com%22%2C%22user%22%3A%22{{user.id}}%22%2C%22key%22%3A%22{{user.apiToken}}%22%7D&choe=UTF-8&chld=L', alt='qrcode') + img.rasterize(src='https://chart.googleapis.com/chart?cht=qr&chs=200x200&chl=%7B%22address%22%3A%22https%3A%2F%2Fhabitrpg.com%22%2C%22user%22%3A%22{{user.id}}%22%2C%22key%22%3A%22{{user.apiToken}}%22%7D&choe=UTF-8&chld=L', alt='qrcode') hr @@ -270,7 +270,7 @@ script(id='partials/options.settings.notifications.html', type="text/ng-template =env.t('emailNotifications') .panel-body - each notification in ['newPM', 'wonChallenge', 'giftedGems', 'giftedSubscription', 'invitedParty', 'invitedGuild', 'kickedGroup', 'questStarted', 'invitedQuest', 'importantAnnouncements', 'weeklyRecaps'] + each notification in ['newPM', 'wonChallenge', 'giftedGems', 'giftedSubscription', 'invitedParty', 'invitedGuild', 'kickedGroup', 'questStarted', 'invitedQuest', 'importantAnnouncements', 'weeklyRecaps'] -var preference = 'user.preferences.emailNotifications.' + notification -var unsubscribeFromAll = 'user.preferences.emailNotifications.unsubscribeFromAll' diff --git a/website/views/options/social/group.jade b/website/views/options/social/group.jade index 05e56f0743..4ec0a53cb1 100644 --- a/website/views/options/social/group.jade +++ b/website/views/options/social/group.jade @@ -48,11 +48,11 @@ a.pull-right.gem-wallet(ng-if='group.type!="party"', popover-trigger='mouseenter select#group-leader-selection(ng-model='group._newLeader', ng-options='member.profile.name for member in group.members') div(ng-show='!group._editing') - img.pull-right(ng-show='group.logo', ng-src='{{group.logo}}') + img.rasterize.pull-right(ng-show='group.logo', ng-src='{{group.logo}}') markdown(text='group.description') hr p=env.t('groupLeader') - |: + |: a(class='badge badge-info', ng-click='clickMember(group.leader._id, true)') | {{group.leader.profile.name}} .slight-vertical-padding diff --git a/website/views/shared/modals/members.jade b/website/views/shared/modals/members.jade index 40c395dfb6..f3b7ed94bd 100644 --- a/website/views/shared/modals/members.jade +++ b/website/views/shared/modals/members.jade @@ -7,7 +7,7 @@ script(type='text/ng-template', id='modals/member.html') .container-fluid .row .col-md-6 - img(ng-show='::profile.profile.imageUrl', ng-src='{{::profile.profile.imageUrl}}') + img.rasterize(ng-show='::profile.profile.imageUrl', ng-src='{{::profile.profile.imageUrl}}') markdown(ng-show='::profile.profile.blurb', text='::profile.profile.blurb') ul.muted.list-unstyled(ng-if='::profile.auth.timestamps') li {{profile._id}} diff --git a/website/views/static/features.jade b/website/views/static/features.jade index 9fbb9b31fa..baacf536ab 100644 --- a/website/views/static/features.jade +++ b/website/views/static/features.jade @@ -15,16 +15,16 @@ block content .row .col-md-6 a.gallery(href='/marketing/screenshot.png', title=env.t('marketing1Header')) - img(src='/marketing/screenshot.png') + img.rasterize(src='/marketing/screenshot.png') p.lead=env.t('marketing1Lead1') .col-md-6 a.gallery(href='/marketing/gear.png', title=env.t('marketing1Lead2Title')) - img(src='/marketing/gear.png') + img.rasterize(src='/marketing/gear.png') p.lead!=env.t('marketing1Lead2') a.gallery(href='/marketing/drops.png', title=env.t('marketing1Lead3Title')) - img(src='/marketing/drops.png',style='max-height:200px') + img.rasterize(src='/marketing/drops.png',style='max-height:200px') p.lead!=env.t('marketing1Lead3') // TODO achievements @@ -35,7 +35,7 @@ block content .row .col-md-6 a.gallery(href='/marketing/guild.png', title=env.t('marketing2Header')) - img(src='/marketing/guild.png') + img.rasterize(src='/marketing/guild.png') p.lead=env.t('marketing2Lead1') a.gallery(href='/common/img/sprites/spritesmith/quests/quest_vice3.png', title=env.t('marketing2Lead2Title')) @@ -43,7 +43,7 @@ block content p.lead!=env.t('marketing2Lead2') .col-md-6 a.gallery(href='/marketing/challenge.png', title=env.t('challenges')) - img(src='/marketing/challenge.png') + img.rasterize(src='/marketing/challenge.png') p.lead!=env.t('marketing2Lead3') hr.clearfix @@ -52,11 +52,11 @@ block content .row .col-md-6 a.gallery(href='/marketing/android_iphone.png', title=env.t('marketing3LeadTitle')) - img(src='/marketing/android_iphone.png',style='box-shadow:none;') + img.rasterize(src='/marketing/android_iphone.png',style='box-shadow:none;') p.lead!=env.t('marketing3Lead1') .col-md-6 a.gallery(href='/marketing/integration.png', title=env.t('marketing3LeadTitle')) - img(src='/marketing/integration.png') + img.rasterize(src='/marketing/integration.png') p.lead!=env.t('marketing3Lead2') hr.clearfix @@ -74,7 +74,7 @@ block content .row .col-md-6.col-md-offset-3 h3=env.t('marketing4Lead3Title') - img(src='/marketing/lefnire.png') + img.rasterize(src='/marketing/lefnire.png') p.lead =env.t('marketing4Lead3-1') |  @@ -112,4 +112,4 @@ block content =env.t('landingend3') a(href="ENTERPRISEPAGEHERE")=env.t('landingadminlink') |  - =env.t('landingend4') \ No newline at end of file + =env.t('landingend4') diff --git a/website/views/static/front.jade b/website/views/static/front.jade index a377ea0fe7..57b2f2d6ea 100644 --- a/website/views/static/front.jade +++ b/website/views/static/front.jade @@ -51,7 +51,7 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') span.icon-bar span.icon-bar a.navbar-brand(href='#') - img(src='https://d2afqr2xdmyzvu.cloudfront.net/assets/habitica_lockup2_desat.png') + img.rasterize(src='https://d2afqr2xdmyzvu.cloudfront.net/assets/habitica_lockup2_desat.png') // Collect the nav links, forms, and other content for toggling #bs-example-navbar-collapse-1.collapse.navbar-collapse ul.nav.navbar-nav.navbar-right @@ -69,7 +69,7 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') button#header-play-button.btn.btn-primary.navbar-btn.navbar-right(ng-click='playButtonClick()')= env.t('playButtonFull') #intro h1=env.t('motivate1') - img.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/intro.png') + img.rasterize.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/intro.png') // insert intro images .introcall.bg-success h4= env.t('joinOthers') @@ -103,13 +103,13 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') // Bottom Carousel Indicators ol.carousel-indicators li.active(data-target='#quote-carousel', data-slide-to='0') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Drag0nsilver.png', alt='') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Drag0nsilver.png', alt='') li(data-target='#quote-carousel', data-slide-to='1') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/frabjabulous.png', alt='') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/frabjabulous.png', alt='') li(data-target='#quote-carousel', data-slide-to='2') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AndeeLiao.png', alt='') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AndeeLiao.png', alt='') li(data-target='#quote-carousel', data-slide-to='3') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AlexandraSo.png', alt='') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/AlexandraSo.png', alt='') // Carousel Slides / Quotes .carousel-inner.text-center // Quote 1 @@ -430,7 +430,7 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') br = env.t('rewardByline2') .scrolltweet.hidden-xs.hidden-sm - img.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='Elmi', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Elmi.png') + img.rasterize.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='Elmi', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/Elmi.png') .tweet.popover.right.pull-right .arrow .popover-content= env.t('elmiQuote') @@ -442,10 +442,10 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') span.glyphicon.glyphicon-arrow-down img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png') img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/misc/shop_gold.png') h2 span.glyphicon.glyphicon-arrow-down - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/TVreward.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/TVreward.png') button.btn.btn-primary.btn-lg.fixedcta.gamifybutton(ng-click='playButtonClick()')= env.t('gamifyButton') section#levels.container-fluid .row @@ -459,7 +459,7 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') br = env.t('unlockByline2') .scrolltweet.hidden-xs.hidden-sm - img.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='16bitFil', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/16bitFil.png') + img.rasterize.scrolltweet-image(data-toggle='tooltip', data-placement='top', title='16bitFil', src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/testimonials/16bitFil.png') .tweet.popover.right.pull-right .arrow .popover-content @@ -558,8 +558,8 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') = env.t('featurePetByline') .col-md-4.col-sm-6 .feature-img.center-block - img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-triadbingo.png') - img(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-perfect.png') + img.rasterize(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-triadbingo.png') + img.rasterize(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/achievement-perfect.png') .featuretext h4= env.t('featureAchievementHeading') p= env.t('featureAchievementByline') @@ -573,7 +573,7 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') = env.t('featureEquipByline') .col-md-4.col-sm-6 .feature-img - img.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/Party-Header.png') + img.rasterize.center-block.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/Party-Header.png') .featuretext h4= env.t('featureSocialHeading') p @@ -593,19 +593,19 @@ html(ng-app='habitrpg', ng-controller='RootCtrl') .row .col-lg-2.col-md-2.col-md-offset-1.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1 a(href='http://ionicframework.com/') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/ionic-logo-horizontal-transparent.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/ionic-logo-horizontal-transparent.png') .col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1 a(href='https://www.jetbrains.com/webstorm/') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/logo_webstorm.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/logo_webstorm.png') .col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1 a(href='http://github.com/') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/GitHub_Logo.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/GitHub_Logo.png') .col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1 a(href='https://trello.com/') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/trello-logo-blue.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/trello-logo-blue.png') .col-lg-2.col-lg-offset-0.col-md-2.col-md-offset-0.col-sm-4.col-sm-offset-1.col-xs-6.col-xs-offset-1 a(href='https://slack.com/') - img.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/landing_slack_hash_wordmark_logo.png') + img.rasterize.img-responsive(src='https://d2afqr2xdmyzvu.cloudfront.net/front/images/presslogos/landing_slack_hash_wordmark_logo.png') .row.footer-content include ../shared/footer diff --git a/website/views/static/press-kit.jade b/website/views/static/press-kit.jade index 427da56098..ab98613e0e 100644 --- a/website/views/static/press-kit.jade +++ b/website/views/static/press-kit.jade @@ -40,4 +40,4 @@ block content ul.list-unstyled each img in imgs li - img.press-img(src="/presskit/#{img}.png") + img.rasterize.press-img(src="/presskit/#{img}.png")