Browse Source

Refines messaging

main
Eric Amodio 1 year ago
parent
commit
fc958b69c7
17 changed files with 132 additions and 54 deletions
  1. +9
    -9
      package.json
  2. +2
    -2
      src/commands/quickCommand.steps.ts
  3. +1
    -1
      src/git/remotes/richRemoteProvider.ts
  4. +1
    -1
      src/plus/subscription/subscriptionService.ts
  5. +1
    -1
      src/quickpicks/items/directive.ts
  6. +1
    -1
      src/views/nodes/worktreesNode.ts
  7. +1
    -1
      src/views/workspacesView.ts
  8. +16
    -4
      src/webviews/apps/home/home.html
  9. +2
    -2
      src/webviews/apps/plus/account/components/account-content.ts
  10. +3
    -2
      src/webviews/apps/plus/focus/focus.html
  11. +8
    -1
      src/webviews/apps/plus/graph/GraphWrapper.tsx
  12. +3
    -3
      src/webviews/apps/plus/shared/components/feature-gate-plus-state.ts
  13. +3
    -1
      src/webviews/apps/settings/partials/commit-graph.html
  14. +1
    -1
      src/webviews/apps/settings/partials/views.worktrees.html
  15. +2
    -2
      src/webviews/apps/shared/components/feature-gate-badge.ts
  16. +61
    -22
      src/webviews/apps/welcome/welcome.html
  17. +17
    -0
      src/webviews/apps/welcome/welcome.scss

+ 9
- 9
package.json View File

