diff --git a/src/app.css b/src/app.css index 0f27bd0..e9aafe6 100644 --- a/src/app.css +++ b/src/app.css @@ -242,6 +242,10 @@ .database-item-card.talent-card>header{min-height:86px} @media(max-width:700px){.database-item-card>header:has(.database-item-render){grid-template-columns:52px 42px minmax(0,1fr);gap:8px}.database-item-card>header:has(.database-item-render) .database-item-render{width:52px;height:52px}.database-item-card>header:has(.database-item-render) .database-header-status{grid-column:3;position:static;justify-self:end}} +.database-item-card>header:has(.database-item-render){position:relative;isolation:isolate;grid-template-columns:44px minmax(0,1fr);min-height:104px;overflow:hidden;background:#101415}.database-item-card>header:has(.database-item-render)::after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,rgba(8,11,12,.92) 0%,rgba(8,11,12,.76) 48%,rgba(8,11,12,.48) 100%);pointer-events:none}.database-item-card>header:has(.database-item-render) .database-item-render{position:absolute;z-index:0;inset:0;width:100%;height:100%;border:0;object-fit:cover;opacity:.82}.database-item-card>header:has(.database-item-render) .database-item-icon,.database-item-card>header:has(.database-item-render) .database-item-identity{position:relative;z-index:2}.database-item-card>header:has(.database-item-render) .database-header-status{position:absolute;z-index:2;right:12px}.database-item-card>header:has(.database-item-render) .database-item-icon{width:44px;height:44px}.database-item-card>header:has(.database-item-render) .database-item-icon :is(img,.game-icon){width:38px;height:38px} +.database-item-card:not(:has(.database-item-render)) .database-item-icon{width:48px;height:48px}.database-item-card:not(:has(.database-item-render)) .database-item-icon :is(img,.game-icon){width:42px;height:42px} +.database-item-facts.stacked>div.primary.armor-fact{border-left-color:#71aaa5;background:linear-gradient(90deg,#13211f,#101516)}.database-item-facts.stacked>div.primary.armor-fact>span{color:#8eb9b4}.database-item-facts.stacked>div.primary.armor-fact b{color:#a5d1ca} +@media(max-width:700px){.database-item-card>header:has(.database-item-render){grid-template-columns:42px minmax(0,1fr);min-height:92px}.database-item-card>header:has(.database-item-render) .database-item-icon{width:42px;height:42px}.database-item-card>header:has(.database-item-render) .database-item-icon :is(img,.game-icon){width:36px;height:36px}.database-item-card:not(:has(.database-item-render)) .database-item-icon{width:44px;height:44px}.database-item-card:not(:has(.database-item-render)) .database-item-icon :is(img,.game-icon){width:38px;height:38px}} .database-item-card.talent-card h2{font-size:18px;line-height:1.1} .database-item-card.talent-card>header small,.database-item-card.talent-card .database-item-lines span{color:var(--shd-text-muted)} .database-talent-tiers{display:grid;gap:var(--shd-gap-sm);margin:10px 12px 0} diff --git a/src/lib/components/DatabaseFacts.svelte b/src/lib/components/DatabaseFacts.svelte index 7b6e927..d02a92a 100644 --- a/src/lib/components/DatabaseFacts.svelte +++ b/src/lib/components/DatabaseFacts.svelte @@ -15,7 +15,7 @@