Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: add new styling for emoji links #14481

Merged
merged 6 commits into from
Apr 17, 2024
Merged

Conversation

CarinaWolli
Copy link
Member

@CarinaWolli CarinaWolli commented Apr 9, 2024

What does this PR do?

  • Bigger emojis and remove underline from link + changed text for 'Organizer didn't join the meeting':

After:

Screenshot 2024-04-09 at 12 44 52 PM
Screenshot 2024-04-09 at 12 45 01 PM

Before:

Screenshot 2024-04-09 at 2 41 21 PM Screenshot 2024-04-09 at 2 42 11 PM
  • Improve styling of emojis on rating page:

After:

Screenshot 2024-04-09 at 2 44 05 PM

Before:

Screenshot 2024-04-09 at 2 40 38 PM
  • Fix issue that enter added an additional line after saving

Copy link

vercel bot commented Apr 9, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ai ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 17, 2024 0:17am
platform-starter-kit ❌ Failed (Inspect) Apr 17, 2024 0:17am
3 Ignored Deployments
Name Status Preview Comments Updated (UTC)
cal ⬜️ Ignored (Inspect) Visit Preview Apr 17, 2024 0:17am
calcom-web-canary ⬜️ Ignored (Inspect) Visit Preview Apr 17, 2024 0:17am
qa ⬜️ Ignored (Inspect) Visit Preview Apr 17, 2024 0:17am

Copy link
Contributor

github-actions bot commented Apr 9, 2024

Thank you for following the naming conventions! 🙏 Feel free to join our discord and post your PR link.

Copy link
Contributor

github-actions bot commented Apr 9, 2024

📦 Next.js Bundle Analysis for @calcom/web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌

Copy link

deploysentinel bot commented Apr 9, 2024

Current Playwright Test Results Summary

✅ 302 Passing - ⚠️ 14 Flaky

Run may still be in progress, this comment will be updated as current testing workflow or job completes...

(Last updated on 04/17/2024 12:29:15pm UTC)

Run Details

Running Workflow PR Update on Github Actions

Commit: c6ccbfa

Started: 04/17/2024 12:25:39pm UTC

⚠️ Flakes

📄   apps/web/playwright/profile.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Update Profile Can resend verification link if the secondary email is unverified
Retry 1Initial Attempt
1.07% (3) 3 / 281 runs
failed over last 7 days
12.81% (36) 36 / 281 runs
flaked over last 7 days

📄   apps/web/playwright/event-types.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Event Types tests -- future user can add multiple organizer address
Retry 1Initial Attempt
0.71% (2) 2 / 283 runs
failed over last 7 days
15.55% (44) 44 / 283 runs
flaked over last 7 days

📄   packages/app-store/routing-forms/playwright/tests/basic.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Routing Forms Seeded Routing Form Test preview should return correct route
Retry 1Initial Attempt
0.36% (1) 1 / 278 run
failed over last 7 days
37.05% (103) 103 / 278 runs
flaked over last 7 days

📄   apps/web/playwright/integrations-stripe.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Stripe integration Pending payment booking should not be confirmed by default
Retry 1Initial Attempt
1.08% (3) 3 / 277 runs
failed over last 7 days
21.66% (60) 60 / 277 runs
flaked over last 7 days

📄   packages/embeds/embed-core/playwright/tests/action-based.e2e.ts • 8 Flakes

Top 1 Common Error Messages

null

