open-source-mirrors
/
overseerr
mirror of https://github.com/sct/overseerr
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(ui): add/tweak icons (#1819)

Browse Source 
* refactor(ui): add prev/next button icons

* refactor(ui): use mail icon instead of at symbol icon for email

* refactor(ui): use ↻ symbol instead of ⤾ for reload button

* refactor(ui): add missing icons to password reset pages

* refactor(ui): add icons for save & test buttons

Co-authored-by: sct <ryan@sct.dev>
pull/1874/head^2
TheCatLady 3 years ago committed by GitHub
parent 1133a34ffd
commit 8b960acf73
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
28 changed files with 227 additions and 106 deletions
Show Stats Download Patch File Download Diff File

2
public/offline.html
Unescape View File

@ -31,7 +31,7 @@
<body>
<h1>You are offline</h1>
<button type="button">⤾ Reload</button>
<button type="button">↻ Reload</button>
<!-- Inline the page's JavaScript file. -->
<script>

13
src/components/RequestList/index.tsx
Unescape View File

@ -1,4 +1,9 @@
import { FilterIcon, SortDescendingIcon } from '@heroicons/react/solid';
import {
ChevronLeftIcon,
ChevronRightIcon,
FilterIcon,
SortDescendingIcon,
} from '@heroicons/react/solid';
import Link from 'next/link';
import { useRouter } from 'next/router';
import React, { useEffect, useState } from 'react';
@ -271,13 +276,15 @@ const RequestList: React.FC = () => {
disabled={!hasPrevPage}
onClick={() => updateQueryParams('page', (page - 1).toString())}
>
{intl.formatMessage(globalMessages.previous)}
<ChevronLeftIcon />
<span>{intl.formatMessage(globalMessages.previous)}</span>
</Button>
<Button
disabled={!hasNextPage}
onClick={() => updateQueryParams('page', (page + 1).toString())}
>
{intl.formatMessage(globalMessages.next)}
<span>{intl.formatMessage(globalMessages.next)}</span>
<ChevronRightIcon />
</Button>
</div>
</nav>

7
src/components/ResetPassword/RequestResetLink.tsx
Unescape View File

@ -1,4 +1,4 @@
import { AtSymbolIcon } from '@heroicons/react/outline';
import { ArrowLeftIcon, MailIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import Link from 'next/link';
@ -68,7 +68,8 @@ const ResetPassword: React.FC = () => {
<span className="flex justify-center mt-4 rounded-md shadow-sm">
<Link href="/login" passHref>
<Button as="a" buttonType="ghost">
{intl.formatMessage(messages.gobacklogin)}
<ArrowLeftIcon />
<span>{intl.formatMessage(messages.gobacklogin)}</span>
</Button>
</Link>
</span>
@ -125,7 +126,7 @@ const ResetPassword: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
<AtSymbolIcon />
<MailIcon />
<span>
{intl.formatMessage(messages.emailresetlink)}
</span>

10
src/components/ResetPassword/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SupportIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Form, Formik } from 'formik';
import Link from 'next/link';
@ -165,9 +166,12 @@ const ResetPassword: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SupportIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsDiscord.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -253,9 +254,12 @@ const NotificationsDiscord: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -264,9 +268,12 @@ const NotificationsDiscord: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsEmail.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -437,9 +438,12 @@ const NotificationsEmail: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -448,9 +452,12 @@ const NotificationsEmail: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsLunaSea/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -232,9 +233,12 @@ const NotificationsLunaSea: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -243,9 +247,12 @@ const NotificationsLunaSea: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsPushbullet/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -212,9 +213,12 @@ const NotificationsPushbullet: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -223,9 +227,12 @@ const NotificationsPushbullet: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsPushover/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -258,9 +259,12 @@ const NotificationsPushover: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -269,9 +273,12 @@ const NotificationsPushover: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsSlack/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -210,9 +211,12 @@ const NotificationsSlack: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -221,9 +225,12 @@ const NotificationsSlack: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsTelegram.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useState } from 'react';
@ -306,9 +307,12 @@ const NotificationsTelegram: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -317,9 +321,12 @@ const NotificationsTelegram: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsWebPush/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React, { useEffect, useState } from 'react';
@ -132,9 +133,12 @@ const NotificationsWebPush: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -143,9 +147,12 @@ const NotificationsWebPush: React.FC = () => {
type="submit"
disabled={isSubmitting || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

19
src/components/Settings/Notifications/NotificationsWebhook/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { BeakerIcon, SaveIcon } from '@heroicons/react/outline';
import { QuestionMarkCircleIcon, RefreshIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
@ -327,9 +328,12 @@ const NotificationsWebhook: React.FC = () => {
testSettings();
}}
>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
<BeakerIcon />
<span>
{isTesting
? intl.formatMessage(globalMessages.testing)
: intl.formatMessage(globalMessages.test)}
</span>
</Button>
</span>
<span className="inline-flex ml-3 rounded-md shadow-sm">
@ -338,9 +342,12 @@ const NotificationsWebhook: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid || isTesting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

8
src/components/Settings/SettingsLogs/index.tsx
Unescape View File

@ -1,4 +1,6 @@
import {
ChevronLeftIcon,
ChevronRightIcon,
ClipboardCopyIcon,
DocumentSearchIcon,
FilterIcon,
@ -421,7 +423,8 @@ const SettingsLogs: React.FC = () => {
updateQueryParams('page', (page - 1).toString())
}
>
{intl.formatMessage(globalMessages.previous)}
<ChevronLeftIcon />
<span>{intl.formatMessage(globalMessages.previous)}</span>
</Button>
<Button
disabled={!hasNextPage}
@ -429,7 +432,8 @@ const SettingsLogs: React.FC = () => {
updateQueryParams('page', (page + 1).toString())
}
>
{intl.formatMessage(globalMessages.next)}
<span>{intl.formatMessage(globalMessages.next)}</span>
<ChevronRightIcon />
</Button>
</div>
</nav>

10
src/components/Settings/SettingsMain.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import { RefreshIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
@ -406,9 +407,12 @@ const SettingsMain: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

5
src/components/Settings/SettingsNotifications.tsx
Unescape View File

@ -1,5 +1,4 @@
import { AtSymbolIcon } from '@heroicons/react/outline';
import { CloudIcon, LightningBoltIcon } from '@heroicons/react/solid';
import { CloudIcon, LightningBoltIcon, MailIcon } from '@heroicons/react/solid';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import DiscordLogo from '../../assets/extlogos/discord.svg';
@ -30,7 +29,7 @@ const SettingsNotifications: React.FC = ({ children }) => {
text: intl.formatMessage(messages.email),
content: (
<span className="flex items-center">
<AtSymbolIcon className="h-4 mr-2" />
<MailIcon className="h-4 mr-2" />
{intl.formatMessage(messages.email)}
</span>
),

10
src/components/Settings/SettingsPlex.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import { RefreshIcon, SearchIcon, XIcon } from '@heroicons/react/solid';
import axios from 'axios';
import { Field, Formik } from 'formik';
@ -520,9 +521,12 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/Settings/SettingsUsers/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import React from 'react';
@ -200,9 +201,12 @@ const SettingsUsers: React.FC = () => {
type="submit"
disabled={isSubmitting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

8
src/components/UserList/index.tsx
Unescape View File

@ -1,5 +1,7 @@
import { TrashIcon } from '@heroicons/react/outline';
import {
ChevronLeftIcon,
ChevronRightIcon,
InboxInIcon,
PencilIcon,
SortDescendingIcon,
@ -740,7 +742,8 @@ const UserList: React.FC = () => {
updateQueryParams('page', (page - 1).toString())
}
>
{intl.formatMessage(globalMessages.previous)}
<ChevronLeftIcon />
<span>{intl.formatMessage(globalMessages.previous)}</span>
</Button>
<Button
disabled={!hasNextPage}
@ -748,7 +751,8 @@ const UserList: React.FC = () => {
updateQueryParams('page', (page + 1).toString())
}
>
{intl.formatMessage(globalMessages.next)}
<span>{intl.formatMessage(globalMessages.next)}</span>
<ChevronRightIcon />
</Button>
</div>
</nav>

10
src/components/UserProfile/UserSettings/UserGeneralSettings/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -357,9 +358,12 @@ const UserGeneralSettings: React.FC = () => {
type="submit"
disabled={isSubmitting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsDiscord.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -146,9 +147,12 @@ const UserNotificationsDiscord: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsEmail.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -144,9 +145,12 @@ const UserEmailSettings: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsTelegram.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Field, Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -182,9 +183,12 @@ const UserTelegramSettings: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/UserProfile/UserSettings/UserNotificationSettings/UserNotificationsWebPush.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -96,9 +97,12 @@ const UserWebPushSettings: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

5
src/components/UserProfile/UserSettings/UserNotificationSettings/index.tsx
Unescape View File

@ -1,5 +1,4 @@
import { AtSymbolIcon } from '@heroicons/react/outline';
import { CloudIcon } from '@heroicons/react/solid';
import { CloudIcon, MailIcon } from '@heroicons/react/solid';
import { useRouter } from 'next/router';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
@ -34,7 +33,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: intl.formatMessage(messages.email),
content: (
<span className="flex items-center">
<AtSymbolIcon className="h-4 mr-2" />
<MailIcon className="h-4 mr-2" />
{intl.formatMessage(messages.email)}
</span>
),

10
src/components/UserProfile/UserSettings/UserPasswordChange/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -223,9 +224,12 @@ const UserPasswordChange: React.FC = () => {
type="submit"
disabled={isSubmitting || !isValid}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

10
src/components/UserProfile/UserSettings/UserPermissions/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import { SaveIcon } from '@heroicons/react/outline';
import axios from 'axios';
import { Form, Formik } from 'formik';
import { useRouter } from 'next/router';
@ -114,9 +115,12 @@ const UserPermissions: React.FC = () => {
type="submit"
disabled={isSubmitting}
>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
<SaveIcon />
<span>
{isSubmitting
? intl.formatMessage(globalMessages.saving)
: intl.formatMessage(globalMessages.save)}
</span>
</Button>
</span>
</div>

4
src/styles/globals.css
Unescape View File

@ -303,11 +303,11 @@ button.input-action {
.button-md svg,
button.input-action svg,
.plex-button svg {
@apply w-5 h-5 mr-2 last:mr-0;
@apply w-5 h-5 ml-2 mr-2 first:ml-0 last:mr-0;
}
.button-sm svg {
@apply w-4 h-4 mr-1.5 last:mr-0;
@apply w-4 h-4 ml-1.5 mr-1.5 first:ml-0 last:mr-0;
}
.modal-icon {

Write Preview
Loading…
Cancel
Save