Differential D7905 Diff 26981 landing/competitor-feature-card.css

Changeset View

Standalone View

landing/competitor-feature-card.css

This file was added.

				.container {
				max-width: 432px;
				atulUnsubmitted Not Done Inline Actions Personal preference would be if outermost container defined the `max-width` for each breakpoint and everything within was laid out w/ flexbox to fill the space as intended. atul: Personal preference would be if outermost container defined the `max-width` for each breakpoint…
				ginsuAuthorUnsubmitted Done Inline Actions A subsequent diff will improve on this ginsu: A subsequent diff will improve on this
				background-color: var(--comparison-cards);
				padding: 32px;
				border-radius: 16px;
				}

				.container:hover {
				cursor: pointer;
				background-color: var(--comparison-cards-hovered);
				}

				.headingContainer {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 16px;
				}

				.headingText {
				color: var(--white-100);
				}

				.comingSoonBadge {
				background-color: #ebebeb14;
				atulUnsubmitted Not Done Inline Actions Should this be defined in "the design system"? atul: Should this be defined in "the design system"?
				ginsuAuthorUnsubmitted Done Inline Actions Saw you do this in D7764 with the hr border-top style, so I thought having it this way fine, it's also a color hex with an opacity attached with it; however, I guess it wouldn't hurt so I will update the diff accordingly ginsu: Saw you do this in D7764 with the hr border-top style, so I thought having it this way fine…
				padding: 5px 10px;
				border-radius: 16px;
				}

				.comingSoonText {
				color: var(--white-100);
				margin-left: 8px;
				}

				.comingSoonIcon {
				color: var(--coming-soon-icon);
				}

				hr {
				margin: 24px 0;
				border-radius: 8px;
				height: 1.5px;
				background-color: var(--black-80);
				border: none;
				}

				.descriptionText {
				color: var(--white-80);
				height: 80px;
				margin-top: 8px;
				}

				.readMoreText {
				color: var(--violet-dark-100);
				margin-top: 16px;
				}