snipette/snipette-crowdfunding-site
snipette/snipette-crowdfunding-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Adjust image styling so the aspect ratio isn't messed up

Browse source
This commit is contained in:
Hippo 2021-12-28 22:55:36 +05:30
parent ed182d4f20
commit faa1b2d132
1 changed files with 3 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/index.htm
View file

@ -54,7 +54,7 @@
<div class="max-w-4xl ml-auto p-10"> <div class="max-w-4xl ml-auto p-10">
<h1 class="text-4xl font-heading font-extrabold lowercase text-center">Who we are</h1> <h1 class="text-4xl font-heading font-extrabold lowercase text-center">Who we are</h1>
<div class="flex flex-wrap text-xl font-sans"> <div class="flex flex-wrap text-xl font-sans">
<img alt="Snipette puppies" src="img/three-pups.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3"/> <img alt="Snipette puppies" src="img/three-pups.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3 h-full"/>
<p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3"> <p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3">
We are a web and print magazine seeking to explain the world in an easy to understand way. Our key words are: understandability, perspective, and fun. We are a web and print magazine seeking to explain the world in an easy to understand way. Our key words are: understandability, perspective, and fun.
</p> </p>
@ -66,7 +66,7 @@
<div class="max-w-4xl ml-auto p-10"> <div class="max-w-4xl ml-auto p-10">
<h1 class="text-4xl font-heading font-extrabold lowercase text-center">What we do</h1> <h1 class="text-4xl font-heading font-extrabold lowercase text-center">What we do</h1>
<div class="flex flex-wrap flex-row md:flex-row-reverse text-xl font-sans"> <div class="flex flex-wrap flex-row md:flex-row-reverse text-xl font-sans">
<img alt="Puppy with a stack of magazines" src="img/stackpup.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3"/> <img alt="Puppy with a stack of magazines" src="img/stackpup.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3 h-full"/>
<p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3"> <p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3">
In order to make our content more accessible, we have been bringing out a print version, Snipette Analog, which is a better medium for long-form articles. <a href="#">Sample the latest issue here</a>. In order to make our content more accessible, we have been bringing out a print version, Snipette Analog, which is a better medium for long-form articles. <a href="#">Sample the latest issue here</a>.
</p> </p>
@ -78,7 +78,7 @@
<div class="max-w-4xl ml-auto p-10"> <div class="max-w-4xl ml-auto p-10">
<h1 class="text-4xl font-heading font-extrabold lowercase text-center">Our problem</h1> <h1 class="text-4xl font-heading font-extrabold lowercase text-center">Our problem</h1>
<div class="flex flex-wrap text-xl font-sans"> <div class="flex flex-wrap text-xl font-sans">
<img alt="People wanting money and money wanting people" src="img/catch-twenty-two.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3"/> <img alt="People wanting money and money wanting people" src="img/catch-twenty-two.png" class="p-5 sm:w-full md:w-1/2 lg:w-1/3 h-full"/>
<p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3"> <p class="md:p-5 sm:w-full md:w-1/2 lg:w-2/3">
Digital printing is expensive. Offset printing is more cost-effective, but it only works at scale—1000 copies or more. So we can't bring down costs till we got more subscribers, but we won't get more subscribers till we bring down costs. <a href="https://en.wiktionary.org/wiki/Catch-22" target="_blank">Catch-22</a>. Digital printing is expensive. Offset printing is more cost-effective, but it only works at scale—1000 copies or more. So we can't bring down costs till we got more subscribers, but we won't get more subscribers till we bring down costs. <a href="https://en.wiktionary.org/wiki/Catch-22" target="_blank">Catch-22</a>.
</p> </p>