TDS Testimonial without drop-shadow

[karlasamantha]

Question statement

• As a developer , I would like to ask, if there's a possibility to extend TDS Testimonial component to have the flexibility of not having drop-shadow and different font sizes

Recommendation

• Add an option of removing drop-shadow from the component
• Possibility of having smaller font size

Design intent

Acceptance criteria

This section is intentionally left blank. See story writing process.

User stories

(This section is intentionally left blank. User stories and acceptance criteria go here.)

Example:

Scenario: Displaying the component

Given text is provided
Then the text is displayed as a child
And the text size matches core-text medium

Out of scope

(This section is intentionally left blank. Features or items that were deliberately left out of scope during design intent or may be mistaken as within scope are noted here. Link to related issues if possible.)

Meta

• Include component name and version: @tds/community-testimonial 1.0.3
• Willing to design solution: No
• Willing to develop solution: Yes
• Has workaround: No
• Which teams/applications do you think would use this improvement? Brand Experience team
• High impact: No

[invalidred]

@agorovyi thinks that from Dev perspective this should not be too hard to accomplish, however we need design approval.

[karlasamantha]

my team has consulted with @gkychow and he approved this design

[theetrain]

Hi @karlasamantha,

This was reviewed by the DPA and we agree the community testimonial component can be enhanced to completely remove the card surrounding the component. If anyone wants a testimonial within a card, they can do so manually.

Designer comments: go ahead with removing the card
Developer comments: this should be a breaking change v1.03 -> v2.0.0

We need a designer and developer pair to work on this.

When a card is needed

Before

<Testimonial
  testimonial={`“My office is where ever my customers are. TELUS helps me stay connected whether I'm making a sale or doing payroll.”`}
  title="Dave Smith, Foreman"
  additionalInfo="Pinnacle Reforestation"
/>

After

<Card>
  <Testimonial
    testimonial={`“My office is where ever my customers are. TELUS helps me stay connected whether I'm making a sale or doing payroll.”`}
    title="Dave Smith, Foreman"
    additionalInfo="Pinnacle Reforestation"
  />
</Card>

[varunj90]

hey @karlasamantha can anyone on your team make changes based on @theetrain comments: has to be designer/developer pair.

[karlasamantha]

hey @varunj90 I can work on the dev part, unfortunately my team does not have a designer. can I try pairing with Gary if he's available?

[varunj90]

yes @karlasamantha please connect with @gkychow if he has cycles, otherwise the core team designers can assist, let us know :)

[karlasamantha]

See #215

[varunj90]

hey @karlasamantha thanks for making a PR, in order for the code to be approved, can you send us the updated designs for this PR.

all components need to be consistent both in design and code. let us know.

[karlasamantha]

Hey @varunj90 does this one work? let me know.

[varunj90]

can you share the design file link on sketch/invision?

it will have to be reviewed by another designer as well. exactly how we are doing in code

[karlasamantha]

@varunj90 ah gotcha! I'll ask Gary to send them over. Thanks!

[donnavitan]

Hey hey y'all! After speaking with CX and CPP (Site Builder team), the consensus is to build the TDS community component and the Site Builder component in the same manner. This will remove any confusion and disparity when working with both, as a designer, developer, and content practitioner.

I'll be able to help you with the artwork for Sketch DSM library.

Adding the screenshot from our discussion to confirm that the component itself does not contain padding; the parent container will have that if you so choose to use a card or not.

Thank you @karlasamantha! Let's rock and roll!

[donnavitan]

Need to confirm with CX that the testimonial should be set at 20px font size as per design in TDS component. Live example shows it displaying at 16px font size (as per Site Builder component). We want to be as consistent and have our components be 1:1 for TDS and Site Builder components where possible.

Design thus far:

Testimonial in the wild at 16px font-size: https://www.telus.com/en/about/careers (middle of page)
Testimonial in the wild at 20px font-size: https://www.telus.com/en/bc/business (bottom of page)

[donnavitan]

@karlasamantha confirmed with CX that testimonials should align with 20px font-size for the body text. Please update both TDS community component and Site Builder component accordingly, where possible.

[karlasamantha]

@donnavitan okay, the Site Builder block is only a wrapper for TDS testimonial component, so I'll update the component and as soon as the update is released it'll update Site Builder.

[marcod1419]

This has been released in testimonial 2.0.0! https://github.com/telus/tds-community/releases/tag/%40tds%2Fcommunity-testimonial%402.0.0

[theetrain]

This has been released in DSM 1.0.19
https://tds.telus.com/community/index.html#testimonial