phpmon/website
1
0
Fork 0
mirror of https://github.com/phpmon/website synced 2025-08-06 06:20:07 +02:00
Code Issues Packages Projects Releases Wiki Activity

Styling changes

Browse Source
This commit is contained in:
Nico Verbruggen
2022-09-14 14:15:02 +02:00
parent 97747da1e6
commit 1820e0c3ae
3 changed files with 22 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
resources/views/components/feature.blade.php
View File

@ -1,5 +1,5 @@
<div {{ $attributes->merge(['class' => "flex md:flex-row flex-col m-auto max-w-5xl py-8 gap-x-10"]) }}>
<div class="lg:w-1/2 w-full flex p-4 align-middle items-center">
<div {{ $attributes->merge(['class' => "flex md:flex-row flex-col m-auto max-w-5xl py-4 md:py-8 gap-x-10"]) }}>
<div class="lg:w-1/2 w-full flex py-4 md:px-4 align-middle items-center">
<div class="flex flex-col">
@isset ($title)
<h3 class="text-blue-800 font-bold mb-2 uppercase">{{ $title }}</h3>

2
resources/views/components/single-feature.blade.php
View File

@ -1,4 +1,4 @@
<div class="lg:w-1/2 w-full flex p-4 align-middle items-center">
<div class="lg:w-1/2 w-full flex py-4 md:px-4 align-middle items-center">
<div class="flex flex-col">
@isset ($title)
<h3 class="text-blue-800 font-bold mb-2 uppercase">{{ $title }}</h3>

29
resources/views/homepage.blade.php
View File

