phil/plcom
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

experience card: inline css for logo

Browse source
This commit is contained in:
Philippe Loctaux 2023-06-03 02:18:19 +02:00
parent 511710ee78
commit 7ecfb55a2d
1 changed files with 1 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/components/experience-card.astro
View file

@ -23,11 +23,6 @@ const {
image, image,
tech, tech,
} = Astro.props; } = Astro.props;
// Define how to display logo
const logoCss = `h-16 w-16 rounded-xl mr-4 ${
logoTransparentBackground === true ? "p-2 bg-white" : ""
}`;
--- ---
<div class={`${image ? `2xl:flex ${image.rightPosition ? "2xl:flex-row-reverse" : "" } items-stretch justify-between` : "" } w-full rounded-2xl ${backgroundColor}`}> <div class={`${image ? `2xl:flex ${image.rightPosition ? "2xl:flex-row-reverse" : "" } items-stretch justify-between` : "" } w-full rounded-2xl ${backgroundColor}`}>
@ -38,7 +33,7 @@ const logoCss = `h-16 w-16 rounded-xl mr-4 ${
<div class=`p-6 ${image ? "flex flex-col grow-0" : ""} justify-between h-full`> <div class=`p-6 ${image ? "flex flex-col grow-0" : ""} justify-between h-full`>
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex flex-row"> <div class="flex flex-row">
{logo && <img loading="lazy" src={logo} class={logoCss} />} {logo && <img loading="lazy" src={logo} class={`h-16 w-16 rounded-xl mr-4 ${logoTransparentBackground === true ? "p-2 bg-white" : ""}`} />}
<div class="flex flex-col justify-evenly"> <div class="flex flex-col justify-evenly">
<div class="text-xl md:text-2xl font-semibold">{name}</div> <div class="text-xl md:text-2xl font-semibold">{name}</div>
<div class="text-xs md:text-sm">{dates}</div> <div class="text-xs md:text-sm">{dates}</div>