admin/developer-roadmap
1
0 Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Migrate to Tailwind 4 + Editor Upgrade (#8465)

Browse Source 
* wip

* fix: roadmap editor

* fix: padding

* wip

* fix: remove editor package

* wip

* fix: update pnpm lock

* Add contribution docs

* UI changes for TW4

* Update deployment workflow

---------

Co-authored-by: Arik Chakma <arikchangma@gmail.com>
This commit is contained in:
Kamran AhmedandArik Chakma authored and GitHub committed 2025-04-07 12:53:25 +01:00
1 parent 09d8c709d4
commit 64a65fa2e9
239 files changed
+1167 -1171
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/Navigation/AccountDropdown.astro
+5 -5
View File
@@ -4,7 +4,7 @@ import Icon from '../AstroIcon.astro';
<div class='relative hidden' data-auth-required>
<button
class='flex h-8 w-38 items-center justify-center rounded-full bg-gradient-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600'
class='flex h-8 w-38 items-center justify-center rounded-full bg-linear-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600'
type='button'
data-account-button
>
@@ -25,7 +25,7 @@ import Icon from '../AstroIcon.astro';
<li class='px-1'>
<a
href='/account'
class='block rounded px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
class='block rounded-sm px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
>
Profile
</a>
@@ -33,7 +33,7 @@ import Icon from '../AstroIcon.astro';
<li class='px-1'>
<a
href='/account/friends'
class='block rounded px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
class='block rounded-sm px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
>
Friends
</a>
@@ -41,14 +41,14 @@ import Icon from '../AstroIcon.astro';
<li class='px-1'>
<a
href='/team'
class='block rounded px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
class='block rounded-sm px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700'
>
Teams
</a>
</li>
<li class='px-1'>
<button
class='block w-full rounded px-4 py-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700'
class='block w-full rounded-sm px-4 py-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700'
type='button'
data-logout-button
>
src/components/Navigation/AccountDropdown.tsx
+2 -2
View File
@@ -105,7 +105,7 @@ export function AccountDropdown() {
/>
)}
<div className="relative z-[90] animate-fade-in">
<div className="relative z-90 animate-fade-in">
{isOnboardingModalOpen && onboardingConfig && (
<OnboardingModal
onboardingConfig={onboardingConfig}
@@ -126,7 +126,7 @@ export function AccountDropdown() {
)}
<button
className="relative flex h-8 w-40 items-center justify-center gap-1.5 rounded-full bg-gradient-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600"
className="relative flex h-8 w-40 items-center justify-center gap-1.5 rounded-full bg-linear-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600"
onClick={() => {
setIsTeamsOpen(false);
setShowDropdown(!showDropdown);
src/components/Navigation/AccountDropdownList.tsx
+9 -9
View File
@@ -43,7 +43,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
<li className="mb-1 px-1">
<button
className={cn(
'flex h-9 w-full items-center rounded py-1 pl-3 pr-2 text-sm font-medium text-slate-100 hover:opacity-80',
'flex h-9 w-full items-center rounded-sm py-1 pl-3 pr-2 text-sm font-medium text-slate-100 hover:opacity-80',
isConfigLoading
? 'striped-loader-darker flex border-slate-800 opacity-70'
: 'border-slate-600 bg-slate-700',
@@ -70,7 +70,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
<li className="px-1">
<a
href="/account"
className="group flex items-center gap-2 rounded py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex items-center gap-2 rounded-sm py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
>
<User2 className="h-4 w-4 stroke-[2.5px] text-slate-400 group-hover:text-white" />
Account
@@ -79,13 +79,13 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
<li className="px-1">
<a
href="/account/update-profile"
className="group flex items-center justify-between gap-2 rounded py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex items-center justify-between gap-2 rounded-sm py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
>
<span className="flex items-center gap-2">
<SquareUserRound className="h-4 w-4 stroke-[2.5px] text-slate-400 group-hover:text-white" />
My Profile
</span>
<span className="rounded-sm bg-yellow-300 px-1 text-xs uppercase tracking-wide text-black">
<span className="rounded-xs bg-yellow-300 px-1 text-xs uppercase tracking-wide text-black">
New
</span>
</a>
@@ -93,7 +93,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
<li className="px-1">
<a
href="/account/friends"
className="group flex items-center gap-2 rounded py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex items-center gap-2 rounded-sm py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
>
<Users2 className="h-4 w-4 stroke-[2px] text-slate-400 group-hover:text-white" />
Friends
@@ -104,7 +104,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
onClick={() => {
onCreateRoadmap();
}}
className="group flex w-full items-center gap-2 rounded py-2 pl-3 pr-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex w-full items-center gap-2 rounded-sm py-2 pl-3 pr-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700"
>
<Plus className="h-4 w-4 stroke-[2px] text-slate-400 group-hover:text-white" />
New Roadmap
@@ -113,7 +113,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
<li className="border-b border-b-gray-700/60 px-1 pb-1">
<a
href="/account/roadmaps"
className="group flex items-center gap-2 rounded py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex items-center gap-2 rounded-sm py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
>
<Map className="h-4 w-4 stroke-[2px] text-slate-400 group-hover:text-white" />
Roadmaps
@@ -121,7 +121,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
</li>
<li className="px-1 pt-1">
<button
className="group flex w-full items-center justify-between rounded py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex w-full items-center justify-between rounded-sm py-2 pl-3 pr-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
onClick={() => setIsTeamsOpen(true)}
>
<span className="flex items-center gap-2.5">
@@ -133,7 +133,7 @@ export function AccountDropdownList(props: AccountDropdownListProps) {
</li>
<li className="px-1">
<button
className="group flex w-full items-center gap-2 rounded py-2 pl-3 pr-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700"
className="group flex w-full items-center gap-2 rounded-sm py-2 pl-3 pr-2 text-left text-sm font-medium text-slate-100 hover:bg-slate-700"
type="button"
onClick={logout}
>
src/components/Navigation/DropdownTeamList.tsx
+4 -4
View File
@@ -52,13 +52,13 @@ export function DropdownTeamList(props: DropdownTeamListProps) {
<>
<div className="flex items-center justify-between px-2">
<button
className="mt-1 flex h-5 w-5 items-center justify-center rounded text-slate-400 hover:bg-slate-50/10 hover:text-slate-50"
className="mt-1 flex h-5 w-5 items-center justify-center rounded-sm text-slate-400 hover:bg-slate-50/10 hover:text-slate-50"
onClick={() => setIsTeamsOpen(false)}
>
<ChevronLeft className="h-4 w-4 stroke-[2.5px]" />
</button>
<a
className="mt-1 flex h-5 w-5 items-center justify-center rounded text-slate-400 hover:bg-slate-50/10 hover:text-slate-50"
className="mt-1 flex h-5 w-5 items-center justify-center rounded-sm text-slate-400 hover:bg-slate-50/10 hover:text-slate-50"
href="/team/new"
>
<Plus className="h-4 w-4 stroke-[2.5px]" />
@@ -80,7 +80,7 @@ export function DropdownTeamList(props: DropdownTeamListProps) {
<li key={team._id} className="px-1">
<a
href={pageLink}
className="block truncate rounded px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
className="block truncate rounded-sm px-4 py-2 text-sm font-medium text-slate-100 hover:bg-slate-700"
>
{team.name}
</a>
@@ -90,7 +90,7 @@ export function DropdownTeamList(props: DropdownTeamListProps) {
{teamList.length === 0 && !isLoading && (
<li className="mt-2 px-1 text-center">
<p className="block rounded px-4 py-2 text-sm font-medium text-slate-500">
<p className="block rounded-sm px-4 py-2 text-sm font-medium text-slate-500">
<Users className="mx-auto mb-2 h-7 w-7 text-slate-600" />
No teams found.{' '}
<a
src/components/Navigation/Navigation.astro
+1 -1
View File
@@ -66,7 +66,7 @@ import { CourseAnnouncement } from '../SQLCourse/CourseAnnouncement';
<a
data-guest-required
class='flex hidden h-8 w-28 cursor-pointer items-center justify-center rounded-full bg-gradient-to-r from-blue-500 to-blue-700 px-4 py-2 text-sm font-medium text-white hover:from-blue-500 hover:to-blue-600'
class='flex hidden h-8 w-28 cursor-pointer items-center justify-center rounded-full bg-linear-to-r from-blue-500 to-blue-700 px-4 py-2 text-sm font-medium text-white hover:from-blue-500 hover:to-blue-600'
href='/signup'
>
<span>Sign Up</span>
src/components/Navigation/OnboardingModal.tsx
+1 -1
View File
@@ -232,7 +232,7 @@ export function OnboardingModal(props: OnboardingModalProps) {
<div className="mt-2 px-11 pb-5">
<button
className="w-full rounded-md bg-gradient-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600"
className="w-full rounded-md bg-linear-to-r from-purple-500 to-purple-700 px-4 py-2 text-sm font-medium text-white hover:from-purple-500 hover:to-purple-600"
onClick={onClose}
>
Do it later