hlxsites / mammotome

Franklin site for https://www.mammotome.com/
https://www.mammotome.com/
Apache License 2.0
1 stars 4 forks source link

Danaher mandated trustmark #552

Closed krizel4 closed 10 months ago

krizel4 commented 11 months ago

We have to add a Danaher trustmark (filename "danahertrustmark.svg" in icons folder) and we're hoping to use the svg file for the best quality. Right now, in the footer draft (in US), I have a png file as a temporary solution. Can you let me know what might need to be changed in the svg file they provided in order for it to work with Franklin?

I also noticed that if I try to remove ":logo:" from the top of the footer, it also removes the small logo that appears in the navigation once the user scrolls down.

Below is how the designer would like to accommodate the update. image

Acidham commented 11 months ago

I debugged the .svg, and it appears that our validator has issues with the semicolon in the xmlns attribute. I replaced the namespace variable with the value defined in <!DOCTYPE > and removed the whole variable block. The SVG now works. I added it into the footer.docx at the end.

Changed the line 13 from:

<svg version="1.1" id="Art" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="312.2034912px"
     height="410.1796265px" viewBox="0 0 312.2034912 410.1796265" style="enable-background:new 0 0 312.2034912 410.1796265;"
     xml:space="preserve">

to:

<svg version="1.1" id="Art" xmlns:x="http://ns.adobe.com/Extensibility/1.0/" xmlns:i="http://ns.adobe.com/AdobeIllustrator/10.0/" xmlns:graph="http://ns.adobe.com/Graphs/1.0/"
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="312.2034912px"
     height="410.1796265px" viewBox="0 0 312.2034912 410.1796265" style="enable-background:new 0 0 312.2034912 410.1796265;"
     xml:space="preserve">

and removed all namespace variable definitions:

[
    <!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
    <!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
    <!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
    <!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
    <!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
    <!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
    <!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
    <!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
]
Acidham commented 11 months ago

fixed with https://github.com/adobe/helix-admin/issues/1563

krizel4 commented 11 months ago

Thank you for updating this! A few questions:

We appreciate your help and patience! We apologize that this Sharepoint transition is taking so long.

Acidham commented 11 months ago

@krizel4

Any reason it might be microscopic? (One of Danaher's operating companies used an svg but it appears to be okay size: https://www.aldevron.com/)

Per implementation, the logo will be rendered by CSS like the social icons above. The CSS was built in a way to match :logo-small: in CSS. To follow the same implementation, we need a new CSS entry for :danarhertrustmark: to size it properly. Seems to be in the same row as the “new” Mammotome logo and the copyright text, correct?

Can we make an update to the footer design? We're removing the top left (M) logo and adding the "Mammotome" logo at the bottom left (as per design attached above)?

Sure, it is possible to change the layout and add it below the footer. The open question here is: What happens with the “new” Mammotome logo in mobile view?

= both are enhancements in that case.

krizel4 commented 11 months ago

Oh, gotcha. Now that you point it out, it does appear that the "new" Mammotome logo and the copyright text are in the same row as the Danaher Trustmark. Will that be an issue?

In mobile view, we're maintaining the Mammotome text logo.

Acidham commented 11 months ago

It is not an issue just for clarification. Can you provide a mobile view mockup? Just be clear on the requirements.

krizel4 commented 11 months ago

I'll ask the designer for a mock-up. Can you provide a timeline of how long implementation for this may take?

dzehnder commented 11 months ago

Hi @krizel4, we introduced the enhancement in the footer, that accommodates the new Danaher logo. You can have a look here https://552-footer-logo--mammotome--hlxsites.hlx.page/us/en/ Does this look like what you had in mind?

krizel4 commented 11 months ago

Hi @dzehnder! On desktop this looks great. Here's what the designer requested for the mobile view. Brand guidelines advise a bit of spacing between the company logo and the danaher trust mark.

For mobile, the designers asked if it's possible to have the social media logos all on one line.

image

krizel4 commented 10 months ago

Hi all! Do we have an estimated timeline of completion for this?

Acidham commented 10 months ago

@krizel4 we are working on it, but we found an issue, maybe browser related with the SVG, with the Trust mark logo. In desktop view some white squares are rendered over the logo in Chrome. In Safari, it works. We need to investigate next week on what caused the rendering glitch.

Feel free to try it out: https://552-footer-logo--mammotome--hlxsites.hlx.page/us/en/