8 Test Cases Affected

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Popup Tests should open embed iframe on click - Configured with light theme
Retry 1Initial Attempt
-0.36% (-1) -1 / 276 runs
failed over last 7 days
63.77% (176) 176 / 276 runs
flaked over last 7 days
Popup Tests should be able to reschedule
Retry 1Initial Attempt
-176% (-176) -176 / 100 runs
failed over last 7 days
176% (176) 176 / 100 runs
flaked over last 7 days
Popup Tests should open Routing Forms embed on click
Retry 1Initial Attempt
-176% (-176) -176 / 100 runs
failed over last 7 days
176% (176) 176 / 100 runs
flaked over last 7 days
Popup Tests Floating Button Popup Pro User - Configured in App with default setting of system theme should open embed iframe according to system theme when no theme is configured through Embed API
Retry 1Initial Attempt
-174% (-174) -174 / 100 runs
failed over last 7 days
175% (175) 175 / 100 runs
flaked over last 7 days
Popup Tests Floating Button Popup Pro User - Configured in App with default setting of system theme should open embed iframe according to system theme when configured with 'auto' theme using Embed API
Retry 1Initial Attempt
-176.77% (-175) -175 / 99 runs
failed over last 7 days
176.77% (175) 175 / 99 runs
flaked over last 7 days
Popup Tests Floating Button Popup Pro User - Configured in App with default setting of system theme should open embed iframe(Booker Profile Page) with dark theme when configured with dark theme using Embed API
Retry 1Initial Attempt
-176.77% (-175) -175 / 99 runs
failed over last 7 days
176.77% (175) 175 / 99 runs
flaked over last 7 days
Popup Tests Floating Button Popup Pro User - Configured in App with default setting of system theme should open embed iframe(Event Booking Page) with dark theme when configured with dark theme using Embed API
Retry 1Initial Attempt
-176.77% (-175) -175 / 99 runs
failed over last 7 days
176.77% (175) 175 / 99 runs
flaked over last 7 days
Popup Tests prendered embed should be loaded and apply the config given to it
Retry 1Initial Attempt
-176.77% (-175) -175 / 99 runs
failed over last 7 days
176.77% (175) 175 / 99 runs
flaked over last 7 days

📄   packages/embeds/embed-core/playwright/tests/inline.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Inline Iframe Inline Iframe - Configured with Dark Theme
Retry 1Initial Attempt
0.36% (1) 1 / 280 run
failed over last 7 days
53.57% (150) 150 / 280 runs
flaked over last 7 days

📄   apps/web/playwright/teams.e2e.ts • 1 Flake

Test Case Results

Test Case Last 7 days Failures Last 7 days Flakes
Teams - NonOrg -- future Can create a booking for Round Robin EventType
Retry 1Initial Attempt
0.34% (1) 1 / 291 run
failed over last 7 days
4.47% (13) 13 / 291 runs
flaked over last 7 days

View Detailed Build Results


// Select all <a> tags inside <h6> elements --> only used for emojis in rating template
const links = document.querySelectorAll("h6 a");

links.forEach((link) => {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

add inline styles for emojis (h6 links)

@@ -67,6 +72,7 @@

.editor-paragraph {
margin: 0;
margin-top:14px;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same as

behaves in email

@@ -56,9 +52,18 @@
font-style: italic;
}

// h6 is only used for emoji links
.editor-heading-h6 {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not sure why I need this, but if I remove it then the styles for h6 a from below are not applied

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah seems like an issue in editor's end really.

@CarinaWolli CarinaWolli changed the title add new styling for emoji links fix: add new styling for emoji links Apr 9, 2024
@@ -376,7 +376,12 @@ export default function ToolbarPlugin(props: TextEditorProps) {
editor.registerUpdateListener(({ editorState, prevEditorState }) => {
editorState.read(() => {
const textInHtml = $generateHtmlFromNodes(editor).replace(/&lt;/g, "<").replace(/&gt;/g, ">");
props.setText(textInHtml);
props.setText(
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Enter results in <p class="editor-paragraph"><br></p> which is the paragraph margin and a new line. We only want the margin.

Multiple enter in a row don't work as expected in the email, but for this case shift-enter can be used. Wasn't able to figure out a fix for this yet

@alishaz-polymath
Copy link
Member

Can we also address this in this PR?

@keithwillcode keithwillcode added this to the v4.1 milestone Apr 16, 2024
@PeerRich PeerRich marked this pull request as ready for review April 17, 2024 12:14
@graphite-app graphite-app bot requested a review from a team April 17, 2024 12:14
@dosubot dosubot bot added ui area: UI, frontend, button, form, input 🧹 Improvements Improvements to existing features. Mostly UX/UI labels Apr 17, 2024
Copy link
Member

@alishaz-polymath alishaz-polymath left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 🚀

@alishaz-polymath
Copy link
Member

Let's address the following as follow up

Copy link

graphite-app bot commented Apr 17, 2024

Graphite Automations

"Add consumer team as reviewer" took an action on this PR • (04/17/24)

1 reviewer was added to this PR based on Keith Williams's automation.

@PeerRich PeerRich enabled auto-merge (squash) April 17, 2024 12:20
@PeerRich PeerRich merged commit 8bb5200 into main Apr 17, 2024
37 of 40 checks passed
@PeerRich PeerRich deleted the fix/rating-template-improvements branch April 17, 2024 12:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
consumer core area: core, team members only 🧹 Improvements Improvements to existing features. Mostly UX/UI ui area: UI, frontend, button, form, input
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants