diff options
| author |  Mark Peck <peck.mark@gmail.com>
| 2023-07-24 16:40:18 -0500 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-07-24 16:40:18 -0500 |
| commit | 13120a0493483d0b10ae3b6c32346aa96ea1cf2d (patch) | |
| tree | 184ae33c60536ec8a634426fc46c04c19f1ae5f1 /examples/basics/src/components | |
| parent | 0a1b33349fc12d9927e6eef2b66588afedf517a1 (diff) | |
| download | astro-13120a0493483d0b10ae3b6c32346aa96ea1cf2d.tar.gz astro-13120a0493483d0b10ae3b6c32346aa96ea1cf2d.tar.zst astro-13120a0493483d0b10ae3b6c32346aa96ea1cf2d.zip | |
Basics theme styling updates (#7760)
* update styling and include asset
* whoopsies, didnt mean to include these
* im rusty dont judge
* another thing I didn't want pushed
* anything for chris
* for natey poo
* just stop
Diffstat (limited to 'examples/basics/src/components')
| -rw-r--r-- | examples/basics/src/components/Card.astro | 20 |
1 files changed, 9 insertions, 11 deletions
diff --git a/examples/basics/src/components/Card.astro b/examples/basics/src/components/Card.astro index a1e0ccf6e..5ce15cca4 100644 --- a/examples/basics/src/components/Card.astro +++ b/examples/basics/src/components/Card.astro @@ -23,24 +23,23 @@ const { href, title, body } = Astro.props; .link-card { list-style: none; display: flex; - padding: 0.25rem; - background-color: white; + padding: 1px; + background-color: #23262D; background-image: none; background-size: 400%; - border-radius: 0.6rem; + border-radius: 7px; background-position: 100%; transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1); - box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 0 0 1px rgba(255,255,255, 0.1); } - .link-card > a { width: 100%; text-decoration: none; line-height: 1.4; - padding: 1rem 1.3rem; - border-radius: 0.35rem; - color: #111; - background-color: white; + padding: calc(1.5rem - 1px); + border-radius: 8px; + color: white; + background-color: #23262D; opacity: 0.8; } h2 { @@ -51,13 +50,12 @@ const { href, title, body } = Astro.props; p { margin-top: 0.5rem; margin-bottom: 0; - color: #444; } .link-card:is(:hover, :focus-within) { background-position: 0; background-image: var(--accent-gradient); } .link-card:is(:hover, :focus-within) h2 { - color: rgb(var(--accent)); + color: rgb(var(--accent-light)); } </style> |