alecodes/personal-page
2
0
Fork 0
Code Issues 17 Pull requests Projects 1 Releases Packages 1 Wiki Activity Actions

update cards style

Browse source
This commit is contained in:
Alexander Navarro 2023-08-27 12:54:35 -04:00
parent 525d4de3cd
commit 5bde1eb8d3
4 changed files with 164 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/Card.astro
View file

@ -8,12 +8,12 @@ export interface Props {
const { href, title, body } = Astro.props;
---
<div class="card">
<div class="card vstack">
<div class="title">
<slot name="title" />
</div>
<div class="content">
<div class="content flex-grow mb-3">
<slot />
</div>
@ -24,12 +24,22 @@ const { href, title, body } = Astro.props;
<style>
.card {
background-color: var(--prj-surface-1);
color: var(--prj-surface-text);
border: 1px solid var(--prj-accent-bg);
border-radius: 8px;
padding: var(--prj-spacing-2) var(--prj-spacing-3);
}
.card :global(a) {
text-decoration-line: none;
}
.card :global(a):hover {
text-decoration-line: underline;
}
.title > :global(:last-child) {
margin-bottom: var(--prj-spacing-2);
}