refactor(css): add new global classes & card border hover styling (#1156)

This commit is contained in:
TheCatLady
2021-03-11 21:25:46 -05:00
committed by GitHub
parent 71773c91c6
commit 1be97fe7fb
31 changed files with 165 additions and 152 deletions

View File

@@ -113,7 +113,7 @@ const NotificationsDiscord: React.FC = () => {
{intl.formatMessage(messages.botUsername)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="botUsername"
name="botUsername"
@@ -131,7 +131,7 @@ const NotificationsDiscord: React.FC = () => {
{intl.formatMessage(messages.botAvatarUrl)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="botAvatarUrl"
name="botAvatarUrl"
@@ -149,7 +149,7 @@ const NotificationsDiscord: React.FC = () => {
{intl.formatMessage(messages.webhookUrl)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="webhookUrl"
name="webhookUrl"

View File

@@ -152,7 +152,7 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.emailsender)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="emailFrom"
name="emailFrom"
@@ -170,7 +170,7 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.senderName)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="senderName"
name="senderName"
@@ -185,7 +185,7 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.smtpHost)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="smtpHost"
name="smtpHost"
@@ -203,15 +203,13 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.smtpPort)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm sm:max-w-xs">
<Field
id="smtpPort"
name="smtpPort"
type="text"
placeholder="465"
className="short"
/>
</div>
<Field
id="smtpPort"
name="smtpPort"
type="text"
placeholder="465"
className="short"
/>
{errors.smtpPort && touched.smtpPort && (
<div className="error">{errors.smtpPort}</div>
)}
@@ -245,7 +243,7 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.authUser)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field id="authUser" name="authUser" type="text" />
</div>
</div>
@@ -255,7 +253,7 @@ const NotificationsEmail: React.FC = () => {
{intl.formatMessage(messages.authPass)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="authPass"
name="authPass"

View File

@@ -126,7 +126,7 @@ const NotificationsPushbullet: React.FC = () => {
{intl.formatMessage(messages.accessToken)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="accessToken"
name="accessToken"

View File

@@ -153,7 +153,7 @@ const NotificationsPushover: React.FC = () => {
{intl.formatMessage(messages.accessToken)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="accessToken"
name="accessToken"
@@ -171,7 +171,7 @@ const NotificationsPushover: React.FC = () => {
{intl.formatMessage(messages.userToken)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="userToken"
name="userToken"

View File

@@ -129,7 +129,7 @@ const NotificationsSlack: React.FC = () => {
{intl.formatMessage(messages.webhookUrl)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field id="webhookUrl" name="webhookUrl" type="text" />
</div>
{errors.webhookUrl && touched.webhookUrl && (

View File

@@ -159,7 +159,7 @@ const NotificationsTelegram: React.FC = () => {
{intl.formatMessage(messages.botUsername)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="botUsername"
name="botUsername"
@@ -177,7 +177,7 @@ const NotificationsTelegram: React.FC = () => {
{intl.formatMessage(messages.botAPI)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="botAPI"
name="botAPI"
@@ -195,7 +195,7 @@ const NotificationsTelegram: React.FC = () => {
{intl.formatMessage(messages.chatId)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field
id="chatId"
name="chatId"

View File

@@ -175,7 +175,7 @@ const NotificationsWebhook: React.FC = () => {
{intl.formatMessage(messages.webhookUrl)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field id="webhookUrl" name="webhookUrl" type="text" />
</div>
{errors.webhookUrl && touched.webhookUrl && (
@@ -188,7 +188,7 @@ const NotificationsWebhook: React.FC = () => {
{intl.formatMessage(messages.authheader)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<Field id="authHeader" name="authHeader" type="text" />
</div>
</div>
@@ -198,7 +198,7 @@ const NotificationsWebhook: React.FC = () => {
{intl.formatMessage(messages.customJson)}
</label>
<div className="form-input">
<div className="flex max-w-lg rounded-md shadow-sm">
<div className="form-input-field">
<JSONEditor
name="webhook-json-payload"
onUpdate={(value) => setFieldValue('jsonPayload', value)}