fix(nx-dev): adjust powerpack mobile view

This commit is contained in:
Juri 2024-09-26 09:33:04 +02:00 committed by Juri Strumpflohner
parent 529ab9455c
commit fc39beae7a
2 changed files with 13 additions and 11 deletions

View File

@ -85,13 +85,13 @@ export function GetStarted(): ReactElement {
/>
</svg>
<div className="space-y-6 lg:space-y-12">
<div className="flex items-start gap-6">
<div className="relative flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 dark:ring-slate-800/60">
<div className="flex flex-col items-center lg:flex-row lg:items-start lg:gap-6">
<div className="mb-4 flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 lg:mb-0 dark:ring-slate-800/60">
<span className="text-lg text-slate-900 dark:text-slate-100">
1
</span>
</div>
<div>
<div className="text-center lg:text-left">
<h4 className="relative text-base font-medium leading-6 text-slate-900 dark:text-slate-100">
Buy an Nx Powerpack license
</h4>
@ -104,13 +104,14 @@ export function GetStarted(): ReactElement {
</div>
</div>
</div>
<div className="flex items-start gap-6">
<div className="relative flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 dark:ring-slate-800/60">
<div className="flex flex-col items-center lg:flex-row lg:items-start lg:gap-6">
<div className="mb-4 flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 lg:mb-0 dark:ring-slate-800/60">
<span className="text-lg text-slate-900 dark:text-slate-100">
2
</span>
</div>
<div>
<div className="text-center lg:text-left">
<h4 className="relative text-base font-medium leading-6 text-slate-900 dark:text-slate-100">
Activate Nx Powerpack right from your terminal
</h4>
@ -118,7 +119,7 @@ export function GetStarted(): ReactElement {
In your Nx workspace, run the following command to activate
your new license.
</p>
<div className="mt-4">
<div className="mt-4 text-left">
<TerminalOutput
command="nx activate-powerpack {YOUR_LICENSE_KEY}"
path="~/my-workspace"
@ -128,13 +129,14 @@ export function GetStarted(): ReactElement {
</div>
</div>
</div>
<div className="flex items-start gap-6">
<div className="relative flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 dark:ring-slate-800/60">
<div className="flex flex-col items-center lg:flex-row lg:items-start lg:gap-6">
<div className="mb-4 flex size-10 place-items-center rounded-full p-4 shadow-sm ring-1 ring-slate-200 lg:mb-0 dark:ring-slate-800/60">
<span className="text-lg text-slate-900 dark:text-slate-100">
3
</span>
</div>
<div>
<div className="text-center lg:text-left">
<h4 className="relative text-base font-medium leading-6 text-slate-900 dark:text-slate-100">
Install Powerpack plugins
</h4>

View File

@ -38,7 +38,7 @@ export function PowerpackFeatures(): ReactElement {
variant="secondary"
size="default"
>
Learn more about self-hosted cache storage
Learn self-hosted cache storage
</ButtonLink>
</div>
</div>