this repo has no description
fix(profile): align profile card headings
Made-with: Cursor
+15
-83
+9
-76
assets/styles.css
+9
-76
assets/styles.css
···
5045
5045
.profile-whats-new p {
5046
5046
margin: 0;
5047
5047
}
5048
-
.profile-whats-new h2 {
5049
-
margin-top: 0.25rem;
5050
-
font-size: clamp(1rem, 1.8vw, 1.2rem);
5051
-
}
5052
-
.profile-whats-new-heading-row .text-eyebrow,
5053
-
.profile-reviews-eyebrow,
5054
-
.profile-reviews-heading {
5048
+
.profile-card-section-title {
5055
5049
margin: 0;
5056
5050
font-size: 1rem;
5057
5051
font-weight: 800;
5058
5052
letter-spacing: 0;
5053
+
line-height: 1.25;
5059
5054
text-transform: none;
5060
5055
color: rgba(18, 26, 47, 0.92);
5056
+
}
5057
+
.profile-whats-new-title {
5058
+
margin-top: 0.25rem;
5059
+
font-size: clamp(1rem, 1.8vw, 1.2rem);
5060
+
font-weight: 750;
5061
+
line-height: 1.3;
5061
5062
}
5062
5063
.profile-whats-new-body,
5063
5064
.profile-whats-new-preview,
···
5411
5412
.dark-phase .profile-review-response-label {
5412
5413
color: rgba(255, 255, 255, 0.65);
5413
5414
}
5414
-
.dark-phase .profile-whats-new-heading-row .text-eyebrow,
5415
-
.dark-phase .profile-reviews-eyebrow,
5416
-
.dark-phase .profile-reviews-heading {
5415
+
.dark-phase .profile-card-section-title {
5417
5416
color: rgba(255, 255, 255, 0.92);
5418
5417
}
5419
5418
.dark-phase .profile-reviews-threshold,
···
5647
5646
font-weight: 750;
5648
5647
color: rgba(18, 26, 47, 0.7);
5649
5648
}
5650
-
.user-bsky-picker {
5651
-
position: relative;
5652
-
}
5653
-
.user-bsky-picker-trigger {
5654
-
width: 100%;
5655
-
display: flex;
5656
-
align-items: center;
5657
-
gap: 0.85rem;
5658
-
border: 1px solid rgba(18, 26, 47, 0.14);
5659
-
border-radius: 0.95rem;
5660
-
padding: 0.65rem 0.85rem;
5661
-
background: rgba(255, 255, 255, 0.82);
5662
-
color: inherit;
5663
-
font: inherit;
5664
-
text-align: left;
5665
-
cursor: pointer;
5666
-
transition:
5667
-
background 0.15s ease,
5668
-
border-color 0.15s ease,
5669
-
box-shadow 0.15s ease;
5670
-
}
5671
-
.user-bsky-picker-trigger:hover,
5672
-
.user-bsky-picker-trigger[aria-expanded="true"] {
5673
-
background: rgba(255, 255, 255, 0.96);
5674
-
border-color: rgba(42, 90, 168, 0.3);
5675
-
box-shadow: 0 10px 24px rgba(14, 20, 40, 0.08);
5676
-
}
5677
-
.user-bsky-picker-trigger:focus-visible {
5678
-
outline: 2px solid rgba(42, 90, 168, 0.45);
5679
-
outline-offset: 2px;
5680
-
}
5681
-
.user-bsky-picker-chevron {
5682
-
margin-left: auto;
5683
-
color: rgba(18, 26, 47, 0.55);
5684
-
transition: transform 0.15s ease;
5685
-
}
5686
-
.user-bsky-picker-trigger[aria-expanded="true"] .user-bsky-picker-chevron {
5687
-
transform: rotate(180deg);
5688
-
}
5689
-
.user-bsky-picker-popover {
5690
-
position: absolute;
5691
-
top: calc(100% + 0.45rem);
5692
-
left: 0;
5693
-
right: 0;
5694
-
z-index: 30;
5695
-
margin-top: 0;
5696
-
box-shadow: 0 18px 46px rgba(14, 20, 40, 0.18);
5697
-
}
5698
-
.user-bsky-picker-popover .bsky-client-row {
5699
-
width: 100%;
5700
-
font: inherit;
5701
-
color: inherit;
5702
-
text-align: left;
5703
-
}
5704
5649
.user-review-list {
5705
5650
display: flex;
5706
5651
flex-direction: column;
···
5761
5706
.dark-phase .user-public-avatar {
5762
5707
background: rgba(255, 255, 255, 0.12);
5763
5708
color: rgba(255, 255, 255, 0.75);
5764
-
}
5765
-
.dark-phase .user-bsky-picker-trigger {
5766
-
background: rgba(255, 255, 255, 0.06);
5767
-
border-color: rgba(255, 255, 255, 0.12);
5768
-
}
5769
-
.dark-phase .user-bsky-picker-trigger:hover,
5770
-
.dark-phase .user-bsky-picker-trigger[aria-expanded="true"] {
5771
-
background: rgba(255, 255, 255, 0.1);
5772
-
border-color: rgba(160, 200, 255, 0.35);
5773
-
}
5774
-
.dark-phase .user-bsky-picker-chevron {
5775
-
color: rgba(255, 255, 255, 0.55);
5776
5709
}
5777
5710
@media (max-width: 640px) {
5778
5711
.account-type-options {
+1
-1
components/explore/ProfileRatingSummary.tsx
+1
-1
components/explore/ProfileRatingSummary.tsx
+1
-1
components/explore/ProfileReviewList.tsx
+1
-1
components/explore/ProfileReviewList.tsx
···
56
56
return (
57
57
<section class="profile-reviews-panel glass">
58
58
<div class="profile-reviews-panel-header">
59
-
<h2 class="profile-reviews-heading">{copy.heading}</h2>
59
+
<h2 class="profile-card-section-title">{copy.heading}</h2>
60
60
{action}
61
61
</div>
62
62
{reviews.length === 0
+3
-3
components/explore/ProfileWhatsNew.tsx
+3
-3
components/explore/ProfileWhatsNew.tsx
···
65
65
if (!latest) {
66
66
return (
67
67
<section class="profile-whats-new glass">
68
-
<h2>{copy.heading}</h2>
68
+
<h2 class="profile-card-section-title">{copy.heading}</h2>
69
69
<p class="profile-whats-new-empty">{copy.empty}</p>
70
70
</section>
71
71
);
···
76
76
<div class="profile-whats-new-main">
77
77
<div class="profile-whats-new-copy">
78
78
<div class="profile-whats-new-heading-row">
79
-
<p class="text-eyebrow">{copy.heading}</p>
79
+
<h2 class="profile-card-section-title">{copy.heading}</h2>
80
80
{history.length > 0 && (
81
81
<a
82
82
href="#profile-version-history"
···
89
89
)}
90
90
</div>
91
91
<UpdateMeta update={latest} />
92
-
<h2>{latest.title}</h2>
92
+
<h3 class="profile-whats-new-title">{latest.title}</h3>
93
93
{isLongBody(latest.body)
94
94
? (
95
95
<details class="profile-whats-new-expand">
+1
-2
i18n/messages/en.tsx
+1
-2
i18n/messages/en.tsx
···
923
923
body: (handle: string): string =>
924
924
`You're signed in as @${handle}. Choose whether this account represents you as a person or a project you want listed in Explore.`,
925
925
userTitle: "I'm a user",
926
-
userBody:
927
-
"Create a user profile from Bluesky, write reviews, and manage your reviews.",
926
+
userBody: "Create a user profile to write and manage your reviews.",
928
927
projectTitle: "I'm a project",
929
928
projectBody:
930
929
"Create and manage a public project profile in Explore with app links, screenshots, and developer details.",