summaryrefslogtreecommitdiffstats
path: root/assets/css/components/card.css
diff options
context:
space:
mode:
authorDanilo M. <danix@danix.xyz>2026-04-22 12:42:56 +0200
committerDanilo M. <danix@danix.xyz>2026-04-22 12:42:56 +0200
commit631547a75142326a7c71bdf123e1475217a5ad73 (patch)
treef3cfef6b3c5b42bf626fc823ddcf63b8dcf4cdbb /assets/css/components/card.css
parent77ccbe72fad5a4870185fff374f75471c16a9043 (diff)
downloaddanixxyz-theme-631547a75142326a7c71bdf123e1475217a5ad73.tar.gz
danixxyz-theme-631547a75142326a7c71bdf123e1475217a5ad73.zip
chore: replace with extracted danix.xyz-hacker theme (danix2-hugo-theme)
Diffstat (limited to 'assets/css/components/card.css')
-rw-r--r--assets/css/components/card.css254
1 files changed, 0 insertions, 254 deletions
diff --git a/assets/css/components/card.css b/assets/css/components/card.css
deleted file mode 100644
index 3d218bc..0000000
--- a/assets/css/components/card.css
+++ /dev/null
@@ -1,254 +0,0 @@
-/* card.css */
-.post-card {
- background: var(--surface);
- border: 1px solid var(--border);
- border-radius: 8px;
- overflow: hidden;
- transition: var(--transition);
- display: flex;
- gap: var(--gap-md);
-}
-
-.post-card:hover {
- border-color: var(--accent);
- box-shadow: 0 0 20px rgba(168, 85, 247, 0.2);
-}
-
-.post-card-image {
- width: 120px;
- height: 100px;
- flex-shrink: 0;
- object-fit: cover;
- background: linear-gradient(135deg, var(--border), var(--bg2));
- border-right: 1px solid var(--border);
-}
-
-@media (min-width: 768px) {
- .post-card-image {
- width: 160px;
- height: 120px;
- }
-}
-
-.post-card-body {
- padding: var(--gap-md);
- display: flex;
- flex-direction: column;
- justify-content: center;
- flex-grow: 1;
-}
-
-.post-type-badge {
- display: inline-block;
- font-family: var(--font-mono);
- font-size: var(--fs-badge);
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 0.1em;
- padding: 0.35rem 0.7rem;
- border-radius: 20px;
- margin-bottom: 0.5rem;
- width: fit-content;
-}
-
-/* Type-specific badge colors */
-.post-type-badge.tech {
- background: color-mix(in srgb, var(--type-tech) 15%, transparent);
- border: 1px solid color-mix(in srgb, var(--type-tech) 30%, transparent);
- color: var(--type-tech);
-}
-
-.post-type-badge.life {
- background: color-mix(in srgb, var(--type-life) 15%, transparent);
- border: 1px solid color-mix(in srgb, var(--type-life) 30%, transparent);
- color: var(--type-life);
-}
-
-.post-type-badge.quote {
- background: color-mix(in srgb, var(--type-quote) 15%, transparent);
- border: 1px solid color-mix(in srgb, var(--type-quote) 30%, transparent);
- color: var(--type-quote);
-}
-
-.post-type-badge.link {
- background: color-mix(in srgb, var(--type-link) 15%, transparent);
- border: 1px solid color-mix(in srgb, var(--type-link) 30%, transparent);
- color: var(--type-link);
-}
-
-.post-type-badge.photo {
- background: color-mix(in srgb, var(--type-photo) 15%, transparent);
- border: 1px solid color-mix(in srgb, var(--type-photo) 30%, transparent);
- color: var(--type-photo);
-}
-
-.post-card-title {
- font-family: var(--font-head);
- font-size: 1.1rem;
- font-weight: 700;
- line-height: 1.3;
- margin-bottom: 0.5rem;
- color: var(--text);
-}
-
-.post-card-title a {
- color: var(--text);
- text-decoration: none;
-}
-
-.post-card-title a:hover {
- color: var(--accent);
-}
-
-.post-card-excerpt {
- color: var(--text-dim);
- font-size: 0.9rem;
- line-height: 1.6;
- display: -webkit-box;
- -webkit-line-clamp: 2;
- -webkit-box-orient: vertical;
- overflow: hidden;
- margin-bottom: 0.5rem;
-}
-
-.post-card-meta {
- display: flex;
- gap: 1rem;
- font-family: var(--font-mono);
- font-size: 0.75rem;
- color: var(--muted);
- text-transform: uppercase;
- letter-spacing: 0.08em;
-}
-
-/* Featured card in grid */
-.post-card.featured {
- grid-row: span 2;
-}
-
-.post-card.featured .post-card-image {
- width: 100%;
- height: 180px;
- border-right: none;
- border-bottom: 1px solid var(--border);
-}
-
-.post-card.featured .post-card-body {
- padding: var(--gap-lg);
-}
-
-@media (max-width: 768px) {
- .post-card {
- flex-direction: column;
- }
-
- .post-card-image {
- width: 100%;
- height: 150px;
- border-right: none;
- border-bottom: 1px solid var(--border);
- }
-
- .post-card.featured .post-card-image {
- height: 150px;
- }
-}
-
-/* ─── Homepage article cards ─────────────────────────────── */
-
-.articles-grid {
- display: grid;
- grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
- gap: 1.5rem;
- margin-bottom: 2rem;
-}
-
-@media (max-width: 768px) {
- .articles-grid { grid-template-columns: 1fr; }
-}
-
-.article-card {
- background: var(--surface);
- border: 1px solid var(--border);
- border-radius: 0;
- overflow: hidden;
- display: flex;
- flex-direction: column;
- transition: var(--transition);
-}
-
-.article-card:hover {
- transform: translate(0, -4px);
- box-shadow: 0 8px 30px var(--accent-glow);
- border-color: var(--accent);
-}
-
-/* Badge background set via inline style in template using var(--type-*) */
-.article-type {
- font-family: var(--font-mono);
- font-size: var(--fs-badge);
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 0.1em;
- padding: 0.4rem 1rem;
- color: var(--bg);
- width: fit-content;
- border-radius: 3px;
- margin: 1rem 1rem 0;
-}
-
-.article-content {
- padding: 1rem 1rem 1.5rem;
- display: flex;
- flex-direction: column;
- flex: 1;
-}
-
-.article-title {
- font-family: var(--font-head);
- font-size: 1.1rem;
- font-weight: 700;
- line-height: 1.3;
- margin-bottom: 0.5rem;
- letter-spacing: -0.025em;
-}
-
-.article-title a { color: var(--text); text-decoration: none; }
-.article-title a:hover { color: var(--accent); }
-
-.article-excerpt {
- color: var(--text-dim);
- font-size: 0.9rem;
- line-height: 1.6;
- flex: 1;
- margin-bottom: 1rem;
- display: -webkit-box;
- -webkit-line-clamp: 3;
- -webkit-box-orient: vertical;
- overflow: hidden;
-}
-
-.article-meta {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding-top: 1rem;
- border-top: 1px solid var(--border);
- font-family: var(--font-mono);
- font-size: 0.75rem;
- color: var(--muted);
- text-transform: uppercase;
- letter-spacing: 0.08em;
- margin-top: auto;
-}
-
-/* .article-read named distinctly from .article-link (used in 404.css) */
-.article-read {
- color: var(--accent);
- text-decoration: none;
- font-weight: 600;
- letter-spacing: 0.05em;
- transition: color var(--duration-fast) ease;
-}
-
-.article-read:hover { color: var(--accent2); }