Mirroring/tailblocks
1
0
Fork 0
mirror of https://github.com/mertJF/tailblocks.git synced 2025-12-08 17:03:24 +00:00
Code Issues Projects Releases Wiki Activity

addressed form labels feedback

Browse Source
This commit is contained in:
saini-g
2020-05-29 23:30:44 +05:30
parent 4ddcd09b6c
commit c4a2bcff9b
26 changed files with 158 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/blocks/contact/dark/a.js
View File

@@ -25,10 +25,10 @@ function DarkContactA(props) {
<p className="leading-relaxed mb-5 text-gray-500"> <p className="leading-relaxed mb-5 text-gray-500">
Post-ironic portland shabby chic echo park, banjo fashion axe Post-ironic portland shabby chic echo park, banjo fashion axe
</p> </p>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Email Email
</label> </label>
@@ -36,20 +36,20 @@ function DarkContactA(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="message" htmlFor="message"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

24
src/blocks/contact/dark/b.js
View File

@@ -49,10 +49,10 @@ function DarkContactB(props) {
<p className="leading-relaxed mb-5 text-gray-600"> <p className="leading-relaxed mb-5 text-gray-600">
Post-ironic portland shabby chic echo park, banjo fashion axe Post-ironic portland shabby chic echo park, banjo fashion axe
</p> </p>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="name" htmlFor="name"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Name Name
</label> </label>
@@ -60,13 +60,13 @@ function DarkContactB(props) {
type="text" type="text"
id="name" id="name"
name="name" name="name"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Email Email
</label> </label>
@@ -74,20 +74,20 @@ function DarkContactB(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="message" htmlFor="message"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

24
src/blocks/contact/dark/c.js
View File

@@ -17,10 +17,10 @@ function DarkContactC(props) {
<div className="lg:w-1/2 md:w-2/3 mx-auto"> <div className="lg:w-1/2 md:w-2/3 mx-auto">
<div className="flex flex-wrap -m-2"> <div className="flex flex-wrap -m-2">
<div className="p-2 w-1/2"> <div className="p-2 w-1/2">
<div class="relative"> <div className="relative">
<label <label
for="name" htmlFor="name"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Name Name
</label> </label>
@@ -28,15 +28,15 @@ function DarkContactC(props) {
type="text" type="text"
id="name" id="name"
name="name" name="name"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
</div> </div>
<div className="p-2 w-1/2"> <div className="p-2 w-1/2">
<div class="relative"> <div className="relative">
<label <label
for="email" htmlFor="email"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Email Email
</label> </label>
@@ -44,22 +44,22 @@ function DarkContactC(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
</div> </div>
<div className="p-2 w-full"> <div className="p-2 w-full">
<div class="relative"> <div className="relative">
<label <label
for="message" htmlFor="message"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-100 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
</div> </div>

18
src/blocks/contact/light/a.js
View File

@@ -25,31 +25,31 @@ function LightContactA(props) {
<p className="leading-relaxed mb-5 text-gray-600"> <p className="leading-relaxed mb-5 text-gray-600">
Post-ironic portland shabby chic echo park, banjo fashion axe Post-ironic portland shabby chic echo park, banjo fashion axe
</p> </p>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7text-sm text-gray-600"
> >
Email Email Post-ironic portland shabby chic echo park, banjo fashion axe Post-ironic portland shabby chic echo park, banjo fashion axe
</label> </label>
<input <input
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="message" htmlFor="message"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

24
src/blocks/contact/light/b.js
View File

@@ -49,10 +49,10 @@ function LightContactB(props) {
<p className="leading-relaxed mb-5 text-gray-600"> <p className="leading-relaxed mb-5 text-gray-600">
Post-ironic portland shabby chic echo park, banjo fashion axe Post-ironic portland shabby chic echo park, banjo fashion axe
</p> </p>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="name" htmlFor="name"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Name Name
</label> </label>
@@ -60,13 +60,13 @@ function LightContactB(props) {
type="text" type="text"
id="name" id="name"
name="name" name="name"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Email Email
</label> </label>
@@ -74,20 +74,20 @@ function LightContactB(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="message" htmlFor="message"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

24
src/blocks/contact/light/c.js
View File

@@ -17,10 +17,10 @@ function LightContactC(props) {
<div className="lg:w-1/2 md:w-2/3 mx-auto"> <div className="lg:w-1/2 md:w-2/3 mx-auto">
<div className="flex flex-wrap -m-2"> <div className="flex flex-wrap -m-2">
<div className="p-2 w-1/2"> <div className="p-2 w-1/2">
<div class="relative"> <div className="relative">
<label <label
for="name" htmlFor="name"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Name Name
</label> </label>
@@ -28,15 +28,15 @@ function LightContactC(props) {
type="text" type="text"
id="name" id="name"
name="name" name="name"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
</div> </div>
<div className="p-2 w-1/2"> <div className="p-2 w-1/2">
<div class="relative"> <div className="relative">
<label <label
for="email" htmlFor="email"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Email Email
</label> </label>
@@ -44,22 +44,22 @@ function LightContactC(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
</div> </div>
<div className="p-2 w-full"> <div className="p-2 w-full">
<div class="relative"> <div className="relative">
<label <label
for="message" htmlFor="message"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Message Message
</label> </label>
<textarea <textarea
id="message" id="message"
name="message" name="message"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 pt-6 pb-1 px-3 resize-none leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 h-32 text-base outline-none text-gray-700 py-1 px-3 resize-none leading-6 transition-colors duration-200 ease-in-out`}
></textarea> ></textarea>
</div> </div>
</div> </div>

16
src/blocks/cta/dark/b.js
View File

@@ -18,10 +18,10 @@ function DarkCTAB(props) {
<h2 className="text-white text-lg font-medium title-font mb-5"> <h2 className="text-white text-lg font-medium title-font mb-5">
Sign Up Sign Up
</h2> </h2>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="full-name" htmlFor="full-name"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Full Name Full Name
</label> </label>
@@ -29,13 +29,13 @@ function DarkCTAB(props) {
type="text" type="text"
id="full-name" id="full-name"
name="full-name" name="full-name"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-700 rounded border border-gray-600 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Email Email
</label> </label>
@@ -43,7 +43,7 @@ function DarkCTAB(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-700 rounded border border-gray-600 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

18
src/blocks/cta/dark/c.js
View File

@@ -15,11 +15,11 @@ function DarkCTAC(props) {
haven&apos;t heard of them man bun deep. haven&apos;t heard of them man bun deep.
</p> </p>
</div> </div>
<div className="flex lg:w-2/3 w-full sm:flex-row flex-col mx-auto px-8 sm:px-0 items-center"> <div className="flex lg:w-2/3 w-full sm:flex-row flex-col mx-auto px-8 sm:px-0 items-end">
<div class="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full"> <div className="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full">
<label <label
for="full-name" htmlFor="full-name"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Full Name Full Name
</label> </label>
@@ -27,13 +27,13 @@ function DarkCTAC(props) {
type="text" type="text"
id="full-name" id="full-name"
name="full-name" name="full-name"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full"> <div className="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full">
<label <label
for="email" htmlFor="email"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Email Email
</label> </label>
@@ -41,7 +41,7 @@ function DarkCTAC(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

16
src/blocks/cta/light/b.js
View File

@@ -18,10 +18,10 @@ function LightCTAB(props) {
<h2 className="text-gray-900 text-lg font-medium title-font mb-5"> <h2 className="text-gray-900 text-lg font-medium title-font mb-5">
Sign Up Sign Up
</h2> </h2>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="full-name" htmlFor="full-name"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Full Name Full Name
</label> </label>
@@ -29,13 +29,13 @@ function LightCTAB(props) {
type="text" type="text"
id="full-name" id="full-name"
name="full-name" name="full-name"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative mb-4"> <div className="relative mb-4">
<label <label
for="email" htmlFor="email"
class="bg-white rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Email Email
</label> </label>
@@ -43,7 +43,7 @@ function LightCTAB(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-white rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

18
src/blocks/cta/light/c.js
View File

@@ -15,11 +15,11 @@ function LightCTAC(props) {
haven&apos;t heard of them man bun deep. haven&apos;t heard of them man bun deep.
</p> </p>
</div> </div>
<div className="flex lg:w-2/3 w-full sm:flex-row flex-col mx-auto px-8 sm:px-0 items-center"> <div className="flex lg:w-2/3 w-full sm:flex-row flex-col mx-auto px-8 sm:px-0 items-end">
<div class="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full"> <div className="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full">
<label <label
for="full-name" htmlFor="full-name"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Full Name Full Name
</label> </label>
@@ -27,13 +27,13 @@ function LightCTAC(props) {
type="text" type="text"
id="full-name" id="full-name"
name="full-name" name="full-name"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<div class="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full"> <div className="relative sm:mr-4 mb-4 sm:mb-0 flex-grow w-full">
<label <label
for="email" htmlFor="email"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Email Email
</label> </label>
@@ -41,7 +41,7 @@ function LightCTAC(props) {
type="email" type="email"
id="email" id="email"
name="email" name="email"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`text-white bg-${props.theme}-500 border-0 py-2 px-8 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

10
src/blocks/footer/dark/c.js
View File

@@ -124,11 +124,11 @@ function DarkFooterC(props) {
</div> </div>
<div className="border-t border-gray-800"> <div className="border-t border-gray-800">
<div className="container px-5 py-8 flex flex-wrap mx-auto items-center"> <div className="container px-5 py-8 flex flex-wrap mx-auto items-center">
<div className="flex md:flex-no-wrap flex-wrap justify-center items-center md:justify-start"> <div className="flex md:flex-no-wrap flex-wrap justify-center items-end md:justify-start">
<div class="relative sm:w-64 w-40 sm:mr-4 mr-2"> <div className="relative sm:w-64 w-40 sm:mr-4 mr-2">
<label <label
for="footer-field" htmlFor="footer-field"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Placeholder Placeholder
</label> </label>
@@ -136,7 +136,7 @@ function DarkFooterC(props) {
type="text" type="text"
id="footer-field" id="footer-field"
name="footer-field" name="footer-field"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}>

2
src/blocks/footer/dark/d.js
View File

@@ -18,7 +18,7 @@ function DarkFooterD(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<p className="text-sm text-gray-600 sm:ml-4 sm:pl-4 sm:border-l-2 sm:border-gray-800 sm:py-2 sm:mt-0 mt-4"> <p className="text-sm text-gray-600 sm:ml-4 sm:pl-4 sm:border-l-2 sm:border-gray-800 sm:py-2 sm:mt-0 mt-4">
© 2020 madde — © 2020 madde —

12
src/blocks/footer/dark/e.js
View File

@@ -67,11 +67,11 @@ function DarkFooterE(props) {
<h2 className="title-font font-medium text-white tracking-widest text-sm mb-3"> <h2 className="title-font font-medium text-white tracking-widest text-sm mb-3">
SUBSCRIBE SUBSCRIBE
</h2> </h2>
<div className="flex xl:flex-no-wrap md:flex-no-wrap lg:flex-wrap flex-wrap justify-center items-center md:justify-start"> <div className="flex xl:flex-no-wrap md:flex-no-wrap lg:flex-wrap flex-wrap justify-center items-end md:justify-start">
<div class="relative w-40 sm:w-auto xl:mr-4 lg:mr-0 sm:mr-4 mr-2"> <div className="relative w-40 sm:w-auto xl:mr-4 lg:mr-0 sm:mr-4 mr-2">
<label <label
for="footer-field" htmlFor="footer-field"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Placeholder Placeholder
</label> </label>
@@ -79,7 +79,7 @@ function DarkFooterE(props) {
type="text" type="text"
id="footer-field" id="footer-field"
name="footer-field" name="footer-field"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`lg:mt-2 xl:mt-0 flex-shrink-0 inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}> <button className={`lg:mt-2 xl:mt-0 flex-shrink-0 inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}>
@@ -108,7 +108,7 @@ function DarkFooterE(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<p className="text-sm text-gray-600 sm:ml-6 sm:mt-0 mt-4"> <p className="text-sm text-gray-600 sm:ml-6 sm:mt-0 mt-4">
© 2020 madde — © 2020 madde —

10
src/blocks/footer/light/c.js
View File

@@ -124,11 +124,11 @@ function LightFooterC(props) {
</div> </div>
<div className="border-t border-gray-200"> <div className="border-t border-gray-200">
<div className="container px-5 py-8 flex flex-wrap mx-auto items-center"> <div className="container px-5 py-8 flex flex-wrap mx-auto items-center">
<div className="flex md:flex-no-wrap flex-wrap justify-center items-center md:justify-start"> <div className="flex md:flex-no-wrap flex-wrap justify-center items-end md:justify-start">
<div class="relative sm:w-64 w-40 sm:mr-4 mr-2"> <div className="relative sm:w-64 w-40 sm:mr-4 mr-2">
<label <label
for="footer-field" htmlFor="footer-field"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Placeholder Placeholder
</label> </label>
@@ -136,7 +136,7 @@ function LightFooterC(props) {
type="text" type="text"
id="footer-field" id="footer-field"
name="footer-field" name="footer-field"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}>

2
src/blocks/footer/light/d.js
View File

@@ -18,7 +18,7 @@ function LightFooterD(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<p className="text-sm text-gray-500 sm:ml-4 sm:pl-4 sm:border-l-2 sm:border-gray-200 sm:py-2 sm:mt-0 mt-4"> <p className="text-sm text-gray-500 sm:ml-4 sm:pl-4 sm:border-l-2 sm:border-gray-200 sm:py-2 sm:mt-0 mt-4">
© 2020 madde — © 2020 madde —

12
src/blocks/footer/light/e.js
View File

@@ -67,11 +67,11 @@ function LightFooterE(props) {
<h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3"> <h2 className="title-font font-medium text-gray-900 tracking-widest text-sm mb-3">
SUBSCRIBE SUBSCRIBE
</h2> </h2>
<div className="flex xl:flex-no-wrap md:flex-no-wrap lg:flex-wrap flex-wrap justify-center items-center md:justify-start"> <div className="flex xl:flex-no-wrap md:flex-no-wrap lg:flex-wrap flex-wrap justify-center items-end md:justify-start">
<div class="relative w-40 sm:w-auto xl:mr-4 lg:mr-0 sm:mr-4 mr-2"> <div className="relative w-40 sm:w-auto xl:mr-4 lg:mr-0 sm:mr-4 mr-2">
<label <label
for="footer-field" htmlFor="footer-field"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Placeholder Placeholder
</label> </label>
@@ -79,7 +79,7 @@ function LightFooterE(props) {
type="text" type="text"
id="footer-field" id="footer-field"
name="footer-field" name="footer-field"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`lg:mt-2 xl:mt-0 flex-shrink-0 inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}> <button className={`lg:mt-2 xl:mt-0 flex-shrink-0 inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded`}>
@@ -108,7 +108,7 @@ function LightFooterE(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<p className="text-sm text-gray-500 sm:ml-6 sm:mt-0 mt-4"> <p className="text-sm text-gray-500 sm:ml-6 sm:mt-0 mt-4">
© 2020 madde — © 2020 madde —

2
src/blocks/header/dark/d.js
View File

@@ -18,7 +18,7 @@ function DarkHeaderD(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<nav className="md:ml-auto md:mr-auto flex flex-wrap items-center text-base justify-center"> <nav className="md:ml-auto md:mr-auto flex flex-wrap items-center text-base justify-center">
<a href className="mr-5 hover:text-white">First Link</a> <a href className="mr-5 hover:text-white">First Link</a>

2
src/blocks/header/light/a.js
View File

@@ -18,7 +18,7 @@ function LightHeaderA(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<nav className="md:ml-auto flex flex-wrap items-center text-base justify-center"> <nav className="md:ml-auto flex flex-wrap items-center text-base justify-center">
<a href className="mr-5 hover:text-gray-900">First Link</a> <a href className="mr-5 hover:text-gray-900">First Link</a>

2
src/blocks/header/light/b.js
View File

@@ -18,7 +18,7 @@ function LightHeaderB(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<nav className="md:mr-auto md:ml-4 md:py-1 md:pl-4 md:border-l md:border-gray-400 flex flex-wrap items-center text-base justify-center"> <nav className="md:mr-auto md:ml-4 md:py-1 md:pl-4 md:border-l md:border-gray-400 flex flex-wrap items-center text-base justify-center">
<a href className="mr-5 hover:text-gray-900">First Link</a> <a href className="mr-5 hover:text-gray-900">First Link</a>

2
src/blocks/header/light/c.js
View File

@@ -24,7 +24,7 @@ function LightHeaderC(props) {
> >
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" /> <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
</svg> </svg>
<span class="ml-3 text-xl">madde</span> <span className="ml-3 text-xl">madde</span>
</a> </a>
<div className="lg:w-2/5 inline-flex lg:justify-end ml-5 lg:ml-0"> <div className="lg:w-2/5 inline-flex lg:justify-end ml-5 lg:ml-0">
<button className="inline-flex items-center bg-gray-200 border-0 py-1 px-3 focus:outline-none hover:bg-gray-300 rounded text-base mt-4 md:mt-0"> <button className="inline-flex items-center bg-gray-200 border-0 py-1 px-3 focus:outline-none hover:bg-gray-300 rounded text-base mt-4 md:mt-0">

10
src/blocks/hero/dark/d.js
View File

@@ -13,11 +13,11 @@ function DarkHeroD(props) {
Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid
swag typewriter affogato, hella selvage wolf narwhal dreamcatcher. swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.
</p> </p>
<div className="flex w-full md:justify-start justify-center items-center"> <div className="flex w-full md:justify-start justify-center items-end">
<div class="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4"> <div className="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Placeholder Placeholder
</label> </label>
@@ -25,7 +25,7 @@ function DarkHeroD(props) {
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

10
src/blocks/hero/dark/e.js
View File

@@ -16,11 +16,11 @@ function DarkHeroE(props) {
Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid
swag typewriter affogato, hella selvage wolf narwhal dreamcatcher. swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.
</p> </p>
<div className="flex w-full md:justify-start justify-center items-center"> <div className="flex w-full md:justify-start justify-center items-end">
<div class="relative mr-4 lg:w-full xl:w-1/2 w-2/4"> <div className="relative mr-4 lg:w-full xl:w-1/2 w-2/4">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Placeholder Placeholder
</label> </label>
@@ -28,7 +28,7 @@ function DarkHeroE(props) {
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

10
src/blocks/hero/dark/f.js
View File

@@ -15,11 +15,11 @@ function DarkHeroF(props) {
live-edge tumeric scenester copper mug flexitarian. Prism vice offal live-edge tumeric scenester copper mug flexitarian. Prism vice offal
plaid everyday carry. Gluten-free chia VHS squid listicle artisan. plaid everyday carry. Gluten-free chia VHS squid listicle artisan.
</p> </p>
<div className="flex w-full justify-center items-center"> <div className="flex w-full justify-center items-end">
<div class="relative mr-4 lg:w-full xl:w-1/2 w-2/4 md:w-full"> <div className="relative mr-4 lg:w-full xl:w-1/2 w-2/4 md:w-full text-left">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-800 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-400" className="leading-7 text-sm text-gray-400"
> >
Placeholder Placeholder
</label> </label>
@@ -27,7 +27,7 @@ function DarkHeroF(props) {
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-800 rounded border border-gray-700 focus:border-${props.theme}-500 text-base outline-none text-gray-100 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

10
src/blocks/hero/light/d.js
View File

@@ -13,11 +13,11 @@ function LightHeroD(props) {
Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid
swag typewriter affogato, hella selvage wolf narwhal dreamcatcher. swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.
</p> </p>
<div className="flex w-full md:justify-start justify-center"> <div className="flex w-full md:justify-start justify-center items-end">
<div class="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4"> <div className="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Placeholder Placeholder
</label> </label>
@@ -25,7 +25,7 @@ function LightHeroD(props) {
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

10
src/blocks/hero/light/e.js
View File

@@ -16,11 +16,11 @@ function LightHeroE(props) {
Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid
swag typewriter affogato, hella selvage wolf narwhal dreamcatcher. swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.
</p> </p>
<div className="flex w-full md:justify-start justify-center items-center"> <div className="flex w-full md:justify-start justify-center items-end">
<div class="relative mr-4 lg:w-full xl:w-1/2 w-2/4"> <div className="relative mr-4 lg:w-full xl:w-1/2 w-2/4">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Placeholder Placeholder
</label> </label>
@@ -28,7 +28,7 @@ function LightHeroE(props) {
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>

12
src/blocks/hero/light/f.js
View File

@@ -15,19 +15,19 @@ function LightHeroF(props) {
live-edge tumeric scenester copper mug flexitarian. Prism vice offal live-edge tumeric scenester copper mug flexitarian. Prism vice offal
plaid everyday carry. Gluten-free chia VHS squid listicle artisan. plaid everyday carry. Gluten-free chia VHS squid listicle artisan.
</p> </p>
<div className="flex w-full justify-center items-center"> <div className="flex w-full justify-center items-end">
<div class="relative mr-4 lg:w-full xl:w-1/2 w-2/4 md:w-full"> <div className="relative mr-4 lg:w-full xl:w-1/2 w-2/4 md:w-full text-left">
<label <label
for="hero-field" htmlFor="hero-field"
class="bg-gray-100 rounded leading-7 px-3 absolute ml-px mt-px left-0 top-0 text-sm text-gray-600" className="leading-7 text-sm text-gray-600"
> >
Placeholder Placeholder 1
</label> </label>
<input <input
type="text" type="text"
id="hero-field" id="hero-field"
name="hero-field" name="hero-field"
class={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 pt-6 pb-1 px-3 leading-8 transition-colors duration-200 ease-in-out`} className={`w-full bg-gray-100 rounded border border-gray-300 focus:border-${props.theme}-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out`}
/> />
</div> </div>
<button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}> <button className={`inline-flex text-white bg-${props.theme}-500 border-0 py-2 px-6 focus:outline-none hover:bg-${props.theme}-600 rounded text-lg`}>