@ -32,7 +32,7 @@
{{-- Fathom --}}
<script src="https://net.phpmon.app/script.js" data-site="HVPVBSJR" defer></script>
</head>
<body class="font-sans">
<body class="font-sans antialiased">
<div>
<div class="bg-blue-50 flex">
<header class="flex flex-col m-auto max-w-xl py-5 md:py-8 lg:py-10 p-4">
@ -41,23 +41,32 @@
<h1 class="text-5xl font-bold mb-3 text-blue-800">
Monitor and manage<br/>your PHP installations<br/> <span class="text-black">with ease</span>.
</h1>
<p class="text-2xl leading-8 mt-8"><b>PHP Monitor</b> (“phpmon”) is a lightweight, native Mac menu bar app that interacts with <a href="https://github.com/laravel/valet" class="text-blue-800 underline">Valet</a>.</p>
<div class="flex space-x-3 mt-6">
<a href="{{ url()->route('sponsor') }}" class="mt-4 text-lg px-3 py-2 inline-block bg-blue-900 hover:bg-blue-800 text-white rounded-lg shadow-md">Sponsor</a>
<a href="{{ url()->route('github') }}" class="mt-4 text-lg px-3 py-2 inline-block bg-blue-900 hover:bg-blue-800 text-white rounded-lg shadow-md">GitHub</a>
<a href="{{ url()->route('releases') }}" class="mt-4 text-lg px-3 py-2 inline-block bg-green-800 hover:bg-blue-800 text-white rounded-lg shadow-md">Download</a>
<p class="text-2xl leading-9 mt-8"><b>PHP Monitor</b> is a lightweight, native Mac menu bar app that interacts with <a href="https://github.com/laravel/valet" class="underline">Laravel Valet</a>.</p>
<div class="flex md:space-x-3 mt-6 flex-col md:flex-row">
<a href="{{ url()->route('releases') }}" class="mt-4 text-lg md:text-xl px-3 py-2 inline-block bg-white hover:bg-blue-200 text-black rounded-lg shadow-md flex">
<svg width="28" height="28" viewBox="0 0 24 24"><path fill="currentColor" d="M13 13v5.585l1.828-1.828l1.415 1.415L12 22.414l-4.243-4.242l1.415-1.415L11 18.585V13h2zM12 2a7.001 7.001 0 0 1 6.954 6.194a5.5 5.5 0 0 1-.953 10.784v-2.014a3.5 3.5 0 1 0-1.112-6.91a5 5 0 1 0-9.777 0a3.5 3.5 0 0 0-1.292 6.88l.18.03v2.014a5.5 5.5 0 0 1-.954-10.784A7 7 0 0 1 12 2z"/></svg>
<span class="ml-2">Download</span>
</a>
<a href="{{ url()->route('github') }}" class="mt-4 text-lg md:text-xl px-3 py-2 inline-block bg-white hover:bg-blue-200 text-black rounded-lg shadow-md flex">
<svg width="28" height="28" viewBox="0 0 24 24"><path fill="currentColor" d="M13 21v2.5l-3-2l-3 2V21h-.5A3.5 3.5 0 0 1 3 17.5V5a3 3 0 0 1 3-3h14a1 1 0 0 1 1 1v17a1 1 0 0 1-1 1h-7zm0-2h6v-3H6.5a1.5 1.5 0 0 0 0 3H7v-2h6v2zm6-5V4H6v10.035A3.53 3.53 0 0 1 6.5 14H19zM7 5h2v2H7V5zm0 3h2v2H7V8zm0 3h2v2H7v-2z"/></svg>
<span class="ml-2">GitHub</span>
</a>
<a href="{{ url()->route('sponsor') }}" class="mt-4 text-lg md:text-xl px-3 py-2 inline-block bg-white hover:bg-blue-200 text-black rounded-lg shadow-md flex">
<svg width="28" height="28" viewBox="0 0 24 24"><path fill="rgb(191, 57, 137)" d="M17.625 1.499c-2.32 0-4.354 1.203-5.625 3.03c-1.271-1.827-3.305-3.03-5.625-3.03C3.129 1.499 0 4.253 0 8.249c0 4.275 3.068 7.847 5.828 10.227a33.14 33.14 0 0 0 5.616 3.876l.028.017l.008.003l-.001.003c.163.085.342.126.521.125c.179.001.358-.041.521-.125l-.001-.003l.008-.003l.028-.017a33.14 33.14 0 0 0 5.616-3.876C20.932 16.096 24 12.524 24 8.249c0-3.996-3.129-6.75-6.375-6.75zm-.919 15.275a30.766 30.766 0 0 1-4.703 3.316l-.004-.002l-.004.002a30.955 30.955 0 0 1-4.703-3.316c-2.677-2.307-5.047-5.298-5.047-8.523c0-2.754 2.121-4.5 4.125-4.5c2.06 0 3.914 1.479 4.544 3.684c.143.495.596.797 1.086.796c.49.001.943-.302 1.085-.796c.63-2.205 2.484-3.684 4.544-3.684c2.004 0 4.125 1.746 4.125 4.5c0 3.225-2.37 6.216-5.048 8.523z"/></svg>
<span class="ml-2">Sponsor</span>
</a>
</div>
</div>
</header>
</div>
<div class="px-4">
<div class="flex flex-col m-auto max-w-3xl py-10">
<div class="flex flex-col m-auto max-w-3xl py-4 md:py-10">
<div class="max-w-3xl m-auto">
<img src="{{ url('/images/phpmon.jpg') }}" alt="PHP Monitor" class="m-auto max-w-3xl max-w-full bg-gray-100 rounded-xl shadow-lg">
</div>
<div class="max-w-2xl m-auto mt-12">
<p class="text-2xl leading-9 mb-6"><b>PHP Monitor</b> helps you set up and develop <span class="text-blue-800">Laravel</span> and <span class="text-blue-800">Symfony</span> projects. It's also great for <span class="text-blue-800">WordPress</span> or <span class="text-blue-800">Drupal</span> sites. In fact, it's a great companion for all kinds of projects.</p>
<p class="mb-6 text-lg">This app is made with <span class="text-red-500">♥</span> by <a href="https://nicoverbruggen.be" class="text-blue-800">Nico Verbruggen</a>. It is open source and entirely free to use. Further development of this app is supported by <a class="text-blue-800" href="https://nicoverbruggen.be/sponsor">your donations</a>.</p>
<p class="text-2xl leading-9 mb-6"><b>PHP Monitor</b> helps you set up and develop <span class="text-blue-800">Laravel</span> and <span class="text-blue-800">Symfony</span> projects. It's also great for <span class="text-blue-800">WordPress</span> or <span class="text-blue-800">Drupal</span> sites. In fact, it's a great companion for all kinds of projects, no matter the framework or CMS.</p>
<p class="mb-6 text-lg">This app is made with <span class="text-red-500">♥</span> by <a href="https://nicoverbruggen.be" class="text-blue-800">Nico Verbruggen</a>. It is open source and entirely free to use. Further development of this app is supported by <a class="text-blue-800" href="https://nicoverbruggen.be/sponsor">your donations</a>. You are also encouraged to <a href="{{ url()->route('github') }}" class="text-blue-800">star the repository</a> on GitHub.</p>
</div>
</div>
<x-feature title="A solid foundation." img-src="/images/valet.png">
@ -84,7 +93,7 @@
<x-feature title="A tiny footprint." img-src="/images/sysres.png" y-position="top" class="lg:flex-row-reverse">
Laravel Valet is a lightweight solution that is much leaner than Docker, and PHP Monitor as a companion tool uses equally few system resources. It is light on RAM and its CPU usage is negligible.
</x-feature>
<div class="flex lg:flex-row flex-col m-auto max-w-5xl py-8 gap-x-10">
<div class="flex lg:flex-row flex-col m-auto max-w-5xl py-4 md:py-8 gap-x-10">
<x-single-feature title="Privacy conscious.">
No tracking. No bullshit. Nothing to worry about. The only outbound connection PHP Monitor makes is a check (that you can disable!) to see if a newer version is available. If you encounter a bug or crash, please get in touch—I'd be happy to help you out.
</x-single-feature>