@ -3937,7 +3937,7 @@
"gitlens.plusFeatures.enabled": {
"type": "boolean",
"default": true,
"markdownDescription": "Specifies whether to hide or show features that require a trial or subscription and are not accessible given the opened repositories and current trial or subscription",
"markdownDescription": "Specifies whether to hide or show features that require a trial or paid subscription and are not accessible given the opened repositories and current trial or subscription",
"scope": "window",
"order": 60
},
@ -14132,12 +14132,12 @@
},
{
"view": "gitlens.views.workspaces",
"contents": "[Create Cloud Workspace](command:gitlens.views.workspaces.create)\n\n☁️ Access is based on your subscription tier, e.g. Free, Pro, etc",
"contents": "[Create Cloud Workspace](command:gitlens.views.workspaces.create)\n\n☁️ Access is based on your subscription, e.g. Free, Pro, etc",
"when": "gitlens:plus"
},
{
"view": "gitlens.views.workspaces",
"contents": "[Start Free Pro Trial](command:gitlens.plus.loginOrSignUp)\n\nStart a free 7-day Pro trial to use GitKraken Workspaces, or [sign in](command:gitlens.plus.loginOrSignUp).\n☁️ Requires an account and access is based on your subscription tier, e.g. Free, Pro, etc",
"contents": "[Start Free Pro Trial](command:gitlens.plus.loginOrSignUp)\n\nStart a free 7-day Pro trial to use GitKraken Workspaces, or [sign in](command:gitlens.plus.loginOrSignUp).\n☁️ Requires an account and access is based on your subscription, e.g. Free, Pro, etc",
"when": "!gitlens:plus"
},
{
@ -14157,17 +14157,17 @@
},
{
"view": "gitlens.views.worktrees",
"contents": "[Preview Pro](command:gitlens.plus.startPreviewTrial)\n\nPreview Pro for 3 days, or [sign in](command:gitlens.plus.loginOrSignUp) to start a full 7-day Pro trial.\n✨ A trial or subscription is required to use this on privately hosted repos.",
"contents": "[Preview Pro](command:gitlens.plus.startPreviewTrial)\n\nPreview Pro for 3 days, or [sign in](command:gitlens.plus.loginOrSignUp) to start a full 7-day Pro trial.\n✨ A trial or paid subscription is required to use this on privately hosted repos.",
"when": "gitlens:plus:required && gitlens:plus:state == 0"
},
{
"view": "gitlens.views.worktrees",
"contents": "Your 3-day Pro preview has ended, start a free Pro trial to get an additional 7 days, or [sign in](command:gitlens.plus.loginOrSignUp).\n\n[Start Free Pro Trial](command:gitlens.plus.loginOrSignUp)\n✨ A trial or subscription is required to use this on privately hosted repos.",
"contents": "Your 3-day Pro preview has ended, start a free Pro trial to get an additional 7 days, or [sign in](command:gitlens.plus.loginOrSignUp).\n\n[Start Free Pro Trial](command:gitlens.plus.loginOrSignUp)\n✨ A trial or paid subscription is required to use this on privately hosted repos.",
"when": "gitlens:plus:required && gitlens:plus:state == 2"
},
{
"view": "gitlens.views.worktrees",
"contents": "Your Pro trial has ended, please upgrade to continue to use this on privately hosted repos.\n\n[Upgrade to Pro](command:gitlens.plus.purchase)\n✨ A subscription is required to use this on privately hosted repos.",
"contents": "Your Pro trial has ended, please upgrade to continue to use this on privately hosted repos.\n\n[Upgrade to Pro](command:gitlens.plus.purchase)\n✨ A paid subscription is required to use this on privately hosted repos.",
"when": "gitlens:plus:required && gitlens:plus:state == 4"
}
],
@ -14389,7 +14389,7 @@
{
"id": "gitlens.welcome.commitGraph",
"title": "Commit Graph ✨",
"description": "Helps you easily visualize your repository and keep track of all work in progress. Not only does it help you verify your changes, but also easily see changes made by others and when.\nUse the rich commit search to find exactly what you're looking for. It's powerful filters allow you to search by a specific commit, message, author, a changed file or files, or even a specific code change.\n\n[Open Commit Graph](command:gitlens.showGraph)",
"description": "Helps you easily visualize your repository and keep track of all work in progress.\nUse the rich commit search to find exactly what you're looking for. It's powerful filters allow you to search by a specific commit, message, author, a changed file or files, or even a specific code change.\n\n[Open Commit Graph](command:gitlens.showGraph)",
"media": {
"markdown": "walkthroughs/welcome/commit-graph.md"
}
@ -14397,7 +14397,7 @@
{
"id": "gitlens.welcome.workspaces",
"title": "Workspaces and Focus ☁️",
"description": "Workspaces allow you to easily group and manage multiple repositories all in one place, streamlining your workflow.\n\n[Open Workspaces](command:gitlens.showWorkspacesView)\n\nFocus view helps you concentrate on what really matters by gathering all your GitHub pull requests and issues into one comprehensive list.\n\n[Open Focus](command:gitlens.showFocusPage)",
"description": "Workspaces allow you to easily group and manage multiple repositories together, accessible from anywhere, streamlining your workflow.\nCreate workspaces just for yourself or share (coming soon in GitLens) them with your team for faster onboarding and better collaboration.\n\n[Open Workspaces](command:gitlens.showWorkspacesView)\n\nThe Focus view brings all of your GitHub pull requests and issues into a unified actionable view to help to you more easily juggle work in progress, pending work, reviews, and more.\nQuickly see if anything requires your attention while keeping you focused.\n\n[Open Focus](command:gitlens.showFocusPage)",
"media": {
"altText": "Illustrations of Focus and Workspaces view",
"svg": "walkthroughs/welcome/workspaces-focus.svg"
@ -14406,7 +14406,7 @@
{
"id": "gitlens.welcome.hostingServiceIntegrations",
"title": "Integrate with Git hosting services",
"description": "Quickly gain insights from pull requests and issues without leaving your editor.\n\nConnect with GitHub, GitHub Enterprise, GitLab, GitLab self-managed, Gitea, Gerrit, Google Source, Bitbucket, Bitbucket Server, Azure DevOps and custom servers.\nAll Git host integrations provide issue and pull request auto-linking, while rich integrations (e.g. GitHub & GitLab) provide more detailed hover information for auto-linked issues and pull requests, pull requests associated with branches and commits, and avatars.\n\n[Configure Autolinks](command:gitlens.showSettingsPage?%22autolinks%22)",
"description": "Simplify your workflow and quickly gain insights with automatic linking of issues and pull requests across multiple Git hosting platforms including GitHub, GitHub Enterprise ✨, GitLab, GitLab self-managed ✨, Gitea, Gerrit, Google Source, Bitbucket, Bitbucket Server, Azure DevOps, and custom servers.\n\nAll integration provide automatic linking, while rich integrations with GitHub & GitLab offer detailed hover information for autolinks, and correlations between pull requests, branches, and commits, as well as user avatars for added context.\n\n**Define your own autolinks**\nUse autolinks to linkify external references, like Jira issues or Zendesk tickets, in commit messages.\n\n[Configure Autolinks](command:gitlens.showSettingsPage?%22autolinks%22)",
"media": {
"markdown": "walkthroughs/welcome/8-hosting-service-integrations.md"
}

+ 2
- 2
src/commands/quickCommand.steps.ts View File

@ -2425,9 +2425,9 @@ export async function* ensureAccessStep<
} else {
if (access.subscription.required == null) return undefined;
placeholder = '✨ Requires a trial or subscription for use on privately hosted repos';
placeholder = '✨ Requires a trial or paid subscription for use on privately hosted repos';
if (isSubscriptionPaidPlan(access.subscription.required) && access.subscription.current.account != null) {
placeholder = '✨ Requires a subscription for use on privately hosted repos';
placeholder = '✨ Requires a paid subscription for use on privately hosted repos';
directives.push(createDirectiveQuickPickItem(Directive.RequiresPaidSubscription, true));
} else if (
access.subscription.current.account == null &&

+ 1
- 1
src/git/remotes/richRemoteProvider.ts View File

@ -509,7 +509,7 @@ export abstract class RichRemoteProvider extends RemoteProvider {
}
export async function ensurePaidPlan(providerName: string, container: Container): Promise<boolean> {
const title = `Connecting to a ${providerName} instance for rich integration features requires a trial or subscription.`;
const title = `Connecting to a ${providerName} instance for rich integration features requires a trial or paid subscription.`;
while (true) {
const subscription = await container.subscription.getSubscription();

+ 1
- 1
src/plus/subscription/subscriptionService.ts View File

@ -454,7 +454,7 @@ export class SubscriptionService implements Disposable {
const confirm: MessageItem = { title: 'Start Free Pro Trial', isCloseAffordance: true };
const cancel: MessageItem = { title: 'Cancel' };
const result = await window.showInformationMessage(
'Your 3-day Pro preview has ended, start a free Pro trial to get an additional 7 days.\n\n✨ A trial or subscription is required to use Pro features on privately hosted repos.',
'Your 3-day Pro preview has ended, start a free Pro trial to get an additional 7 days.\n\n✨ A trial or paid subscription is required to use Pro features on privately hosted repos.',
{ modal: true },
confirm,
cancel,

+ 1
- 1
src/quickpicks/items/directive.ts View File

@ -56,7 +56,7 @@ export function createDirectiveQuickPickItem(
break;
case Directive.RequiresPaidSubscription:
label = 'Upgrade to Pro';
detail = 'A subscription is required to use this on privately hosted repos';
detail = 'A paid subscription is required to use this on privately hosted repos';
break;
}
}

+ 1
- 1
src/views/nodes/worktreesNode.ts View File

@ -58,7 +58,7 @@ export class WorktreesNode extends ViewNode {
item.contextValue = ContextValues.Worktrees;
item.description = access.allowed
? undefined
: ` ${GlyphChars.Warning} Requires a trial or subscription for use on privately hosted repos`;
: ` ${GlyphChars.Warning} Requires a trial or paid subscription for use on privately hosted repos`;
// TODO@eamodio `folder` icon won't work here for some reason
item.iconPath = new ThemeIcon('folder-opened');
return item;

+ 1
- 1
src/views/workspacesView.ts View File

@ -64,7 +64,7 @@ export class WorkspacesView extends ViewBase<'workspaces', WorkspacesViewNode, W
private async updateDescription() {
const subscription = await this.container.subscription.getSubscription();
this.description = subscription.state === SubscriptionState.Paid ? undefined : '☁️';
this.description = `PREVIEW ${subscription.state === SubscriptionState.Paid ? '' : '☁️'}`;
}
override get canReveal(): boolean {

+ 16
- 4
src/webviews/apps/home/home.html View File

@ -136,7 +136,7 @@
aria-label="Show Commit Details view"
data-requires="repo"
><code-icon class="nav-list__icon" icon="gl-commit-view"></code-icon
><span class="nav-list__label">Commit Details view</span></a
><span class="nav-list__label">Commit Details</span></a
>
<a
class="nav-list__item"
@ -145,7 +145,7 @@
aria-label="Show Commits view"
data-requires="repo"
><code-icon class="nav-list__icon" icon="gl-commits-view"></code-icon
><span class="nav-list__label">Commits view</span></a
><span class="nav-list__label">Commits</span></a
>
<a
class="nav-list__item"
@ -163,7 +163,7 @@
aria-label="Show File History view"
data-requires="repo"
><code-icon class="nav-list__icon" icon="gl-history-view"></code-icon
><span class="nav-list__label">File History view</span></a
><span class="nav-list__label">File History</span></a
>
<a
class="nav-list__item"
@ -176,6 +176,15 @@
>
<a
class="nav-list__item"
href="command:gitlens.showStashesView"
title="Show Stashes view"
aria-label="Show Stashes view"
data-requires="repo"
><code-icon class="nav-list__icon" icon="gl-stashes-view"></code-icon
><span class="nav-list__label">Stashes</span></a
>
<a
class="nav-list__item"
href="command:gitlens.showSearchAndCompareView"
title="Show Search &amp; Compare view"
aria-label="Show Search &amp; Compare view"
@ -297,7 +306,10 @@
><span class="nav-list__label">Tutorial Video</span></a
>
</nav>
<p class="t-subtle">✨ Requires a trial or subscription to use this on privately hosted repos.</p>
<p class="t-subtle">
✨ Requires a trial or paid subscription to use this on privately hosted repos. <br />
☁️ Requires an account and access is based on your subscription, e.g. Free, Pro, etc
</p>
</main>
#{endOfBody}

+ 2
- 2
src/webviews/apps/plus/account/components/account-content.ts View File

@ -185,7 +185,7 @@ export class AccountContent extends LitElement {
</button-container>
<p>
You only have access to features on local and publicly hosted repos and features based on
your subscription tier, e.g. Free, Pro, etc.
your subscription, e.g. Free, Pro, etc.
</p>
`;
@ -213,7 +213,7 @@ export class AccountContent extends LitElement {
</button-container>
<p>
You have access to features on privately hosted repos and features based on your
subscription tier.
subscription.
</p>
`;
}

+ 3
- 2
src/webviews/apps/plus/focus/focus.html View File

@ -37,8 +37,9 @@
<div class="app__content" id="content">
<gk-feature-gate id="subscription-gate" class="scrollable"
><p slot="feature">
Helps you focus on what really matters by gathering all your GitHub pull requests and issues
into one comprehensive list.
Brings all of your GitHub pull requests and issues into a unified actionable view to help to you
more easily juggle work in progress, pending work, reviews, and more. Quickly see if anything
requires your attention while keeping you focused.
</p></gk-feature-gate
>
<gk-feature-gate id="connection-gate" class="scrollable" visible="false">

+ 8
- 1
src/webviews/apps/plus/graph/GraphWrapper.tsx View File

@ -1335,7 +1335,14 @@ export function GraphWrapper({
</div>
</header>
<FeatureGate className="graph-app__gate" appearance="alert" state={subscription?.state} visible={!allowed}>
<p slot="feature">Easily visualize your repository and keep track of all work in progress.</p>
<p slot="feature">
Helps you easily visualize your repository and keep track of all work in progress.
<br />
<br />
Use the rich commit search to find exactly what you're looking for. It's powerful filters allow you
to search by a specific commit, message, author, a changed file or files, or even a specific code
change.
</p>
</FeatureGate>
{graphConfig?.minimap && (
<GraphMinimap

+ 3
- 3
src/webviews/apps/plus/shared/components/feature-gate-plus-state.ts View File

@ -78,7 +78,7 @@ export class FeatureGatePlusState extends LitElement {
Preview Pro for 3 days, or
<a href="command:gitlens.plus.loginOrSignUp">sign in</a> to start a full 7-day Pro trial.
</p>
<p> A trial or subscription is required to use this on privately hosted repos.</p>
<p> A trial or paid subscription is required to use this on privately hosted repos.</p>
`;
case SubscriptionState.FreePreviewTrialExpired:
@ -90,7 +90,7 @@ export class FeatureGatePlusState extends LitElement {
<gk-button appearance="${appearance}" href="command:gitlens.plus.loginOrSignUp"
>Start Free Pro Trial</gk-button
>
<p> A trial or subscription is required to use this on privately hosted repos.</p>
<p> A trial or paid subscription is required to use this on privately hosted repos.</p>
`;
case SubscriptionState.FreePlusTrialExpired:
@ -99,7 +99,7 @@ export class FeatureGatePlusState extends LitElement {
<gk-button appearance="${appearance}" href="command:gitlens.plus.purchase"
>Upgrade to Pro</gk-button
>
<p> A subscription is required to use this on privately hosted repos.</p>
<p> A paid subscription is required to use this on privately hosted repos.</p>
`;
}

+ 3
- 1
src/webviews/apps/settings/partials/commit-graph.html View File

@ -1,7 +1,9 @@
<section id="commit-graph" class="section--settings section--collapsible">
<div class="section__header">
<h2>
Commit Graph&nbsp;<span title="Requires a trial or subscription for use on privately hosted repos"></span>
Commit Graph&nbsp;<span title="Requires a trial or paid subscription for use on privately hosted repos"
>✨</span
>
<a
class="link__learn-more"
title="Learn more"

+ 1
- 1
src/webviews/apps/settings/partials/views.worktrees.html View File

@ -1,7 +1,7 @@
<section id="worktrees-view" class="section--settings section--collapsible">
<div class="section__header">
<h2>
Worktrees view&nbsp;<span title="Requires a trial or subscription for use on privately hosted repos"
Worktrees view&nbsp;<span title="Requires a trial or paid subscription for use on privately hosted repos"
>✨</span
>
<a

+ 2
- 2
src/webviews/apps/shared/components/feature-gate-badge.ts View File

@ -118,13 +118,13 @@ export class FeatureGateBadge extends LitElement {
case SubscriptionState.Free:
case SubscriptionState.FreePreviewTrialExpired:
return html`<span class="badge-footnote"
> Requires a trial or subscription for use on privately hosted repos.</span
> Requires a trial or paid subscription for use on privately hosted repos.</span
>`;
case SubscriptionState.FreePlusTrialExpired:
case SubscriptionState.FreeInPreviewTrial:
case SubscriptionState.FreePlusInTrial:
return html`<span class="badge-footnote"
> Requires a subscription for use on privately hosted repos.</span
> Requires a paid subscription for use on privately hosted repos.</span
>`;
default:
return nothing;

+ 61
- 22
src/webviews/apps/welcome/welcome.html View File

@ -54,12 +54,21 @@
</section>
<section class="welcome__section">
<h2>Powerful Features</h2>
<p>
Features with a ✨ sparkle require a trial or subscription for use on privately hosted repos
<br />
Features with a ☁️ cloud require an account and access is based on your subscription tier, e.g.
Free, Pro, etc
</p>
<div class="welcome__gates">
<p>
All features are <strong>completely free</strong> for use on all repos, except for ones marked
with:
</p>
<p>
✨ require a
<a class="muted" href="https://www.gitkraken.com/gitlens/pricing" title="Learn more"
>trial or paid subscription</a
>
for use on privately hosted repos
<br />
☁️ require an account and access is based on your subscription, e.g. Free, Pro, etc
</p>
</div>
<h3 class="checkbox-group">
<label class="checkbox" for="inline-blame"
><input type="checkbox" id="inline-blame" data-feature="blame" checked />Inline Blame</label
@ -69,7 +78,8 @@
>
</h3>
<p>
In-editor code annotations and rich hovers help you better understand how code changed and by whom
Gain a deeper understanding of how code changed and by whom through in-editor code annotations and
rich hovers.
</p>
<gk-blame-svg id="blame" inline codelens></gk-blame-svg>
@ -111,7 +121,12 @@
>
</h3>
<p>Helps you easily visualize and keep track of all work in progress<br /></p>
<p>Helps you easily visualize your repository and keep track of all work in progress.</p>
<p>
Use the rich commit search to find exactly what you're looking for. It's powerful filters allow you
to search by a specific commit, message, author, a changed file or files, or even a specific code
change.
</p>
<gk-graph-svg></gk-graph-svg>
<h3>Side Bar Views</h3>
@ -234,6 +249,7 @@
aria-label="Open Focus"
>Focus</a
>
<span class="welcome__preview">Preview</span>
☁️
</h3>
<p>
@ -245,9 +261,9 @@
<gk-workspaces-svg></gk-workspaces-svg>
<p>
The Focus view helps you concentrate on what really matters by gathering all your GitHub pull
requests and issues into one comprehensive list. Helps you focus on what's important by providing
you with a comprehensive list of all your pull requests and issues on your GitHub repos.
The Focus view brings all of your GitHub pull requests and issues into a unified actionable view to
help to you more easily juggle work in progress, pending work, reviews, and more. Quickly see if
anything requires your attention while keeping you focused.
</p>
<gk-focus-svg></gk-focus-svg>
@ -264,18 +280,34 @@
</h3>
<p>
Enables you to quickly see the evolution of a file, including when changes were made, how large they
were, and who made them. Use it to quickly find when the most impactful changes were made to a file
or who best to talk to about file changes and more.
Quickly see the evolution of a file, including when changes were made, how large they were, and who
made them. Use it to quickly find when the most impactful changes were made to a file or who best to
talk to about file changes and more.
</p>
<gk-timeline-svg></gk-timeline-svg>
<h3>Integrations</h3>
<p>GitLens provides issue and pull request auto-linking with many Git hosting services.</p>
<p>
Rich integrations with GitHub & GitLab provide more detailed hover information for auto-linked
issues and pull requests, pull requests associated with branches and commits, and avatars.
Simplify your workflow and quickly gain insights with automatic linking of issues and pull requests
across multiple Git hosting platforms including GitHub, GitHub Enterprise ✨, GitLab, GitLab
self-managed ✨, Gitea, Gerrit, Google Source, Bitbucket, Bitbucket Server, Azure DevOps, and custom
servers.
</p>
<p>
All integration provide automatic linking, while rich integrations with GitHub & GitLab offer
detailed hover information for autolinks, and correlations between pull requests, branches, and
commits, as well as user avatars for added context.
</p>
<p>
<strong>Define your own autolinks</strong>
</p>
<p>
Use autolinks to linkify external references, like Jira issues or Zendesk tickets, in commit
messages.
</p>
<gk-button appearance="secondary" href="command:gitlens.showSettingsPage?%22autolinks%22"
>Configure Autolinks</gk-button
>
<h3><code-icon icon="beaker" size="20"></code-icon> GitKraken Labs</h3>
<p>Experimental features.</p>
@ -348,21 +380,21 @@
data-requires="repo"
title="Show Commits view"
aria-label="Show Commits view"
><code-icon icon="gl-commits-view"></code-icon><span>Commits view</span></a
><code-icon icon="gl-commits-view"></code-icon><span>Commits</span></a
>
<a
href="command:gitlens.showCommitDetailsView"
data-requires="repo"
title="Show Commit Details view"
aria-label="Show Commit Details view"
><code-icon icon="gl-commit-view"></code-icon><span>Commit Details view</span></a
><code-icon icon="gl-commit-view"></code-icon><span>Commit Details</span></a
>
<a
href="command:gitlens.showFileHistoryView"
data-requires="repo"
title="Show File History view"
aria-label="Show File History view"
><code-icon icon="gl-history-view"></code-icon><span>File History view</span></a
><code-icon icon="gl-history-view"></code-icon><span>File History</span></a
>
<a
href="command:gitlens.showTimelineView"
@ -372,6 +404,13 @@
><code-icon icon="graph-scatter"></code-icon><span>Visual File History ✨</span></a
>
<a
href="command:gitlens.showStashesView"
data-requires="repo"
title="Show Stashes view"
aria-label="Show Stashes view"
><code-icon icon="gl-stashes-view"></code-icon>Stashes</a
>
<a
href="command:gitlens.showSearchAndCompareView"
data-requires="repo"
title="Show Search &amp; Compare view"
@ -459,9 +498,9 @@
</main>
<footer>
<p>
✨ Requires a trial or subscription for use on privately hosted repos
✨ Requires a trial or paid subscription for use on privately hosted repos
<br />
☁️ Requires an account and access is based on your subscription tier, e.g. Free, Pro, etc
☁️ Requires an account and access is based on your subscription, e.g. Free, Pro, etc
</p>
</footer>
#{endOfBody}

+ 17
- 0
src/webviews/apps/welcome/welcome.scss View File

@ -232,6 +232,23 @@ gk-card p {
}
}
&__gates {
p:first-child {
margin-bottom: 0.5rem;
}
p:last-child {
margin-top: 0.5rem;
margin-left: 2rem;
}
}
&__preview {
font-size: 0.9rem;
font-weight: normal;
text-transform: uppercase;
}
&__toolbar {
display: flex;
flex-direction: row;

Loading…
Cancel
Save