fix: design feedback patch

This commit is contained in:
Gustav
2025-01-30 15:11:58 -07:00
parent ac6053361e
commit afdaeb3d34
5 changed files with 16 additions and 16 deletions

View File

@@ -28,7 +28,7 @@ export const SystemKillsContent: React.FC<SystemKillsContentProps> = ({
<div <div
className={clsx( className={clsx(
'flex flex-col w-full text-stone-200 text-xs transition-all duration-300', 'flex flex-col w-full text-stone-200 text-xs transition-all duration-300',
compact ? 'gap-0.5 p-1' : 'gap-1 p-1', compact ? 'p-1' : 'p-1',
)} )}
> >
{sortedKills.map(kill => { {sortedKills.map(kill => {

View File

@@ -61,7 +61,7 @@ export const CompactKillRow: React.FC<CompactKillRowProps> = ({ killDetails, sys
return ( return (
<div <div
className={clsx( className={clsx(
'h-10 flex items-center border-b border-stone-700 px-1', 'h-10 flex items-center border-b border-stone-800',
'text-xs whitespace-nowrap overflow-hidden leading-none', 'text-xs whitespace-nowrap overflow-hidden leading-none',
)} )}
> >

View File

@@ -61,14 +61,8 @@ export const FullKillRow: React.FC<FullKillRowProps> = ({ killDetails, systemNam
const attackerSubscript = getAttackerSubscript(killDetails); const attackerSubscript = getAttackerSubscript(killDetails);
return ( return (
<div <div className={clsx(classes.killRowContainer, 'h-18 w-full justify-between items-start text-sm py-[4px]')}>
className={clsx( <div className="flex items-start gap-1 min-w-0 h-full">
classes.killRowContainer,
'h-16 w-full justify-between items-start bg-stone-900 hover:bg-stone-800 text-sm',
'border border-stone-800 rounded-[4px]',
)}
>
<div className="flex items-start gap-2 pl-1 min-w-0 pt-1 h-full">
{victimShipUrl && ( {victimShipUrl && (
<div className="relative shrink-0 w-14 h-14 overflow-hidden"> <div className="relative shrink-0 w-14 h-14 overflow-hidden">
<a <a
@@ -111,7 +105,7 @@ export const FullKillRow: React.FC<FullKillRowProps> = ({ killDetails, systemNam
</div> </div>
</div> </div>
<div className="flex items-start gap-2 pr-1 pt-1 min-w-0 h-full"> <div className="flex items-start gap-2 min-w-0 h-full">
<div className="flex flex-col items-end leading-4 min-w-0 overflow-hidden text-right"> <div className="flex flex-col items-end leading-4 min-w-0 overflow-hidden text-right">
{!attackerIsNpc && ( {!attackerIsNpc && (
<div className="truncate font-semibold"> <div className="truncate font-semibold">

View File

@@ -27,7 +27,7 @@ export const KillRowSubInfo: React.FC<KillRowSubInfoProps> = ({
} }
return ( return (
<div className="flex items-start gap-2 h-full"> <div className="flex items-start gap-1 h-full">
{victimPortraitUrl && victimCharacterId && ( {victimPortraitUrl && victimCharacterId && (
<a <a
href={zkillLink('character', victimCharacterId)} href={zkillLink('character', victimCharacterId)}
@@ -42,13 +42,13 @@ export const KillRowSubInfo: React.FC<KillRowSubInfoProps> = ({
/> />
</a> </a>
)} )}
<div className="flex flex-col h-full"> <div className="flex flex-col h-full justify-between">
{victimCorpLogoUrl && victimCorpId && ( {victimCorpLogoUrl && victimCorpId && (
<a <a
href={zkillLink('corporation', victimCorpId)} href={zkillLink('corporation', victimCorpId)}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="shrink-0 h-1/2" className="shrink-0 h-[26px]"
> >
<img <img
src={victimCorpLogoUrl} src={victimCorpLogoUrl}
@@ -62,7 +62,7 @@ export const KillRowSubInfo: React.FC<KillRowSubInfoProps> = ({
href={zkillLink('alliance', victimAllianceId)} href={zkillLink('alliance', victimAllianceId)}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="shrink-0 h-1/2" className="shrink-0 h-[26px]"
> >
<img <img
src={victimAllianceLogoUrl} src={victimAllianceLogoUrl}

View File

@@ -1,5 +1,11 @@
.killRowContainer { .killRowContainer {
@apply flex items-center border-b border-stone-700 whitespace-nowrap overflow-hidden; @apply flex items-center whitespace-nowrap overflow-hidden;
&:not(:last-child) {
@apply border-b border-stone-800;
}
@apply bg-transparent transition-all hover:bg-stone-900 hover:border-stone-700;
} }
.killRowImage { .killRowImage {