Skip to content

Commit

Permalink
fix: tags overflow issue and other minor modifications
Browse files Browse the repository at this point in the history
  • Loading branch information
CS76 committed Oct 18, 2023
1 parent e1ee38b commit b9fea90
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 95 deletions.
62 changes: 4 additions & 58 deletions resources/js/Pages/Public/Project/Layout.vue
Original file line number Diff line number Diff line change
Expand Up @@ -93,48 +93,8 @@
alt=""
/>
</div>
<div
class="mt-6 sm:flex-1 sm:min-w-0 sm:flex sm:justify-center sm:space-x-0 sm:pb-1"
>
<div
class="sm:hidden 2xl:block min-w-0 flex-1"
>
<div
class="text-2xl font-bold text-gray-900 break-words float-left"
>
{{ project.data.name }}

<p class="text-gray-700 pl-1">
<img
:src="
'badge/doi/' +
project.data.identifier
"
/>
</p>
</div>
<div class="flex-1 float-left">
<a
:href="downloadURL"
:class="[
active
? 'bg-gray-100 text-gray-600'
: 'text-gray-500',
'block ml-2 mt-1 text-sm cursor-pointer hover:text-gray-900',
]"
>
<ArrowDownTrayIcon
class="h-5 w-5 inline"
aria-hidden="true"
/>
</a>
</div>
</div>
</div>
</div>
<div
class="hidden sm:block 2xl:hidden min-w-0 flex-1"
>
<div class="min-w-0 flex-1">
<h1
class="text-2xl pl-1 font-bold text-gray-900 break-words"
>
Expand All @@ -152,30 +112,16 @@
"
/>
</p>
<a
:href="downloadURL"
:class="[
active
? 'bg-gray-100 text-gray-600'
: 'text-gray-500',
'block ml-2 mt-1 text-sm cursor-pointer hover:text-gray-900',
]"
>
<ArrowDownTrayIcon
class="h-5 w-5 inline"
aria-hidden="true"
/>
</a>
<div class="sm:col-span-12 pt-4">
<a
<span
class="mt-1 inline-flex items-center rounded-full bg-gray-50 px-2 py-1 text-xs font-medium text-gray-600 ring-1 ring-inset ring-gray-500/10"
v-for="tag in project.data.tags"
:key="tag.id"
target="_blank"
:href="
'/projects?tag=' + tag.name.en
"
class="mr-1 float rounded-full border border-gray-200 items-center py-1.5 pl-3 pr-3 text-sm font-medium bg-white text-gray-900 hover:text-white hover:bg-black"
><span>{{ tag.name.en }}</span></a
>{{ tag.name.en }}</span
>
</div>
</div>
Expand Down
53 changes: 16 additions & 37 deletions resources/js/Shared/ProjectCard.vue
Original file line number Diff line number Diff line change
Expand Up @@ -68,43 +68,22 @@
class="block cursor-pointer"
>
<p
class="text-lg font-black text-gray-900 line-clamp-2"
class="text-lg h-14 font-black text-gray-900 line-clamp-2"
>
{{ project.name }}
</p>
<div>
<dd
class="text-xs text-gray-900 space-y-5 mt-1"
>
<p>
<span
v-for="tag in project.tags"
:key="tag.id"
class="mr-1"
>
<span
class="mb-1 inline-flex items-center px-2.5 py-0.5 rounded-md text-xs font-medium bg-indigo-100 text-indigo-800"
>
<svg
class="-ml-0.5 mr-1.5 h-2 w-2 text-indigo-400"
fill="currentColor"
viewBox="0 0 8 8"
>
<circle
cx="4"
cy="4"
r="3"
/>
</svg>
{{ tag.name["en"] }}
</span>
</span>
</p>
</dd>
</div>
<p class="text-xs text-gray-500 line-clamp-3">
{{ project.description }}
</p>
<div class="mt-1 h-14 overflow-hidden">
<span
class="mt-1 inline-flex items-center rounded-full bg-gray-50 px-2 py-1 text-xs font-medium text-gray-600 ring-1 ring-inset ring-gray-500/10"
v-for="tag in project.tags"
:key="tag.id"
>
{{ tag.name["en"] }}
</span>
</div>
</Link>
</div>
</div>
Expand All @@ -118,12 +97,12 @@
:src="project.owner.profile_photo_url"
/>
</div>
<div class="flex-auto pl-4">
<p class="text-xs font-xs font-semibold text-black">
<a>
{{ project.owner.first_name }}
{{ project.owner.last_name }}</a
>
<div
class="flex-auto pl-4 text-xs font-xs font-semibold text-black"
>
<p class="text-ellipsis overflow-hidden ...">
{{ project.owner.first_name }}
{{ project.owner.last_name }}
</p>
<div
class="flex-1 space-x-1 text-xs font-xs text-gray-500"
Expand Down

0 comments on commit b9fea90

Please sign in to comment.