Skip to content

chore: use Tailwind color tokens instead of hardcoded hex values #26557

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.

Sign up for GitHub

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

Merged
dhairyashiil merged 7 commits into from
Jan 7, 2026
Merged

chore: use Tailwind color tokens instead of hardcoded hex values #26557

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
3327605
style: use Tailwind color tokens instead of hardcoded hex values
dylantarre Jan 5, 2026
2b7551e
Merge branch 'main' into fix/use-gray-500-token
Udit-takkar Jan 5, 2026
3fcc52f
Merge branch 'main' into fix/use-gray-500-token
PeerRich Jan 5, 2026
9149273
Merge branch 'main' into fix/use-gray-500-token
anikdhabal Jan 7, 2026
9c4c97f
Merge branch 'main' into fix/use-gray-500-token
devin-ai-integration[bot] Jan 7, 2026
ada1281
Merge branch 'main' into fix/use-gray-500-token
volnei Jan 7, 2026
12fc7a9
Merge branch 'main' into fix/use-gray-500-token
volnei Jan 7, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/web/modules/videos/views/videos-single-view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -522,7 +522,7 @@ export function LogInOverlay(props: LogInOverlayProps) {
<h4 className="text-base font-semibold text-black dark:text-white">
{t("sign_in_to_cal_com")}
</h4>
<p className="text-sm text-[#6B7280] dark:text-gray-300">
<p className="text-sm text-gray-500 dark:text-gray-300">
{t("track_meetings_and_manage_schedule")}
</p>
</div>
Expand Down
16 changes: 8 additions & 8 deletions companion/app/(tabs)/(event-types)/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -617,8 +617,8 @@ export default function EventTypes() {
<View>
<AlertDialogText className="mb-2 text-sm font-medium">Title</AlertDialogText>
<TextInput
className={`rounded-md border bg-white px-3 py-2.5 text-base text-[#111827] ${
titleError ? "border-red-500" : "border-[#D1D5DB]"
className={`rounded-md border bg-white px-3 py-2.5 text-base text-gray-900 ${
titleError ? "border-red-500" : "border-gray-300"
}`}
placeholder="Quick Chat"
placeholderTextColor="#9CA3AF"
Expand Down Expand Up @@ -668,10 +668,10 @@ export default function EventTypes() {
>
{/* Header */}
<View className="px-8 pb-4 pt-6">
<Text className="mb-2 text-2xl font-semibold text-[#111827]">
<Text className="mb-2 text-2xl font-semibold text-gray-900">
Add a new event type
</Text>
<Text className="text-sm text-[#6B7280]">
<Text className="text-sm text-gray-500">
Set up event types to offer different types of meetings.
</Text>
</View>
Expand All @@ -680,9 +680,9 @@ export default function EventTypes() {
<View className="px-8 pb-6">
{/* Title */}
<View className="mb-4">
<Text className="mb-2 text-sm font-medium text-[#374151]">Title</Text>
<Text className="mb-2 text-sm font-medium text-gray-700">Title</Text>
<TextInput
className="rounded-md border border-[#D1D5DB] bg-white px-3 py-2.5 text-base text-[#111827] focus:border-black focus:ring-2 focus:ring-black"
className="rounded-md border border-gray-300 bg-white px-3 py-2.5 text-base text-gray-900 focus:border-black focus:ring-2 focus:ring-black"
placeholder="Quick Chat"
placeholderTextColor="#9CA3AF"
value={newEventTitle}
Expand All @@ -699,11 +699,11 @@ export default function EventTypes() {
<View className="rounded-b-2xl border-t border-[#E5E7EB] bg-[#F9FAFB] px-8 py-4">
<View className="flex-row justify-end gap-2 space-x-2">
<TouchableOpacity
className="rounded-xl border border-[#D1D5DB] bg-white px-4 py-2"
className="rounded-xl border border-gray-300 bg-white px-4 py-2"
onPress={handleCloseCreateModal}
disabled={creating}
>
<Text className="text-base font-medium text-[#374151]">Close</Text>
<Text className="text-base font-medium text-gray-700">Close</Text>
</TouchableOpacity>
<TouchableOpacity
className={`rounded-xl bg-[#111827] px-4 py-2 ${creating ? "opacity-60" : ""}`}
Expand Down
2 changes: 1 addition & 1 deletion companion/components/booking-list-screen/BookingListScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -791,7 +791,7 @@ export const BookingListScreen: React.FC<BookingListScreenProps> = ({
<View>
<UIText className="mb-2 text-sm font-medium">Reason for cancellation</UIText>
<TextInput
className="rounded-md border border-[#D1D5DB] bg-white px-3 py-2.5 text-base text-[#111827]"
className="rounded-md border border-gray-300 bg-white px-3 py-2.5 text-base text-gray-900"
placeholder="Why are you cancelling?"
placeholderTextColor="#9CA3AF"
value={cancelReason}
Expand Down
4 changes: 2 additions & 2 deletions companion/components/event-type-detail/tabs/AdvancedTab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -320,7 +320,7 @@ export function AdvancedTab(props: AdvancedTabProps) {
className={`mr-3 h-5 w-5 items-center justify-center rounded border ${
props.showAttendeeInfo
? "border-[#111827] bg-[#111827]"
: "border-[#D1D5DB] bg-white"
: "border-gray-300 bg-white"
}`}
>
{props.showAttendeeInfo && <Ionicons name="checkmark" size={14} color="#fff" />}
Expand All @@ -338,7 +338,7 @@ export function AdvancedTab(props: AdvancedTabProps) {
className={`mr-3 h-5 w-5 items-center justify-center rounded border ${
props.showAvailabilityCount
? "border-[#111827] bg-[#111827]"
: "border-[#D1D5DB] bg-white"
: "border-gray-300 bg-white"
}`}
>
{props.showAvailabilityCount ? (
Expand Down
14 changes: 7 additions & 7 deletions companion/components/screens/AvailabilityListScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -396,8 +396,8 @@ export function AvailabilityListScreen({
<View>
<AlertDialogText className="mb-2 text-sm font-medium">Name</AlertDialogText>
<TextInput
className={`rounded-md border bg-white px-3 py-2.5 text-base text-[#111827] ${
nameError ? "border-red-500" : "border-[#D1D5DB]"
className={`rounded-md border bg-white px-3 py-2.5 text-base text-gray-900 ${
nameError ? "border-red-500" : "border-gray-300"
}`}
placeholder="Working Hours"
placeholderTextColor="#9CA3AF"
Expand Down Expand Up @@ -452,15 +452,15 @@ export function AvailabilityListScreen({
>
{/* Header */}
<View className="px-8 pb-4 pt-6">
<Text className="text-2xl font-semibold text-[#111827]">Add a new schedule</Text>
<Text className="text-2xl font-semibold text-gray-900">Add a new schedule</Text>
</View>

{/* Content */}
<View className="px-8 pb-6">
<View className="mb-1">
<Text className="mb-2 text-sm font-medium text-[#374151]">Name</Text>
<Text className="mb-2 text-sm font-medium text-gray-700">Name</Text>
<TextInput
className="rounded-md border border-[#D1D5DB] bg-white px-3 py-2.5 text-base text-[#111827]"
className="rounded-md border border-gray-300 bg-white px-3 py-2.5 text-base text-gray-900"
placeholder="Working Hours"
placeholderTextColor="#9CA3AF"
value={newScheduleName}
Expand All @@ -477,14 +477,14 @@ export function AvailabilityListScreen({
<View className="rounded-b-2xl border-t border-[#E5E7EB] bg-[#F9FAFB] px-8 py-4">
<View className="flex-row justify-end gap-2 space-x-2">
<AppPressable
className="rounded-xl border border-[#D1D5DB] bg-white px-2 py-2 md:px-4"
className="rounded-xl border border-gray-300 bg-white px-2 py-2 md:px-4"
onPress={() => {
onShowCreateModalChange(false);
setNewScheduleName("");
}}
disabled={creating}
>
<Text className="text-base font-medium text-[#374151]">Close</Text>
<Text className="text-base font-medium text-gray-700">Close</Text>
</AppPressable>
<AppPressable
className={`rounded-xl bg-[#111827] px-2 py-2 md:px-4 ${
Expand Down
Loading