Page MenuHomePhabricator

[landing] introduce logo svg assets for competitor comparison
AcceptedPublic

Authored by ginsu on Tue, May 23, 6:32 AM.
Tags
None
Referenced Files
F556670: Screenshot 2023-05-24 at 3.16.46 PM.png
Wed, May 24, 5:17 AM
F556666: Screenshot 2023-05-24 at 3.06.48 PM.png
Wed, May 24, 5:17 AM
Unknown Object (File)
Tue, May 23, 3:38 PM
Unknown Object (File)
Tue, May 23, 3:23 PM
F554436: Screenshot 2023-05-23 at 4.39.47 PM.png
Tue, May 23, 6:41 AM
F554382: Screenshot 2023-05-23 at 4.13.30 PM.png
Tue, May 23, 6:39 AM

Details

Reviewers
atul
kamil
Summary

Based on some feedback received in D7905 and some discussion in the design channel we decided that a better way to get the competitor logo assets would be to bundle the svgs directly instead of fetching them over the network. To get the svgs I downloaded them straight from the Figma file and copy and pasted the svg contents into its own react component. In a subsequent diff I will make some modifications to each component to allow for a size prop so that we can modify the size of the logos depending on its usage.

Screenshot 2023-05-23 at 4.39.47 PM.png (2×3 px, 730 KB)

Test Plan

Rendered the logos on the landing page

Screenshot 2023-05-23 at 4.13.30 PM.png (2×3 px, 1 MB)

Diff Detail

Repository
rCOMM Comm
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

ginsu edited the test plan for this revision. (Show Details)
ginsu added reviewers: atul, kamil.
landing/assets/comm-logo.react.js
16 ↗(On Diff #26880)

In background-illustration.react.js the line length also extended past 80 characters

ginsu requested review of this revision.Tue, May 23, 6:51 AM
ginsu edited the summary of this revision. (Show Details)

fix comm logo svg

landing/assets/comm-logo.react.js
10

Noticed that the comm logo looked like this (on the right the circle gets cut off):

Screenshot 2023-05-24 at 3.06.48 PM.png (426×478 px, 17 KB)

I went into Figma and instead of exporting the frame with the logo, I just exported the group of assets and the value of the viewbox did change. However, the comm logo now looks like this:

Screenshot 2023-05-24 at 3.16.46 PM.png (532×590 px, 20 KB)

atul added a subscriber: ted.

Guessing the icons in Figma were sourced directly from each brand's "media kit" or whatever?

landing/assets/comm-logo.react.js
24–31

Looks like we're applying a linear gradient to the "c."

I don't think we usually style it that way (app icon, favicon, etc).

Guessing this has been signed off on by @ashoat/@ted

This revision is now accepted and ready to land.Wed, May 24, 9:13 AM
landing/assets/comm-logo.react.js
24–31

Yeah the linear gradient is new... @ginsu, can you point to where that's used in the designs? Generally defer to Ted, but want to make sure we're consistent about branding