Skip to content
This repository has been archived by the owner on Feb 8, 2018. It is now read-only.

Commit

Permalink
show verified identities on profile with flags
Browse files Browse the repository at this point in the history
  • Loading branch information
@chadwhitacre
chadwhitacre committed May 11, 2016
1 parent ac04742 commit 07aa356
Show file tree
Hide file tree
Showing 7 changed files with 262 additions and 2 deletions.
4 changes: 2 additions & 2 deletions js/gratipay.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,9 @@ Gratipay.warnOffUsersFromDeveloperConsole = function() {
Gratipay.adaptToLongUsernames = function() {
var h1 = $('#banner h1');
var nchars = h1.text().length;
if (nchars > 16)
if (nchars > 15)
h1.addClass('really-long');
else if (nchars > 8)
else if (nchars > 7)
h1.addClass('long');
h1.show();
};
Expand Down
8 changes: 8 additions & 0 deletions scss/components/banner.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,14 @@
}
}

.countries {
position: absolute;
bottom: 6px;
left: 192px;
width: 32px;
z-index: 3;
}

.details {
position: absolute;
top: 16px;
Expand Down
8 changes: 8 additions & 0 deletions scss/layouts/responsiveness.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,14 @@
left: 13px;
}
}
.countries {
bottom: 3px;
left: 128px;
width: 32px;
img {
margin-bottom: -7px;
}
}
.details {
font-size: 10px;
box-shadow: 0px 0px 16px 8px rgba($black, 0.5);
Expand Down
230 changes: 230 additions & 0 deletions scss/mixins/flags.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,230 @@
// https://www.flag-sprites.com/

.flag {
width: 32px;
height: 32px;
background: url('flags.png') no-repeat;

&.AD {background-position: -32px 0}
&.AE {background-position: -64px 0}
&.AF {background-position: -96px 0}
&.AG {background-position: -128px 0}
&.AI {background-position: -160px 0}
&.AL {background-position: -192px 0}
&.AM {background-position: -224px 0}
&.AN {background-position: -256px 0}
&.AO {background-position: -288px 0}
&.AR {background-position: -320px 0}
&.AS {background-position: -352px 0}
&.AT {background-position: -384px 0}
&.AU {background-position: -416px 0}
&.AW {background-position: -448px 0}
&.AZ {background-position: 0 -32px}
&.BA {background-position: -32px -32px}
&.BB {background-position: -64px -32px}
&.BD {background-position: -96px -32px}
&.BE {background-position: -128px -32px}
&.BF {background-position: -160px -32px}
&.BG {background-position: -192px -32px}
&.BH {background-position: -224px -32px}
&.BI {background-position: -256px -32px}
&.BJ {background-position: -288px -32px}
&.BM {background-position: -320px -32px}
&.BN {background-position: -352px -32px}
&.BO {background-position: -384px -32px}
&.BR {background-position: -416px -32px}
&.BS {background-position: -448px -32px}
&.BT {background-position: 0 -64px}
&.BW {background-position: -32px -64px}
&.BY {background-position: -64px -64px}
&.BZ {background-position: -96px -64px}
&.CA {background-position: -128px -64px}
&.CD {background-position: -160px -64px}
&.CF {background-position: -192px -64px}
&.CG {background-position: -224px -64px}
&.CH {background-position: -256px -64px}
&.CI {background-position: -288px -64px}
&.CK {background-position: -320px -64px}
&.CL {background-position: -352px -64px}
&.CM {background-position: -384px -64px}
&.CN {background-position: -416px -64px}
&.CO {background-position: -448px -64px}
&.CR {background-position: 0 -96px}
&.CU {background-position: -32px -96px}
&.CV {background-position: -64px -96px}
&.CY {background-position: -96px -96px}
&.CZ {background-position: -128px -96px}
&.DE {background-position: -160px -96px}
&.DJ {background-position: -192px -96px}
&.DK {background-position: -224px -96px}
&.DM {background-position: -256px -96px}
&.DO {background-position: -288px -96px}
&.DZ {background-position: -320px -96px}
&.EC {background-position: -352px -96px}
&.EE {background-position: -384px -96px}
&.EG {background-position: -416px -96px}
&.EH {background-position: -448px -96px}
&.ER {background-position: 0 -128px}
&.ES {background-position: -32px -128px}
&.ET {background-position: -64px -128px}
&.FI {background-position: -96px -128px}
&.FJ {background-position: -128px -128px}
&.FM {background-position: -160px -128px}
&.FO {background-position: -192px -128px}
&.FR {background-position: -224px -128px}
&.GA {background-position: -256px -128px}
&.GB {background-position: -288px -128px}
&.GD {background-position: -320px -128px}
&.GE {background-position: -352px -128px}
&.GG {background-position: -384px -128px}
&.GH {background-position: -416px -128px}
&.GI {background-position: -448px -128px}
&.GL {background-position: 0 -160px}
&.GM {background-position: -32px -160px}
&.GN {background-position: -64px -160px}
&.GP {background-position: -96px -160px}
&.GQ {background-position: -128px -160px}
&.GR {background-position: -160px -160px}
&.GT {background-position: -192px -160px}
&.GU {background-position: -224px -160px}
&.GW {background-position: -256px -160px}
&.GY {background-position: -288px -160px}
&.HK {background-position: -320px -160px}
&.HN {background-position: -352px -160px}
&.HR {background-position: -384px -160px}
&.HT {background-position: -416px -160px}
&.HU {background-position: -448px -160px}
&.ID {background-position: 0 -192px}
&.IE {background-position: -32px -192px}
&.IL {background-position: -64px -192px}
&.IM {background-position: -96px -192px}
&.IN {background-position: -128px -192px}
&.IQ {background-position: -160px -192px}
&.IR {background-position: -192px -192px}
&.IS {background-position: -224px -192px}
&.IT {background-position: -256px -192px}
&.JE {background-position: -288px -192px}
&.JM {background-position: -320px -192px}
&.JO {background-position: -352px -192px}
&.JP {background-position: -384px -192px}
&.KE {background-position: -416px -192px}
&.KG {background-position: -448px -192px}
&.KH {background-position: 0 -224px}
&.KI {background-position: -32px -224px}
&.KM {background-position: -64px -224px}
&.KN {background-position: -96px -224px}
&.KP {background-position: -128px -224px}
&.KR {background-position: -160px -224px}
&.KW {background-position: -192px -224px}
&.KY {background-position: -224px -224px}
&.KZ {background-position: -256px -224px}
&.LA {background-position: -288px -224px}
&.LB {background-position: -320px -224px}
&.LC {background-position: -352px -224px}
&.LI {background-position: -384px -224px}
&.LK {background-position: -416px -224px}
&.LR {background-position: -448px -224px}
&.LS {background-position: 0 -256px}
&.LT {background-position: -32px -256px}
&.LU {background-position: -64px -256px}
&.LV {background-position: -96px -256px}
&.LY {background-position: -128px -256px}
&.MA {background-position: -160px -256px}
&.MC {background-position: -192px -256px}
&.MD {background-position: -224px -256px}
&.ME {background-position: -256px -256px}
&.MG {background-position: -288px -256px}
&.MH {background-position: -320px -256px}
&.MK {background-position: -352px -256px}
&.ML {background-position: -384px -256px}
&.MM {background-position: -416px -256px}
&.MN {background-position: -448px -256px}
&.MO {background-position: 0 -288px}
&.MQ {background-position: -32px -288px}
&.MR {background-position: -64px -288px}
&.MS {background-position: -96px -288px}
&.MT {background-position: -128px -288px}
&.MU {background-position: -160px -288px}
&.MV {background-position: -192px -288px}
&.MW {background-position: -224px -288px}
&.MX {background-position: -256px -288px}
&.MY {background-position: -288px -288px}
&.MZ {background-position: -320px -288px}
&.NA {background-position: -352px -288px}
&.NC {background-position: -384px -288px}
&.NE {background-position: -416px -288px}
&.NG {background-position: -448px -288px}
&.NI {background-position: 0 -320px}
&.NL {background-position: -32px -320px}
&.NO {background-position: -64px -320px}
&.NP {background-position: -96px -320px}
&.NR {background-position: -128px -320px}
&.NZ {background-position: -160px -320px}
&.OM {background-position: -192px -320px}
&.PA {background-position: -224px -320px}
&.PE {background-position: -256px -320px}
&.PF {background-position: -288px -320px}
&.PG {background-position: -320px -320px}
&.PH {background-position: -352px -320px}
&.PK {background-position: -384px -320px}
&.PL {background-position: -416px -320px}
&.PR {background-position: -448px -320px}
&.PS {background-position: 0 -352px}
&.PT {background-position: -32px -352px}
&.PW {background-position: -64px -352px}
&.PY {background-position: -96px -352px}
&.QA {background-position: -128px -352px}
&.RE {background-position: -160px -352px}
&.RO {background-position: -192px -352px}
&.RS {background-position: -224px -352px}
&.RU {background-position: -256px -352px}
&.RW {background-position: -288px -352px}
&.SA {background-position: -320px -352px}
&.SB {background-position: -352px -352px}
&.SC {background-position: -384px -352px}
&.SD {background-position: -416px -352px}
&.SE {background-position: -448px -352px}
&.SG {background-position: 0 -384px}
&.SI {background-position: -32px -384px}
&.SK {background-position: -64px -384px}
&.SL {background-position: -96px -384px}
&.SM {background-position: -128px -384px}
&.SN {background-position: -160px -384px}
&.SO {background-position: -192px -384px}
&.SR {background-position: -224px -384px}
&.ST {background-position: -256px -384px}
&.SV {background-position: -288px -384px}
&.SY {background-position: -320px -384px}
&.SZ {background-position: -352px -384px}
&.TC {background-position: -384px -384px}
&.TD {background-position: -416px -384px}
&.TG {background-position: -448px -384px}
&.TH {background-position: 0 -416px}
&.TJ {background-position: -32px -416px}
&.TL {background-position: -64px -416px}
&.TM {background-position: -96px -416px}
&.TN {background-position: -128px -416px}
&.TO {background-position: -160px -416px}
&.TR {background-position: -192px -416px}
&.TT {background-position: -224px -416px}
&.TV {background-position: -256px -416px}
&.TW {background-position: -288px -416px}
&.TZ {background-position: -320px -416px}
&.UA {background-position: -352px -416px}
&.UG {background-position: -384px -416px}
&.US {background-position: -416px -416px}
&.UY {background-position: -448px -416px}
&.UZ {background-position: 0 -448px}
&.VA {background-position: -32px -448px}
&.VC {background-position: -64px -448px}
&.VE {background-position: -96px -448px}
&.VG {background-position: -128px -448px}
&.VI {background-position: -160px -448px}
&.VN {background-position: -192px -448px}
&.VU {background-position: -224px -448px}
&.WS {background-position: -256px -448px}
&.YE {background-position: -288px -448px}
&.ZA {background-position: -320px -448px}
&.ZM {background-position: -352px -448px}
&.ZW {background-position: -384px -448px}
}
13 changes: 13 additions & 0 deletions templates/profile.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,19 @@
{% endif %}
</div>

{% if participant.has_verified_identity %}
<div class="countries">
{% for identity in participant.list_identity_metadata(is_verified=True)[:2] %}
{% if identity.is_verified %}
<img class="flag {{ identity.country.code2 }}"
alt="{{ _('verified in: {country}', country=locale.countries[identity.country.code2]) }}"
title="{{ _('verified in: {country}', country=locale.countries[identity.country.code2]) }}"
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGP6zwAAAgcBApocMXEAAAAASUVORK5CYII=">
{% endif %}
{% endfor %}
</div>
{% endif %}

<div class="details mono">
<table>
<tr>
Expand Down
Binary file added www/assets/flags.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions www/assets/gratipay.css.spt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
@import "scss/mixins/borders-backgrounds-shadows";
@import "scss/mixins/animation";
@import "scss/mixins/transform";
@import "scss/mixins/flags";
@import "scss/utils";
@import "scss/variables";

Expand Down

0 comments on commit 07aa356

Please sign in to comment.