Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #377 from Stremio/add-install-link-to-warning

Browse source 
Add Install Link to Server Warning
This commit is contained in:
Alexandru Branza 2023-05-31 12:29:24 +02:00 committed by GitHub
commit 677b31a2e2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/common/StreamingServerWarning/StreamingServerWarning.js
View file

@ -51,11 +51,16 @@ const StreamingServerWarning = ({ className }) => {
return (
<div className={classnames(className, styles['warning-container'])}>
<div className={styles['warning-statement']}>{ t('SETTINGS_SERVER_UNAVAILABLE') }</div>
<a href="https://www.stremio.com/download-service" target="_blank" rel="noreferrer">
<Button className={styles['warning-button']} title={t('SERVICE_INSTALL')} tabIndex={-1}>
<div className={styles['warning-label']}>{ t('SERVICE_INSTALL') }</div>
</Button>
</a>
<Button className={styles['warning-button']} title={t('WARNING_STREAMING_SERVER_LATER')} onClick={onLaterClick} tabIndex={-1}>
<div className={styles['warning-label']}>{ t('WARNING_STREAMING_SERVER_LATER') }</div>
</Button>
<Button className={styles['warning-button']} title={t('WARNING_STREAMING_SERVER_DISMISS')} onClick={onDismissClick} tabIndex={-1}>
<div className={styles['warning-label']}>{ t('WARNING_STREAMING_SERVER_DISMISS') }</div>
<Button className={styles['warning-button']} title={t('DONT_SHOW_AGAIN')} onClick={onDismissClick} tabIndex={-1}>
<div className={styles['warning-label']}>{ t('DONT_SHOW_AGAIN') }</div>
</Button>
</div>
);

30
src/common/StreamingServerWarning/styles.less
View file

@ -6,7 +6,7 @@
display: flex;
flex-direction: row;
align-items: center;
padding: 0.5rem 1rem;
padding: 1rem;
background-color: @color-accent5-dark3;
.warning-statement {
@ -19,10 +19,11 @@
.warning-button {
flex: none;
max-width: 8rem;
margin-left: 1rem;
color: @color-surface-light5-90;
&:not(:last-child) {
margin-right: 1rem;
&:first-child {
margin-left: 0;
}
&:hover {
@ -37,4 +38,23 @@
color: @color-surface-light5-90;
}
}
}
.warning-button:hover {
text-decoration: underline;
}
}
@media only screen and (max-width: 500px) {
.warning-container {
display: block;
height: auto !important;
text-align: center;
.warning-statement {
margin-bottom: 0.5rem;
margin-right: 0;
}
.warning-button {
display: inline-block;
}
}
}