-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
8 enable showing meetup description as rich content (#32)
* added remark plugin * Revert "added remark plugin" This reverts commit a815b71. * added tailwinds class that applied tailwind styling * renamed logos to support adding in code. tuned test meetup. * found way to overwrite tailwind styling (way too much margin) * added heroimages. tuned meetups own page. * top styling for meetu page layout * aling top margins * added placeholder text in meetup form textarea. * had to add prettierignore cause it wants to format textarea so that placeholder wont show * scratch the ignore file, just ignore that textarea
- Loading branch information
Showing
17 changed files
with
148 additions
and
96 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,94 +1,128 @@ | ||
--- | ||
const meetupProps = Astro.props; | ||
const { location, locationLink, time, organizer, organizerLink, meetupLink } = | ||
meetupProps.meetup.data; | ||
const { | ||
location, | ||
locationLink, | ||
time, | ||
organizer, | ||
organizerLink, | ||
meetupLink, | ||
image, | ||
} = meetupProps.meetup.data; | ||
const heroImage = image ? image : 'images/heroimages/1-meetup-image.jpg'; | ||
const { Content } = await meetupProps.meetup.render(); | ||
--- | ||
|
||
<div class="m-auto max-w-7xl overflow-hidden bg-white shadow sm:rounded-lg"> | ||
<!--card header --> | ||
<div class="border-b border-gray-200 bg-sky-100 px-4 py-5 sm:px-6"> | ||
<div | ||
class="-ml-4 -mt-4 flex flex-wrap items-center justify-between sm:flex-nowrap" | ||
> | ||
<div class="ml-4 mt-4"> | ||
<div class="flex items-center"> | ||
<div class="flex-shrink-0"> | ||
<img | ||
class="h-12 w-12 rounded-full" | ||
src={`${import.meta.env.BASE_URL}images/dev-logo.jpg`} | ||
alt="developer logo" | ||
/> | ||
<div class="mx-auto flex max-w-7xl flex-col sm:px-6 lg:px-8"> | ||
<div class="container mb-8"> | ||
<div class="mx-auto max-w-7xl sm:px-6 lg:px-8"> | ||
<div class="relative shadow-xl sm:rounded-2xl"> | ||
<div class=""> | ||
<img | ||
class="sm:rounded-2xl" | ||
width={1200} | ||
height={600} | ||
src={`${import.meta.env.BASE_URL}${heroImage}`} | ||
alt="artistic picture Oulu meetup" | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="m-auto max-w-7xl overflow-hidden bg-white shadow"> | ||
<div class="m-auto max-w-7xl overflow-hidden bg-white shadow"> | ||
<!--card header --> | ||
<div class="border-b border-gray-200 bg-sky-100 px-4 py-5 sm:px-6"> | ||
<div | ||
class="-ml-4 -mt-4 flex flex-wrap items-center justify-between sm:flex-nowrap" | ||
> | ||
<div class="ml-4 mt-4"> | ||
<div class="flex items-center"> | ||
<div class="flex-shrink-0"> | ||
<img | ||
class="h-12 w-12 rounded-full" | ||
src={`${ | ||
import.meta.env.BASE_URL | ||
}images//logos/1-meetup-logo.jpg`} | ||
alt="developer logo" | ||
/> | ||
</div> | ||
<div class="ml-4"> | ||
<h3 class="text-base font-semibold leading-6 text-gray-900"> | ||
Organized by | ||
</h3> | ||
<p class="text-sm text-gray-500"> | ||
<a href={organizerLink} target="_blank">{organizer}</a> | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="ml-4"> | ||
<h3 class="text-base font-semibold leading-6 text-gray-900"> | ||
Organized by | ||
</h3> | ||
<p class="text-sm text-gray-500"> | ||
<a href={organizerLink} target="_blank">{organizer}</a> | ||
</p> | ||
<div class="ml-4 mt-4 flex flex-shrink-0"> | ||
<button | ||
type="button" | ||
class="relative ml-3 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" | ||
> | ||
<svg | ||
class="-ml-0.5 mr-1.5 h-5 w-5 text-gray-400" | ||
viewBox="0 0 20 20" | ||
fill="currentColor" | ||
aria-hidden="true" | ||
> | ||
<path | ||
d="M3 4a2 2 0 00-2 2v1.161l8.441 4.221a1.25 1.25 0 001.118 0L19 7.162V6a2 2 0 00-2-2H3z" | ||
> | ||
</path> | ||
<path | ||
d="M19 8.839l-7.77 3.885a2.75 2.75 0 01-2.46 0L1 8.839V14a2 2 0 002 2h14a2 2 0 002-2V8.839z" | ||
> | ||
</path> | ||
</svg> | ||
<span>Sign up</span> | ||
</button> | ||
</div> | ||
</div> | ||
</div> | ||
<div class="ml-4 mt-4 flex flex-shrink-0"> | ||
<button | ||
type="button" | ||
class="relative ml-3 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" | ||
> | ||
<svg | ||
class="-ml-0.5 mr-1.5 h-5 w-5 text-gray-400" | ||
viewBox="0 0 20 20" | ||
fill="currentColor" | ||
aria-hidden="true" | ||
> | ||
<path | ||
d="M3 4a2 2 0 00-2 2v1.161l8.441 4.221a1.25 1.25 0 001.118 0L19 7.162V6a2 2 0 00-2-2H3z" | ||
<!--card body --> | ||
<div class="border-t border-gray-100"> | ||
<dl class="divide-y divide-gray-100"> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dd | ||
class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-3 sm:mt-0" | ||
> | ||
<article class="prose"><Content /></article> | ||
</dd> | ||
</div> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">When</dt> | ||
<dd | ||
class="mt-1 font-semibold leading-6 text-gray-700 sm:col-span-2 sm:mt-0" | ||
> | ||
</path> | ||
<path | ||
d="M19 8.839l-7.77 3.885a2.75 2.75 0 01-2.46 0L1 8.839V14a2 2 0 002 2h14a2 2 0 002-2V8.839z" | ||
{time} | ||
</dd> | ||
</div> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">Where</dt> | ||
<dd | ||
class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0" | ||
> | ||
<a href={locationLink} target="_blank">{location}</a> | ||
</dd> | ||
</div> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">Sign up link</dt> | ||
<dd | ||
class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0" | ||
> | ||
</path> | ||
</svg> | ||
<span>Sign up</span> | ||
</button> | ||
<a href={meetupLink} target="_blank">{meetupLink}</a> | ||
</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
</div> | ||
</div> | ||
<!--card body --> | ||
<div class="border-t border-gray-100"> | ||
<dl class="divide-y divide-gray-100"> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">When</dt> | ||
<dd | ||
class="mt-1 font-semibold leading-6 text-gray-700 sm:col-span-2 sm:mt-0" | ||
> | ||
{time} | ||
</dd> | ||
</div> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">Where</dt> | ||
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0"> | ||
<a href={locationLink} target="_blank">{location}</a> | ||
</dd> | ||
</div> | ||
<div class="px-4 py-6 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"> | ||
<dt class="text-sm font-medium text-gray-900">Sign up link</dt> | ||
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0"> | ||
<a href={meetupLink} target="_blank">{meetupLink}</a> | ||
</dd> | ||
</div> | ||
<div | ||
class="px-4 py-6 text-center sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6" | ||
> | ||
<dt class="text-sm font-medium text-gray-900 sm:col-span-3"> | ||
Description | ||
</dt> | ||
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-3 sm:mt-0"> | ||
<article><Content /></article> | ||
</dd> | ||
</div> | ||
</dl> | ||
</div> | ||
</div> | ||
<style> | ||
:global(h2) { | ||
margin-top: 2rem !important; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters