Responsivity improvements

This commit is contained in:
Samuel Štancl 2019-10-11 17:49:50 +02:00
parent 26b1c004f0
commit 6ab333d289

27
dist/index.html vendored
View file

@ -29,7 +29,7 @@
</svg> </svg>
</div> </div>
</div> </div>
<div class="p-8 xl:py-20 xl:px-40 flex flex-wrap xl:absolute top-0 left-0"> <div class="p-6 xl:py-20 xl:px-40 flex flex-wrap xl:absolute top-0 left-0">
<div class="w-full xl:w-1/2 leading-relaxed"> <div class="w-full xl:w-1/2 leading-relaxed">
<h1 class="text-indigo-100 text-5xl xl:text-6xl font-bold">Automatic tenancy for your Laravel app</h1> <h1 class="text-indigo-100 text-5xl xl:text-6xl font-bold">Automatic tenancy for your Laravel app</h1>
<h2 class="mt-4 text-4xl xl:text-5xl font-thin text-indigo-200">No code changes required.</h2> <h2 class="mt-4 text-4xl xl:text-5xl font-thin text-indigo-200">No code changes required.</h2>
@ -75,7 +75,7 @@ dispatch(new SendOrderCreatedMail);
<div class="flex flex-col xl:flex-row justify-between mx-auto mt-24"> <div class="flex flex-col xl:flex-row justify-between mx-auto mt-24">
<div class="xl:w-1/3 w-full"> <div class="xl:w-1/3 w-full">
<div class="bg-white py-6 px-12 h-full rounded-15 text-xl flex flex-col justify-between shadow-card"> <div class="bg-white py-6 px-6 xl:px-12 h-full rounded-15 text-xl flex flex-col justify-between shadow-card">
<div> <div>
<h3 class="font-bold text-3xl text-center my-1">Easy Installation</h3> <h3 class="font-bold text-3xl text-center my-1">Easy Installation</h3>
<p class="mt-5">Two commands is all you need to get started.</p> <p class="mt-5">Two commands is all you need to get started.</p>
@ -103,7 +103,7 @@ php artisan tenancy:install
<p class="mt-5">Multi-tenancy is something that can be handled in the background.</p> <p class="mt-5">Multi-tenancy is something that can be handled in the background.</p>
<p class="mt-5">Why should your code be <em>polluted</em> with tons of tenancy-related things? <p class="mt-5">Why should your code be <em>polluted</em> with tons of tenancy-related things?
</p> </p>
<p class="mt-5">Why have your code <em>bound</em> to a specific implementation? Handling things in the <p class="mt-5">Handling tenancy in the
background gives you the flexibility to change how tenancy works for your project without pain. background gives you the flexibility to change how tenancy works for your project without pain.
</p> </p>
</div> </div>
@ -119,13 +119,14 @@ php artisan tenancy:install
</div> </div>
<div class="mt-6 xl:mt-0 xl:ml-24 xl:w-1/3 w-full"> <div class="mt-6 xl:mt-0 xl:ml-24 xl:w-1/3 w-full">
<div <div
class="bg-white py-6 px-12 h-full rounded-15 text-xl flex flex-col justify-between shadow-card"> class="bg-white py-6 px-6 xl:px-12 h-full rounded-15 text-xl flex flex-col justify-between
shadow-card">
<div> <div>
<h3 class="font-bold text-3xl text-center my-1">Awesome Integration</h3> <h3 class="font-bold text-3xl text-center my-1">Awesome Integration</h3>
<p class="mt-5">By switching things in the background, the package doesnt stand in your way. <p class="mt-5">By switching things in the background, the package doesnt stand in your way.
</p> </p>
<p class="mt-5">You can integrate with just about any package.</p> <p class="mt-5">You can integrate with just about any package.</p>
<div class="flex h-full -mb-8 justify-between items-center mx-6"> <div class="flex h-full my-4 xl:mt-0 xl:-mb-8 justify-between items-center xl:mx-6">
<svg class="block w-12" title="Telescope" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"> <svg class="block w-12" title="Telescope" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80">
<path fill="#000" <path fill="#000"
d="M0 40a39.87 39.87 0 0 1 11.72-28.28A40 40 0 1 1 0 40zm34 10a4 4 0 0 1-4-4v-2a2 2 0 1 0-4 0v2a4 4 0 0 1-4 4h-2a2 2 0 1 0 0 4h2a4 4 0 0 1 4 4v2a2 2 0 1 0 4 0v-2a4 4 0 0 1 4-4h2a2 2 0 1 0 0-4h-2zm24-24a6 6 0 0 1-6-6v-3a3 3 0 0 0-6 0v3a6 6 0 0 1-6 6h-3a3 3 0 0 0 0 6h3a6 6 0 0 1 6 6v3a3 3 0 0 0 6 0v-3a6 6 0 0 1 6-6h3a3 3 0 0 0 0-6h-3zm-4 36a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM21 28a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"> d="M0 40a39.87 39.87 0 0 1 11.72-28.28A40 40 0 1 1 0 40zm34 10a4 4 0 0 1-4-4v-2a2 2 0 1 0-4 0v2a4 4 0 0 1-4 4h-2a2 2 0 1 0 0 4h2a4 4 0 0 1 4 4v2a2 2 0 1 0 4 0v-2a4 4 0 0 1 4-4h2a2 2 0 1 0 0-4h-2zm24-24a6 6 0 0 1-6-6v-3a3 3 0 0 0-6 0v3a6 6 0 0 1-6 6h-3a3 3 0 0 0 0 6h3a6 6 0 0 1 6 6v3a3 3 0 0 0 6 0v-3a6 6 0 0 1 6-6h3a3 3 0 0 0 0-6h-3zm-4 36a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM21 28a3 3 0 1 0 0-6 3 3 0 0 0 0 6z">
@ -173,7 +174,7 @@ php artisan tenancy:install
<p class="text-lg">Tenants' databases, caches, filesystems, queues and Redis stores are automatically separated. You can <p class="text-lg">Tenants' databases, caches, filesystems, queues and Redis stores are automatically separated. You can
write your app like you're used to and let the package worry about tenant data separation.</p> write your app like you're used to and let the package worry about tenant data separation.</p>
</div> </div>
<div class="w-full xl:w-1/2 flex justify-start ml-16"> <div class="w-full xl:w-1/2 flex justify-start xl:ml-16">
<pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap"> <pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap">
cache()->remember('total_revenue', function () { cache()->remember('total_revenue', function () {
return Order::with('products') return Order::with('products')
@ -186,7 +187,7 @@ cache()->remember('total_revenue', function () {
</div> </div>
<div class="w-full flex flex-col xl:flex-row items-center justify-center px-6 xl:px-64 py-6 bg-white mt-10"> <div class="w-full flex flex-col xl:flex-row items-center justify-center px-6 xl:px-64 py-6 bg-white mt-10">
<div class="w-full xl:w-1/2 flex justify-end mr-16"> <div class="w-full xl:w-1/2 flex justify-end xl:mr-16">
<pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap"> <pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap">
'redis' => [ 'redis' => [
'prefix_base' => 'tenant', 'prefix_base' => 'tenant',
@ -211,7 +212,7 @@ cache()->remember('total_revenue', function () {
back, as well as back, as well as
seeding tenant databases.</p> seeding tenant databases.</p>
</div> </div>
<div class="w-full xl:w-1/2 flex justify-start ml-16"> <div class="w-full xl:w-1/2 flex justify-start xl:ml-16">
<pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap"> <pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap">
$ artisan tenants:seed --tenants=8075a580-1cb8-11e9-8822-49c5d8f8ff23 $ artisan tenants:seed --tenants=8075a580-1cb8-11e9-8822-49c5d8f8ff23
Tenant: 8075a580-1cb8-11e9-8822-49c5d8f8ff23 (tenant1.localhost) Tenant: 8075a580-1cb8-11e9-8822-49c5d8f8ff23 (tenant1.localhost)
@ -221,7 +222,7 @@ Database seeding completed successfully.
</div> </div>
<div class="w-full flex flex-col xl:flex-row items-center justify-center px-6 xl:px-64 py-6 bg-white mt-10"> <div class="w-full flex flex-col xl:flex-row items-center justify-center px-6 xl:px-64 py-6 bg-white mt-10">
<div class="w-full xl:w-1/2 flex justify-end mr-16"> <div class="w-full xl:w-1/2 flex justify-end xl:mr-16">
<pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap"> <pre class="bg-indigo-900 leading-relaxed text-blue-300 rounded-15 py-6 px-8 inline-block w-full whitespace-pre-wrap">
class PostgreSQLDatabaseManager implements TenantDatabaseManager class PostgreSQLDatabaseManager implements TenantDatabaseManager
{ {
@ -238,7 +239,7 @@ class PostgreSQLDatabaseManager implements TenantDatabaseManager
(and contribute ❤️) your own Storage Drivers, Tenancy Bootstrappers, and Feature classes.</p> (and contribute ❤️) your own Storage Drivers, Tenancy Bootstrappers, and Feature classes.</p>
</div> </div>
</div> </div>
<div class="py-6 xl:p-16 flex justify-center"> <div class="py-6 xl:py-16 flex justify-center">
<div> <div>
<h2 class="text-4xl font-bold text-center">How it works</h2> <h2 class="text-4xl font-bold text-center">How it works</h2>
<ul class="text-xl leading-loose mt-4"> <ul class="text-xl leading-loose mt-4">
@ -285,8 +286,8 @@ class PostgreSQLDatabaseManager implements TenantDatabaseManager
</div> </div>
</div> </div>
</div> </div>
<div class="-m-3 xl:m-0 xl:p-24"> <div class="xl:p-24">
<div class="border-2 border-indigo-200 bg-blue-100 rounded-15 p-10 flex justify-center"> <div class="border-0 xl:border-2 border-indigo-200 bg-blue-100 rounded-15 p-10 flex justify-center">
<div class="text-xl"> <div class="text-xl">
<h2 class="text-3xl font-bold text-center">Stay Updated</h2> <h2 class="text-3xl font-bold text-center">Stay Updated</h2>
<p class="mt-4">If you'd like to be notified about new versions and related stuff, you can sign up for e-mail <p class="mt-4">If you'd like to be notified about new versions and related stuff, you can sign up for e-mail
@ -350,7 +351,7 @@ class PostgreSQLDatabaseManager implements TenantDatabaseManager
<h1 class="text-3xl text-center"><a class="border-b-2 border-gray-600 hover:border-gray-100" <h1 class="text-3xl text-center"><a class="border-b-2 border-gray-600 hover:border-gray-100"
href="https://github.com/stancl/tenancy">stancl/tenancy</a></h1> href="https://github.com/stancl/tenancy">stancl/tenancy</a></h1>
<ul class="flex flex-wrap justify-center lg:flex-row my-8"> <ul class="flex flex-wrap justify-center xl:flex-row my-8">
<li class="mx-2"><a class="github-button" href="https://github.com/stancl/tenancy" <li class="mx-2"><a class="github-button" href="https://github.com/stancl/tenancy"
data-icon="octicon-star" data-size="large" data-show-count="true" data-icon="octicon-star" data-size="large" data-show-count="true"
aria-label="Star stancl/tenancy on GitHub">Star</a></li> aria-label="Star stancl/tenancy on GitHub">Star</a></li>