diff --git a/.gitignore b/.gitignore index a763e3647..0f90799fa 100644 --- a/.gitignore +++ b/.gitignore @@ -25,3 +25,5 @@ server/templates/includes/base_icons.html .mypy_cache/ .vscode/ cov.html + +.idea diff --git a/server/app.py b/server/app.py index 0714f6e18..930eb7a66 100644 --- a/server/app.py +++ b/server/app.py @@ -886,7 +886,8 @@ def daf(): @app.route("/donor-wall") def donor_wall(): bundles = get_bundles("donate") - return render_template("donor-wall.html", bundles=bundles) + sorted_donors = Account.list_by_giving() + return render_template("donor-wall.html", bundles=bundles, sortedDonors=sorted_donors) @app.route("/error") def error(): diff --git a/server/npsp.py b/server/npsp.py index e1d119b31..3eba5a2ea 100644 --- a/server/npsp.py +++ b/server/npsp.py @@ -414,7 +414,7 @@ def list( WHERE Stripe_Customer_ID__c = '{stripe_customer_id}' AND StageName = '{stage_name}' """ - + order_by = f"""ORDER BY Expected_Giving_Date__c ASC""" if asc_order else "" query = f""" @@ -614,7 +614,7 @@ def __init__(self, id=None, contact=None, account=None, date=None, sf_connection date = datetime.now(tz=ZONE) else: date = datetime.fromtimestamp(date) - + date_formatted = date.strftime("%Y-%m-%d") if contact is not None: @@ -990,6 +990,7 @@ def get( return account + @classmethod def list_by_giving( cls, sf_connection=None ): @@ -1003,20 +1004,22 @@ def list_by_giving( query = """ SELECT Name, + CreatedDate, Text_For_Donor_Wall__c, Total_Donor_Wall_This_Year__c FROM Account WHERE RecordTypeId = '01216000001IhHL' + AND CreatedDate = LAST_N_DAYS:365 AND Total_Donor_Wall_This_Year__c > 0 """ - + donors = sf.query(query) results = defaultdict(list) less_than_10 = [] for record in donors: attribution = record['Text_For_Donor_Wall__c'] attributions = {'sort_by': record['Name'], - 'attribution': attribution} + 'attribution': attribution, 'CreatedDate': record['CreatedDate']} amount = Decimal(record['Total_Donor_Wall_This_Year__c']) amount = amount.quantize(Decimal('1'), rounding=ROUND_HALF_UP) if amount < 10: @@ -1030,7 +1033,7 @@ def list_by_giving( for k, v in sorted(results.items(), key=lambda x: x, reverse=True): items = sorted(v, key=lambda x: x['sort_by']) sorted_results['${:0,.0f}'.format(k)] = [ - {'attribution': x['attribution']} + {'attribution': x['attribution'], 'created': x['CreatedDate']} for x in items] # hacky, but tack this on the end so it'll show last: diff --git a/server/static/sass/4-elements/_all.scss b/server/static/sass/4-elements/_all.scss index a0e17e6df..0575dc32d 100644 --- a/server/static/sass/4-elements/_all.scss +++ b/server/static/sass/4-elements/_all.scss @@ -1,15 +1,18 @@ -// ELEMENTS - Raw tag styles +@import 'font-families'; -// Set font root sizes for desktop, tablet, mobile html { - @include font-setting('primary'); font-size: $font-root; @include mq($until: bp-s) { font-size: $font-root-mobile; } } -// Strip margin and padding from all headers a paragraphs +body { + @include font-setting('primary'); + color: $color-black-off; +} + +// We made some tag decisions here based on repeated overriding of browser defaults html, body, dd, @@ -23,43 +26,52 @@ h3, h4, h5, h6, -p { +p, +figure, +blockquote { margin: 0; padding: 0; } -// Set base typography proportions for headers, paragraphs, etc. -// sizing variables in settings/_breakpoints.scss -h1 { - font-size: $size-xxl; - line-height: 1.2; +a { + color: inherit; + text-decoration: none; } -h2 { - font-size: $size-xl; +// We want all of our cite elements to not be italicized +cite { + font-style: normal; } -h3 { - font-size: $size-l; +button { + background: none; + border: none; + cursor: pointer; + padding: 0; } -h4 { - font-size: $size-m; +// No bullets by default +ul { + list-style: none; } -h5 { - font-size: $size-s; +hr { + border: 1px solid $color-gray-light; } -p { - font-size: $size-b; +// By default we add leading to paragraphs, lists, and captions +p, +ul, +figcaption { + line-height: $font-line-height-b; } -a { - text-decoration: none; -} -// We want all of our cite elements to not be italicized -cite { - font-style: normal; +// hide details/summary arrow (webkit) +details summary::-webkit-details-marker { + display: none; +} +// hide details/summary arrow (chrome/ff) +details summary::marker { + content: ''; } diff --git a/server/static/sass/4-elements/_font-families.scss b/server/static/sass/4-elements/_font-families.scss new file mode 100644 index 000000000..82b804365 --- /dev/null +++ b/server/static/sass/4-elements/_font-families.scss @@ -0,0 +1,72 @@ +@font-face { + font-display: swap; + font-family: 'PT Serif'; + src: url('https://cdn.texastribune.org/fonts/ptserif-regular.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/ptserif-regular.woff') format('woff'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-display: swap; + font-family: 'PT Serif'; + src: url('https://cdn.texastribune.org/fonts/ptserif-bold.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/ptserif-bold.woff') format('woff'); + font-weight: 700; + font-style: normal; +} + +@font-face { + font-display: swap; + font-family: 'PT Serif'; + src: url('https://cdn.texastribune.org/fonts/ptserif-italic.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/ptserif-italic.woff') format('woff'); + font-weight: 400; + font-style: italic; +} + +@font-face { + font-display: swap; + font-family: 'PT Serif'; + src: url('https://cdn.texastribune.org/fonts/ptserif-bolditalic.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/ptserif-bolditalic.woff') format('woff'); + font-weight: 700; + font-style: italic; +} + +@font-face { + font-display: swap; + font-family: 'Open Sans'; + src: url('https://cdn.texastribune.org/fonts/opensans-regular.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/opensans-regular.woff') format('woff'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-display: swap; + font-family: 'Open Sans'; + src: url('https://cdn.texastribune.org/fonts/opensans-bold.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/opensans-bold.woff') format('woff'); + font-weight: 700; + font-style: normal; +} + +@font-face { + font-display: swap; + font-family: 'Open Sans'; + src: url('https://cdn.texastribune.org/fonts/opensans-italic.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/opensans-italic.woff') format('woff'); + font-weight: 400; + font-style: italic; +} + + +@font-face { + font-display: swap; + font-family: 'Open Sans'; + src: url('https://cdn.texastribune.org/fonts/opensans-bolditalic.woff2') format('woff2'), + url('https://cdn.texastribune.org/fonts/opensans-bolditalic.woff') format('woff'); + font-weight: 700; + font-style: italic; +} diff --git a/server/static/sass/5-typography/_t-helpers.scss b/server/static/sass/5-typography/_t-helpers.scss new file mode 100644 index 000000000..0da9eb8ab --- /dev/null +++ b/server/static/sass/5-typography/_t-helpers.scss @@ -0,0 +1,155 @@ +// Text font variant (t-) +// +// Helper to define if serif or sans font is to be used. This uses the `@include font-setting` mixin, which establishes the font-family according to whether or not the `.fonts-loaded` class is present.

General rule for this is `t-serif` _for editorial_ and `t-sans` _for everything else_

**Note:** The default font is `t-sans`. That means most of the time you won't need to explicitly set it. {{isHelper}} +// +// .t-serif - Default serif +// .t-sans - Default sans +// +// Markup:

Change inherit font family

+// +// +// Styleguide 5.2.2 +.t-serif { + @include font-setting('secondary'); +} + +.t-sans { + @include font-setting; +} + +// Text case (t-) +// +// Text-transform helpers. {{isHelper}} +// +// .t-titlecase - Text transformed to Title Case +// .t-uppercase - Text transformed to UPPERCASE. Don't forget to add kerning `t-lsp-` with uppercase text. +// +// Markup:

Text transform helper.

+// +// +// Styleguide 5.2.5 +.t-titlecase { + text-transform: capitalize; +} + +.t-uppercase { + text-transform: uppercase; +} + +// Text align (t-align-) +// +// Text-align helpers. {{isHelper}} +// +// .t-align-left - Left aligned +// .t-align-center - Center aligned +// .t-align-right - Right aligned +// +// Markup:

Example

+// +// +// Styleguide 5.2.7 + +.t-align-left { + text-align: left; +} + +.t-align-center { + text-align: center; +} + +.t-align-right { + text-align: right; +} + + +// Text line-height (t-lh-) +// +// Various sizes of unitless line-height. {{isHelper}} +// +// t-lh-s - `line-height: 1.2` +// t-lh-b - `line-height: 1.4` (used on paragraphs, lists, and figcaptions) +// t-lh-m - `line-height: 1.5` +// t-lh-l - `line-height: 2` +// +// Markup:

Texas again mistakenly flags voters for citizenship reviews

+// +// +// Styleguide 5.2.7 +// +$line-height-type: ( + s: $font-line-height-s, + b: $font-line-height-b, + m: $font-line-height-m, + l: $font-line-height-l, +); + +@each $type-set, $line-height in $line-height-type { + .t-lh-#{$type-set} { + line-height: $line-height; + } +} + +// Text letter-spacing (t-lsp-) +// +// Kerning helpers. We generally use this in conjunction with `t-uppercase`. {{isHelper}} +// +// t-lsp-s - `letter-spacing: .02em` +// t-lsp-b - `letter-spacing: .03em` +// t-lsp-m - `letter-spacing: .05em` +// t-lsp-l - `letter-spacing: .07em` +// +// Markup:

Texas again mistakenly flags voters for citizenship reviews

+// +// +// Styleguide 5.2.7 +// +$letter-spacing-type: ( + s: $font-letter-spacing-s, + b: $font-letter-spacing-b, + m: $font-letter-spacing-m, + l: $font-letter-spacing-l, +); + +@each $type-set, $letter-spacing in $letter-spacing-type { + .t-lsp-#{$type-set} { + letter-spacing: $letter-spacing; + } +} + +// Text wrap (t-wrap-) +// +// Helper classes for handling how words are allowed to wrap and break. {{isHelper}} +// +// .t-wrap-break - Allow a word to wrap to the next line mid-word +// .t-wrap-balance - Allow a word to wrap to the next line, but try to keep the lines balanced. This isn't supported in all browsers and could be used in conjunction with our fork of [NYT's balanacer helper](https://github.com/texastribune/text-balancer). +// +// Markup: 5-typography/wrap.html +// +// +// Styleguide 5.3.6 +.t-wrap-break { + word-break: break-all; +} + +.t-wrap-balance { + text-wrap: balance; +} + +// Text weight (t-weight-) +// +// Helper for adding bold/normal `font-weight`. Sometimes individual `` can be redundant tags. {{isHelper}} +// +// .t-weight-bold - `font-weight: 700` +// .t-weight-normal - `font-weight: 400` +// +// Markup:

Example text

+// +// +// Styleguide 5.3.6 +.t-weight-bold { + font-weight: 700; +} + +.t-weight-normal { + font-weight: 400; +} diff --git a/server/static/sass/6-components/_table.scss b/server/static/sass/6-components/_table.scss new file mode 100644 index 000000000..ca039d14c --- /dev/null +++ b/server/static/sass/6-components/_table.scss @@ -0,0 +1,81 @@ +@mixin fixed-table-widths($widths) { + @for $i from 1 through length($widths) { + $curr: nth($widths, $i); + + thead tr:first-child > th:nth-child(#{$i}), + tbody tr:first-child > td:nth-child(#{$i}) { + width: $curr; + } + } +} + +// Table (c-table) +// +// Tabular display classes. Tables should be constructed with a `` and ``.

+// Tip: Use `transform: scaleY(-1);` to flip ascending/descending icons +// +// .c-table--striped - Zebra stripes odd rows +// .c-table--bordered - Bordered table, cells, rows and headings +// .c-table--bordered-rows - Bordered rows +// .c-table--10-45-45 - Three-column table with col widths 10%, 45%, 45% +// .c-table--15-70-15 - Two-column table with col widths 15%, 70%, 15% +// .c-table--fixed - Adds `table-layout: fixed`. Helpful for mobile-friendly tables. +// +// Markup: 6-components/table/table.html +// +// Styleguide 6.1.5 +.c-table { + border-collapse: collapse; + + &--fixed { + table-layout: fixed; + } + + td, + th { + // not a standard size + padding: 0.5rem; + } + + &--10-45-45 { + @include fixed-table-widths(10% 45% 45%); + table-layout: fixed; + } + + &--30-70 { + @include fixed-table-widths(30% 70%); + table-layout: fixed; + } + + &--15-70-15 { + @include fixed-table-widths(15% 70% 15%); + table-layout: fixed; + } + + &--striped { + tbody > tr:nth-child(odd) { + // not a standard color + background-color: #f7f7f7; + } + } + + &--bordered-rows { + tbody > tr { + border-top: 1px solid $color-white-off; + } + } + + &--bordered { + border: 1px solid $color-white-off; + + tbody > tr, + thead > tr { + border-top: 1px solid $color-white-off; + } + + tr > td, + tr > th { + border-left: 1px solid $color-white-off; + } + } +} diff --git a/server/static/sass/7-utilities/_all.scss b/server/static/sass/7-utilities/_all.scss index f4573ad0d..379b13c88 100644 --- a/server/static/sass/7-utilities/_all.scss +++ b/server/static/sass/7-utilities/_all.scss @@ -1,3 +1,5 @@ // OVERRIDES - Highly specific utility classes @import 'grid.scss'; @import 'helpers.scss'; +@import 'width.scss'; +@import 'multicol.scss'; diff --git a/server/static/sass/7-utilities/_multicol.scss b/server/static/sass/7-utilities/_multicol.scss new file mode 100644 index 000000000..af7d6857a --- /dev/null +++ b/server/static/sass/7-utilities/_multicol.scss @@ -0,0 +1,14 @@ +// Multi column (l-multicol) +// +// Add 2 columns on larger viewports. In the future, this could be extended to support other column counts. +// +// +// Markup:
  • Blue cheese
  • Feta
  • Swiss
  • Colby Jack
  • Pepper Jack
  • Cheddar
+// +// +// Styleguide 7.0.4 +.l-multicol { + @include mq($from: bp-s) { + columns: 2; + } +} diff --git a/server/static/sass/7-utilities/_width.scss b/server/static/sass/7-utilities/_width.scss new file mode 100644 index 000000000..ebe77c23b --- /dev/null +++ b/server/static/sass/7-utilities/_width.scss @@ -0,0 +1,18 @@ +// Width (l-width-) +// +// Defines width settings. Helpful for responsive images. {{isHelper}} +// +// .l-width-full - Width is 100% of parent +// .l-width-max - Max-width: 100%. Never greater than parent, but not stretched beyond its natural size. +// +// Markup:
+// +// +// Styleguide 7.0.5 +.l-width-full { + width: 100%; +} + +.l-width-max { + max-width: 100%; +} diff --git a/server/static/sass/donate.scss b/server/static/sass/donate.scss index 1565afdbf..1f17e628c 100644 --- a/server/static/sass/donate.scss +++ b/server/static/sass/donate.scss @@ -8,6 +8,7 @@ // Include components & typography as needed @import '5-typography/links'; @import '5-typography/typography'; +@import '5-typography/t-helpers'; @import '6-components/buttons'; @import '6-components/contact'; @@ -19,6 +20,7 @@ @import '6-components/quotes'; @import '6-components/rotate-words'; @import '6-components/smd'; +@import '6-components/table'; @import '6-components/thermometer'; // used for promotional messages diff --git a/server/templates/donor-wall.html b/server/templates/donor-wall.html index c9411b27c..f805009ee 100644 --- a/server/templates/donor-wall.html +++ b/server/templates/donor-wall.html @@ -9,6 +9,8 @@ {% endblock %} +{% block title %}Donors and Members | The Texas Tribune{% endblock %} + {% block head_scripts %} {% if form_data and message %}