Fixed img css
This commit is contained in:
parent
7006f071a9
commit
2fc2eec9e1
1
src/env.d.ts
vendored
Normal file
1
src/env.d.ts
vendored
Normal file
@ -0,0 +1 @@
|
||||
/// <reference types="astro/client" />
|
@ -9,7 +9,7 @@ const permalink = `${Astro.site.href}about`;
|
||||
<BaseLayout title={title} description={description} permalink={permalink} current="about">
|
||||
<div class="container">
|
||||
<h1>About</h1>
|
||||
<figure>
|
||||
<figure class="about-image">
|
||||
<img src="/assets/about-illustration.webp" alt="Illustration of a notebook">
|
||||
<figcaption>
|
||||
Illustration by
|
||||
@ -28,19 +28,19 @@ const permalink = `${Astro.site.href}about`;
|
||||
</BaseLayout>
|
||||
|
||||
<style>
|
||||
figure {
|
||||
.about-image {
|
||||
float: right;
|
||||
margin: -3em -7em 2em 2em;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
figure img {
|
||||
.about-image img {
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
@media (max-width: 1020px) {
|
||||
figure {
|
||||
.about-image {
|
||||
float: none;
|
||||
margin: 0 auto 2em;
|
||||
}
|
||||
|
@ -14,7 +14,7 @@ const permalink = Astro.site.href;
|
||||
</div>
|
||||
|
||||
<figure>
|
||||
<img alt='Illustration of person reading a book' src='/assets/home-illustration.webp'>
|
||||
<img class="hero-image" alt="Illustration of person reading a book" src="/assets/home-illustration.webp" width="550">
|
||||
<figcaption>
|
||||
Illustration by
|
||||
<a href="https://icons8.com/illustrations/author/5c07e68d82bcbc0092519bb6" target="_blank" rel="noopener">Icons 8</a>
|
||||
@ -60,7 +60,7 @@ const permalink = Astro.site.href;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
img {
|
||||
.hero-image {
|
||||
width: 100%;
|
||||
max-width: 550px;
|
||||
margin-bottom: 1em;
|
||||
@ -71,7 +71,7 @@ const permalink = Astro.site.href;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
img {
|
||||
.hero-image {
|
||||
max-width: 400px;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user