computer-scienceangular-roadmapbackend-roadmapblockchain-roadmapdba-roadmapdeveloper-roadmapdevops-roadmapfrontend-roadmapgo-roadmaphactoberfestjava-roadmapjavascript-roadmapnodejs-roadmappython-roadmapqa-roadmapreact-roadmaproadmapstudy-planvue-roadmapweb3-roadmap
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
45 lines
1.1 KiB
45 lines
1.1 KiB
--- |
|
import type { GuideFileType } from '../lib/guide'; |
|
import { replaceVariables } from '../lib/markdown'; |
|
|
|
export interface Props { |
|
guide: GuideFileType; |
|
} |
|
|
|
const { guide } = Astro.props; |
|
const { frontmatter, id } = guide; |
|
--- |
|
|
|
<a |
|
class:list={[ |
|
'text-md group block flex items-center justify-between border-b py-2 text-gray-600 no-underline hover:text-blue-600', |
|
]} |
|
href={frontmatter.excludedBySlug |
|
? frontmatter.excludedBySlug |
|
: `/guides/${id}`} |
|
> |
|
<span |
|
class='text-sm transition-transform group-hover:translate-x-2 md:text-base' |
|
> |
|
{replaceVariables(frontmatter.title)} |
|
|
|
{ |
|
frontmatter.isNew && ( |
|
<span class='ml-1.5 rounded-sm bg-green-300 px-1.5 py-0.5 text-xs font-medium uppercase text-green-900'> |
|
New |
|
<span class='hidden sm:inline'> |
|
· |
|
{new Date(frontmatter.date).toLocaleString('default', { |
|
month: 'long', |
|
})} |
|
</span> |
|
</span> |
|
) |
|
} |
|
</span> |
|
<span class='hidden text-xs capitalize text-gray-500 sm:block'> |
|
{frontmatter.type} |
|
</span> |
|
|
|
<span class='block text-xs text-gray-400 sm:hidden'> »</span> |
|
</a>
|
|
|