Add mascot in welcome modal
This commit is contained in:
parent
767619f639
commit
006b83927b
|
@ -7,29 +7,54 @@
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
|
|
||||||
<div class="block-documentation">
|
<div class="block-documentation">
|
||||||
<div i18n class="subtitle">Documentation</div>
|
|
||||||
|
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
<a class="link-block" href="https://docs.joinpeertube.org/#/maintain-tools" target="_blank" rel="noopener noreferrer">
|
<a class="link-block" href="https://docs.joinpeertube.org/#/maintain-tools" target="_blank" rel="noopener noreferrer">
|
||||||
<a class="link-title" href="https://docs.joinpeertube.org/#/maintain-tools" target="_blank" rel="noopener noreferrer">CLI</a>
|
<a class="link-title" href="https://docs.joinpeertube.org/#/maintain-tools" target="_blank" rel="noopener noreferrer">CLI
|
||||||
|
documentation</a>
|
||||||
|
|
||||||
<div>Upload or import videos, parse logs, prune storage directories, reset user password...</div>
|
<div>Upload or import videos, parse logs, prune storage directories, reset user password...</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a class="link-block" href="https://docs.joinpeertube.org/#/admin-following-instances" target="_blank" rel="noopener noreferrer">
|
<a class="link-block" href="https://docs.joinpeertube.org/#/admin-following-instances" target="_blank" rel="noopener noreferrer">
|
||||||
<a class="link-title" href="https://docs.joinpeertube.org/#/admin-following-instances" target="_blank" rel="noopener noreferrer">Administer</a>
|
<a class="link-title" href="https://docs.joinpeertube.org/#/admin-following-instances" target="_blank" rel="noopener noreferrer">Administer
|
||||||
|
documentation</a>
|
||||||
|
|
||||||
<div>Managing users, following other instances, dealing with spammers...</div>
|
<div>Managing users, following other instances, dealing with spammers...</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a class="link-block" href="https://docs.joinpeertube.org/#/use-setup-account" target="_blank" rel="noopener noreferrer">
|
<a class="link-block" href="https://docs.joinpeertube.org/#/use-setup-account" target="_blank" rel="noopener noreferrer">
|
||||||
<a class="link-title" href="https://docs.joinpeertube.org/#/use-setup-account" target="_blank" rel="noopener noreferrer">Use</a>
|
<a class="link-title" href="https://docs.joinpeertube.org/#/use-setup-account" target="_blank" rel="noopener noreferrer">Use
|
||||||
|
documentation</a>
|
||||||
|
|
||||||
<div>Setup your account, managing video playlists, discover third-party applications...</div>
|
<div>Setup your account, managing video playlists, discover third-party applications...</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="two-columns">
|
||||||
|
|
||||||
|
<div class="mascot">
|
||||||
|
<img src="/client/assets/images/mascot/pointing.png" alt="mascot">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="block-links">
|
||||||
|
<div i18n class="subtitle">Useful links</div>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Official PeerTube website (news, support, contribute...): <a href="https://joinpeertube.org" target="_blank"
|
||||||
|
rel="noopener noreferrer">https://joinpeertube.org</a></li>
|
||||||
|
|
||||||
|
<li>Put your instance on the public PeerTube index: <a href="https://instances.joinpeertube.org/instances">https://instances.joinpeertube.org/instances</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="two-columns">
|
||||||
|
<div class="mascot">
|
||||||
|
<img src="/client/assets/images/mascot/happy.png" alt="mascot">
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="block-configuration">
|
<div class="block-configuration">
|
||||||
<div i18n class="subtitle">It's time to configure your instance!</div>
|
<div i18n class="subtitle">It's time to configure your instance!</div>
|
||||||
|
|
||||||
|
@ -40,28 +65,23 @@
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p i18n>
|
<p i18n>
|
||||||
If you want to open registrations, please decide what are <strong>your moderation rules</strong>, fill your <strong>instance terms</strong>
|
If you want to open registrations, please decide what are <strong>your moderation rules</strong>, fill your <strong>instance
|
||||||
and specify the categories and languages you speak. This way, you will help users to register on <strong>the appropriate</strong> PeerTube instance.
|
terms</strong>
|
||||||
|
and specify the categories and languages you speak. This way, you will help users to register on <strong>the
|
||||||
|
appropriate</strong>
|
||||||
|
PeerTube instance.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div class="configure-instance">
|
|
||||||
<a i18n href="/admin/config/edit-custom" target="_blank" rel="noopener noreferrer">Configure your instance</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="block-links">
|
|
||||||
<div i18n class="subtitle">Useful links</div>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<li>Official PeerTube website (news, support, contribute...): <a href="https://joinpeertube.org" target="_blank" rel="noopener noreferrer">https://joinpeertube.org</a></li>
|
|
||||||
|
|
||||||
<li>Put your instance on the public PeerTube index: <a href="https://instances.joinpeertube.org/instances">https://instances.joinpeertube.org/instances</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="modal-footer inputs">
|
<div class="modal-footer inputs">
|
||||||
<span i18n class="action-button action-button-submit" (click)="hide()">Understood!</span>
|
<span i18n class="action-button action-button-understood" (click)="hide()">Remind me later</span>
|
||||||
|
|
||||||
|
<a i18n (click)="doNotOpenAgain(); hide()" class="configure-instance-button" href="/admin/config/edit-custom" target="_blank"
|
||||||
|
rel="noopener noreferrer">
|
||||||
|
Configure my instance
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
|
@ -5,19 +5,28 @@
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.two-columns {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mascot {
|
||||||
|
display: block;
|
||||||
|
min-width: 170px;
|
||||||
|
}
|
||||||
|
|
||||||
.subtitle {
|
.subtitle {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.block-documentation .subtitle {
|
.block-documentation {
|
||||||
|
.subtitle {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.block-configuration,
|
|
||||||
.block-instance {
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
|
@ -52,5 +61,22 @@ li {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.link-title,
|
||||||
|
div {
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.configure-instance-button {
|
||||||
|
@include peertube-button;
|
||||||
|
@include orange-button;
|
||||||
|
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-button-understood {
|
||||||
|
@include peertube-button;
|
||||||
|
@include grey-button;
|
||||||
|
}
|
||||||
|
|
|
@ -18,13 +18,11 @@ export class WelcomeModalComponent {
|
||||||
) { }
|
) { }
|
||||||
|
|
||||||
show () {
|
show () {
|
||||||
const ref = this.modalService.open(this.modal,{
|
this.modalService.open(this.modal,{
|
||||||
backdrop: 'static',
|
backdrop: 'static',
|
||||||
keyboard: false,
|
keyboard: false,
|
||||||
size: 'lg'
|
size: 'lg'
|
||||||
})
|
})
|
||||||
|
|
||||||
ref.result.finally(() => this.doNotOpenAgain())
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private doNotOpenAgain () {
|
private doNotOpenAgain () {
|
||||||
|
|
Loading…
Reference in New Issue