Bhasher/focus
Bhasher
/
focus
1
1
Fork 0
Code Issues Pull Requests Actions Packages Releases 6 Activity

Move ID to top right

This commit is contained in:
Brieuc Dubois 2024-01-12 00:39:22 +01:00
parent 4b611f9555
commit b60994a984
1 changed files with 23 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
frontend/src/lib/components/card/Card.svelte
View File

@ -19,7 +19,10 @@
if (e.key === 'Enter') showModal = true; if (e.key === 'Enter') showModal = true;
}} }}
> >
<div class="title">{card.id} - {card.title}</div> <div class="header">
<div class="title">{card.title}</div>
<div class="id">#{card.id}</div>
</div>
<div class="tags"> <div class="tags">
{#each card.cardTags as tag} {#each card.cardTags as tag}
{#if tag.option} {#if tag.option}
@ -43,27 +46,38 @@
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-size: 14px; font-size: 14px;
margin-bottom: 10px; margin-bottom: 10px;
&:hover {
background-color: #303030;
cursor: pointer;
}
} }
.card:hover { .title {
background-color: #303030;
cursor: pointer;
}
.card .title {
font-weight: normal; font-weight: normal;
} }
.card .tags { .tags {
padding-top: 10px; padding-top: 10px;
font-weight: lighter; font-weight: lighter;
} }
.card .tag { .tag {
padding: 2px 8px; padding: 2px 8px;
margin: 4px 4px 0 0; margin: 4px 4px 0 0;
text-transform: uppercase; text-transform: uppercase;
border-radius: 3px; border-radius: 3px;
font-size: 90%; font-size: 90%;
} }
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
.id {
font-size: 80%;
color: #fff5;
}
}
</style> </style>