Epic - Swap old templates for FSE template

[AmnestyAM]

Sprints allocated

Number of sprints: 1 (2+ for all of them but we will make a start) Link to sprint if known: TBC

Goals

• start swapping old templates for FSE template
• This will allow us to build FSE "templates" for the really big patterns such as Issue pages, that were too big for patterns but built as patterns anyway.

Tickets

• [x] #369
• [x] #380
• [x] #361
• [x] #362
• [x] #346
• [x] #376
• [x] #370
• [x] #373
• [x] #385
• [x] #372
• [x] #345

Think about (optional)

• Tickets for translations

• Tickets for content

• home page

• archive template

• single post

• page template

• Side bar template part

[jaymcp]

Known issues:

• category archive intro content is missing (e.g. on /latest/news/)
• custom cards with donation actions look a bit off on /donate/
• search page pagination link for page 1 is incorrect (will fix on my return)

[Gentyspun]

Issues spotted on DEV, these may be unrelated to the epic tickets, and some may be fixable in the editor

• [x] Block spacing issues on most pages. (Must obvious on Homepage and /careers, example: http://bigbite.im/i/hR1TKR)
• [x] Inconsistent image and text sizing on /what-we-do as well as odd spacing (example: http://bigbite.im/i/eElb1j)
• [x] /get-involved similar issues to /what-we-do page (This and the point above appear to be solvable as content in the the editor. EXAMPLE: http://bigbite.im/i/oODX6P)
• [x] /countries Explore By Region section displays too many regions/sub-regions/countries (example: http://bigbite.im/i/swj6Fs)
• [x] Counter block displays total number below the counter on /join (example: http://bigbite.im/i/nI7ASB) (PR: https://github.com/amnestywebsite/humanity-theme/pull/413)

[jaymcp]

Block spacing issues on most pages. (Must obvious on Homepage and /careers, example: http://bigbite.im/i/hR1TKR)

likely caused by this line: https://github.com/amnestywebsite/humanity-theme/blob/main/private/src/styles/pages/article/_base.scss#L92

might be worth scoping that selector to the single.html template

[jaymcp]

Inconsistent image and text sizing on /what-we-do as well as odd spacing (example: http://bigbite.im/i/eElb1j)

likely a result of moving to a pattern for LWI. can perhaps be addressed by either amending the pattern or modifying content. currently, the pattern is 3 columns with blocks within. perhaps we could do it with rows of three items instead. (e.g. title row, image row, etc)? (we may need to modify the migration tool if we do that)

[jaymcp]

/countries Explore By Region section displays too many regions/sub-regions/countries (example: http://bigbite.im/i/swj6Fs)

this should now be fixed. i'd forgotten to deploy the updated theme companion plugin. apologies.

[jaymcp]

Counter block displays total number below the counter on /join (example: http://bigbite.im/i/nI7ASB)

caused by a fixed line height here: https://github.com/amnestywebsite/humanity-theme/blob/develop/wp-content/themes/humanity-theme/theme.json#L379

we should either define line height as a unit-less value, or override it later.

[Gentyspun]

Issues found on Dev:

Admin/Dashboard

• Some Templates in the site editor appear wonky or have broken blocks
  • [x] All Archives (Query Count block)
  • [x] Author Archives (Has broken block and for some reason Footer template part is inside a bunch of groups)
  • [x] Blog Home (Query Count block)
  • [x] Checkout Flow (Content is constrained to a small space and on left hand side)
  • [x] My Account (Same as above)
  • [x] Pages (Caused by Sidebar Pattern listed below)
  • [x] Search Page (amnesty-core/search-header broken or missing (Unsupported Error))
  • [x] Shop Index
  • [x] Single Petition
  • [x] Single Posts (Caused by Sidebar Pattern listed below)

Patterns

• [x] All sections are missing a margin top OR bottom so content inside them touches the previous or next sections content (PR: https://github.com/amnestywebsite/humanity-theme/pull/406)
• [x] Sidebar Pattern has broken block inside it (This is the one causing some Template issues)
• [x] There appears to be an Hero Pattern in the inserter, but I have no idea what this is. (This was added by me in an earlier PR, but it looks to be unused, so removed it. PR: https://github.com/amnestywebsite/humanity-theme/pull/414)
• [x] Any patterns containing quotes still use the old custom Blockquote and not the core quote (PR: https://github.com/amnestywebsite/humanity-theme/pull/407)
• [x] Full Image with Buttons Pattern - Heading colour never changes in the editor regardless of text colour change on the section (PR: https://github.com/amnestywebsite/humanity-theme/pull/406)

Pages

• [x] Country Pages - News, Urgent Actions and Research sections/post lists look wonky on the front end http://bigbite.im/i/M05YY7 (PR: https://github.com/amnestywebsite/humanity-theme/pull/408)

[BBTomA]

Front-end issues found: Footer

• [x] The heading font is wrong, there are no divider lines under the headers and the menu items are missing an underline on hover http://bigbite.im/i/jIUuxk
• [x] The button on hover background colour is set to black rather than the dark grey on the live site http://bigbite.im/i/3C2tlR

Home page

• [x] The font colour within the black boxes is set to black which is causing the text not to show http://bigbite.im/i/SdxzRI

What we do page

• Inconsistency on cards http://bigbite.im/i/wpmfBg

Get involved page

• Inconsistency on cards http://bigbite.im/i/OQWKgk
• Further inconsistency on cards http://bigbite.im/i/Rhls9e

Donate page

• [x] The heading font size is a lot smaller than the live site http://bigbite.im/i/WzIyZw
• [x] The cards are not taking up the full width of the columns and the images are not taking up the full width of the cards. Also, the cards heights are inconsistent http://bigbite.im/i/zmsDap

Single news page

• [x] Hero image not filling the width of the section http://bigbite.im/i/ES5U9q
• [x] A repeated issue with black font text showing within black boxes within the related content section http://bigbite.im/i/F0NJb5

Single research page

• [x] Spacing needed below language selector and download button http://bigbite.im/i/gopuPW
• [x] The sidebar content doesn't match the live site http://bigbite.im/i/gi7Q5q

[jaymcp]

The heading font size is a lot smaller than the live site http://bigbite.im/i/WzIyZw

It seems there's an issue with fluid typography; looking into it.

[jaymcp]

spotted an issue with remote attachments (e.g. when viewing ES document on EN site). i'm working on a solution, but it may take me a while to fix it completely.

[jaymcp]

spotted an issue with remote attachments (e.g. when viewing ES document on EN site). i'm working on a solution, but it may take me a while to fix it completely.

this is fixed

The heading font size is a lot smaller than the live site http://bigbite.im/i/WzIyZw

It seems there's an issue with fluid typography; looking into it.

this is also fixed

[jaymcp]

last outstanding issues that i'm aware of all relate to the new patterns intended to replace the custom card block. reviewing these now

[Gentyspun]

The below appears to be an issue on a number of staging sites

• [x] CSS string output instead of Hero image on the following page: /about-us, /get-involved/join & /get-involved/online-courses http://bigbite.im/i/1y0ogj (I believe you're already aware of these @jaymcp) - should be fixed in https://github.com/amnestywebsite/humanity-theme/pull/420
• [x] Menu block padding http://bigbite.im/i/mSEbpn (Could be unrelated to FSE) - should be fixed in https://github.com/amnestywebsite/humanity-theme/pull/422
• [x] Pagination is on /search (no query) is broken, takes you to homepage/page/2 instead of search/page/2 http://bigbite.im/v/VZAukQ - should be fixed in https://github.com/amnestywebsite/humanity-theme/pull/423

Issues found on https://isaidotorgstg.wpengine.com/en/

• [x] Broken hero on /careers http://bigbite.im/i/BfoNVk - can be fixed by editing and saving the page without changes (blocks are migrated automatically) - @jaymcp
• [x] "Explore By Region" broken on /countries http://bigbite.im/i/E1k4s5 (Was addressed previously so not sure if fix just isn't on staging yet?) - this is a content issue - regions block needs depth limiting to 1; additionally, some of the locations are not set to the correct parent, for some reason - @jaymcp

Issues found on https://exclimatestg.wpengine.com/

• [x] /signatories content goes from centre aligned to left aligned (with no padding) half way down the page http://bigbite.im/i/H46oEI (this could be user error in the editor) - should be fixed in https://github.com/amnestywebsite/humanity-theme/pull/421

Issues found on https://iswpdocsstg.wpengine.com/

• [x] Weird styles on /notifications/page/2/ http://bigbite.im/i/cZWdAc - should be fixed by https://github.com/amnestywebsite/humanity-theme/pull/424

  Issues found on https://ischinesestg.wpengine.com/

• [x] Wonky padding on /annual-report-2022/ http://bigbite.im/i/AUL4SP (Could be content related?) - content issue - @jaymcp

[jaymcp]

Whilst investigating custom card oddities, I noticed that we hadn't correctly migrated the colour variables in the branding plugin. I've got a PR in to address that. In the interim, some colours may look incorrect on DEV/STG.