Increase global font size
This commit is contained in:
parent
b13a0a48ba
commit
5b0ec7cddb
|
@ -20,7 +20,6 @@
|
||||||
|
|
||||||
.instance-badges {
|
.instance-badges {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
font-size: 16px;
|
|
||||||
|
|
||||||
.pt-badge {
|
.pt-badge {
|
||||||
@include margin-right(5px);
|
@include margin-right(5px);
|
||||||
|
@ -29,10 +28,10 @@
|
||||||
|
|
||||||
.section-title {
|
.section-title {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
font-size: 16px;
|
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.middle-title {
|
.middle-title {
|
||||||
|
@ -44,7 +43,6 @@
|
||||||
|
|
||||||
.block {
|
.block {
|
||||||
margin-bottom: 75px;
|
margin-bottom: 75px;
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.short-description {
|
.short-description {
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.modal-subtitle {
|
.modal-subtitle {
|
||||||
font-size: 16px;
|
|
||||||
line-height: 1rem;
|
line-height: 1rem;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
|
@ -11,12 +11,12 @@
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p i18n>
|
<p i18n>
|
||||||
It is free and open-source software, under <a href="https://github.com/Chocobozzz/PeerTube/blob/develop/LICENSE">AGPLv3
|
It is free and open-source software, under <a class="link-orange" href="https://github.com/Chocobozzz/PeerTube/blob/develop/LICENSE">AGPLv3
|
||||||
licence</a>.
|
licence</a>.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p i18n>
|
<p i18n>
|
||||||
For more information, please visit <a target="_blank" rel="noopener noreferrer" href="https://joinpeertube.org">joinpeertube.org</a>.
|
For more information, please visit <a class="link-orange" target="_blank" rel="noopener noreferrer" href="https://joinpeertube.org">joinpeertube.org</a>.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -25,9 +25,8 @@
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="card-title">
|
<div class="card-title">
|
||||||
<a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/use-setup-account">Use PeerTube
|
<a i18n class="link-orange" target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/use-setup-account">Use PeerTube documentation</a>
|
||||||
documentation</a>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div i18n class="card-text">
|
<div i18n class="card-text">
|
||||||
Discover how to setup your account, what is a channel, how to create a playlist and more!
|
Discover how to setup your account, what is a channel, how to create a playlist and more!
|
||||||
|
@ -38,9 +37,8 @@
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="card-title">
|
<div class="card-title">
|
||||||
<a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/use-third-party-application">PeerTube
|
<a i18n class="link-orange" target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/use-third-party-application">PeerTube Applications</a>
|
||||||
Applications</a>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div i18n class="card-text">
|
<div i18n class="card-text">
|
||||||
Discover unofficial Android applications or browser addons!
|
Discover unofficial Android applications or browser addons!
|
||||||
|
@ -51,9 +49,8 @@
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="card-title">
|
<div class="card-title">
|
||||||
<a i18n target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/contribute-getting-started">Contribute on
|
<a i18n class="link-orange" target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/contribute-getting-started">Contribute on PeerTube</a>
|
||||||
PeerTube</a>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div i18n class="card-text">
|
<div i18n class="card-text">
|
||||||
Want to help to improve PeerTube? You can translate the web interface, give your feedback or directly contribute to the code!
|
Want to help to improve PeerTube? You can translate the web interface, give your feedback or directly contribute to the code!
|
||||||
|
@ -116,7 +113,7 @@
|
||||||
Web peers are not publicly accessible: because we use the websocket transport, the protocol is different from classic BitTorrent tracker.
|
Web peers are not publicly accessible: because we use the websocket transport, the protocol is different from classic BitTorrent tracker.
|
||||||
When you are in a web browser, you send a signal containing your IP address to the tracker that will randomly choose other peers
|
When you are in a web browser, you send a signal containing your IP address to the tracker that will randomly choose other peers
|
||||||
to forward the information to.
|
to forward the information to.
|
||||||
See <a href="https://github.com/yciabaud/webtorrent/blob/beps/bep_webrtc.rst">this document</a> for more information
|
See <a class="link-orange" href="https://github.com/yciabaud/webtorrent/blob/beps/bep_webrtc.rst">this document</a> for more information
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
|
@ -37,18 +37,6 @@
|
||||||
.card {
|
.card {
|
||||||
margin: 30px;
|
margin: 30px;
|
||||||
flex-basis: 300px;
|
flex-basis: 300px;
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.description,
|
|
||||||
.p2p-privacy,
|
|
||||||
my-about-peertube-contributors {
|
|
||||||
::ng-deep {
|
|
||||||
p,
|
|
||||||
li {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -70,7 +58,9 @@ my-about-peertube-contributors {
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-title {
|
.card-title {
|
||||||
font-size: 1.25rem;
|
font-size: 1.1rem;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.p2p-privacy-title {
|
.p2p-privacy-title {
|
||||||
|
|
|
@ -65,7 +65,6 @@
|
||||||
grid-row: 2;
|
grid-row: 2;
|
||||||
|
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
font-size: 16px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -105,7 +104,6 @@ my-subscribe-button {
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: pvar(--mainColor);
|
color: pvar(--mainColor);
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -126,10 +124,6 @@ my-subscribe-button {
|
||||||
grid-row: 1 / 4;
|
grid-row: 1 / 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.actor-counters {
|
.actor-counters {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<div class="col-12 col-lg-4 col-xl-3">
|
<div class="col-12 col-lg-4 col-xl-3">
|
||||||
<div i18n class="inner-form-title">APPEARANCE</div>
|
<div i18n class="inner-form-title">APPEARANCE</div>
|
||||||
<div i18n class="inner-form-description">
|
<div i18n class="inner-form-description">
|
||||||
Use <a routerLink="/admin/plugins">plugins & themes</a> for more involved changes, or <a routerLink="/admin/config/edit-custom" fragment="advanced-configuration">add slight customizations</a>.
|
Use <a class="link-orange" routerLink="/admin/plugins">plugins & themes</a> for more involved changes, or add slight <a class="link-orange" routerLink="/admin/config/edit-custom" fragment="advanced-configuration">customizations</a>.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -91,7 +91,7 @@
|
||||||
<div class="row mt-4"> <!-- broadcast grid -->
|
<div class="row mt-4"> <!-- broadcast grid -->
|
||||||
<div class="col-12 col-lg-4 col-xl-3">
|
<div class="col-12 col-lg-4 col-xl-3">
|
||||||
<div i18n class="inner-form-title">BROADCAST MESSAGE</div>
|
<div i18n class="inner-form-title">BROADCAST MESSAGE</div>
|
||||||
<div i18n class="inner-for-description">
|
<div i18n class="inner-form-description">
|
||||||
Display a message on your instance
|
Display a message on your instance
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -147,8 +147,8 @@
|
||||||
<div class="row mt-4"> <!-- new users grid -->
|
<div class="row mt-4"> <!-- new users grid -->
|
||||||
<div class="col-12 col-lg-4 col-xl-3">
|
<div class="col-12 col-lg-4 col-xl-3">
|
||||||
<div i18n class="inner-form-title">NEW USERS</div>
|
<div i18n class="inner-form-title">NEW USERS</div>
|
||||||
<div i18n class="inner-for-description">
|
<div i18n class="inner-form-description">
|
||||||
Manage <a routerLink="/admin/users">users</a> to set their quota individually.
|
Manage <a class="link-orange" routerLink="/admin/users">users</a> to set their quota individually.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -185,7 +185,7 @@
|
||||||
|
|
||||||
<div *ngIf="formErrors.signup.limit" class="form-error">{{ formErrors.signup.limit }}</div>
|
<div *ngIf="formErrors.signup.limit" class="form-error">{{ formErrors.signup.limit }}</div>
|
||||||
|
|
||||||
<small i18n *ngIf="hasUnlimitedSignup()" class="muted">Signup won't be limited to a fixed number of users.</small>
|
<small i18n *ngIf="hasUnlimitedSignup()" class="muted small">Signup won't be limited to a fixed number of users.</small>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div [ngClass]="getDisabledSignupClass()" class="mt-3">
|
<div [ngClass]="getDisabledSignupClass()" class="mt-3">
|
||||||
|
@ -252,7 +252,7 @@
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label i18n for="importConcurrency">Import jobs concurrency</label>
|
<label i18n for="importConcurrency">Import jobs concurrency</label>
|
||||||
<span i18n class="muted ms-1">allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span>
|
<span i18n class="small muted ms-1">allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span>
|
||||||
|
|
||||||
<div class="number-with-unit">
|
<div class="number-with-unit">
|
||||||
<input type="number" name="importConcurrency" formControlName="concurrency" />
|
<input type="number" name="importConcurrency" formControlName="concurrency" />
|
||||||
|
@ -268,7 +268,7 @@
|
||||||
i18n-labelText labelText="Allow import with HTTP URL (e.g. YouTube)"
|
i18n-labelText labelText="Allow import with HTTP URL (e.g. YouTube)"
|
||||||
>
|
>
|
||||||
<ng-container ngProjectAs="description">
|
<ng-container ngProjectAs="description">
|
||||||
<span i18n>⚠️ If enabled, we recommend to use <a href="https://docs.joinpeertube.org/maintain-configuration?id=security">a HTTP proxy</a> to prevent private URL access from your PeerTube server</span>
|
<span i18n>⚠️ If enabled, we recommend to use <a class="link-orange" href="https://docs.joinpeertube.org/maintain-configuration?id=security">a HTTP proxy</a> to prevent private URL access from your PeerTube server</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</my-peertube-checkbox>
|
</my-peertube-checkbox>
|
||||||
</div>
|
</div>
|
||||||
|
@ -372,11 +372,11 @@
|
||||||
i18n-labelText labelText="Enable global search"
|
i18n-labelText labelText="Enable global search"
|
||||||
>
|
>
|
||||||
<ng-container ngProjectAs="description">
|
<ng-container ngProjectAs="description">
|
||||||
<p i18n>⚠️ This functionality depends heavily on the moderation of instances followed by the search index you select.</p>
|
<div i18n>⚠️ This functionality depends heavily on the moderation of instances followed by the search index you select.</div>
|
||||||
|
|
||||||
<span i18n>
|
<div i18n>
|
||||||
You should only use moderated search indexes in production, or <a href="https://framagit.org/framasoft/peertube/search-index">host your own</a>.
|
You should only use moderated search indexes in production, or <a class="link-orange" href="https://framagit.org/framasoft/peertube/search-index">host your own</a>.
|
||||||
</span>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<ng-container ngProjectAs="extra">
|
<ng-container ngProjectAs="extra">
|
||||||
|
@ -424,7 +424,7 @@
|
||||||
<div class="col-12 col-lg-4 col-xl-3">
|
<div class="col-12 col-lg-4 col-xl-3">
|
||||||
<div i18n class="inner-form-title">FEDERATION</div>
|
<div i18n class="inner-form-title">FEDERATION</div>
|
||||||
<div i18n class="inner-form-description">
|
<div i18n class="inner-form-description">
|
||||||
Manage <a routerLink="/admin/follows">relations</a> with other instances.
|
Manage <a class="link-orange" routerLink="/admin/follows">relations</a> with other instances.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -472,10 +472,10 @@
|
||||||
i18n-labelText labelText="Automatically follow instances of a public index"
|
i18n-labelText labelText="Automatically follow instances of a public index"
|
||||||
>
|
>
|
||||||
<ng-container ngProjectAs="description">
|
<ng-container ngProjectAs="description">
|
||||||
<p i18n>⚠️ This functionality requires a lot of attention and extra moderation.</p>
|
<div i18n>⚠️ This functionality requires a lot of attention and extra moderation.</div>
|
||||||
|
|
||||||
<span i18n>
|
<span i18n>
|
||||||
See <a href="https://docs.joinpeertube.org/admin-following-instances?id=automatically-follow-other-instances" rel="noopener noreferrer" target="_blank">the documentation</a> for more information about the expected URL
|
See <a class="link-orange" href="https://docs.joinpeertube.org/admin-following-instances?id=automatically-follow-other-instances" rel="noopener noreferrer" target="_blank">the documentation</a> for more information about the expected URL
|
||||||
</span>
|
</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
|
@ -563,7 +563,7 @@
|
||||||
If your instance is explicitly allowed by Twitter, a video player will be embedded in the Twitter feed on PeerTube video share.<br />
|
If your instance is explicitly allowed by Twitter, a video player will be embedded in the Twitter feed on PeerTube video share.<br />
|
||||||
If the instance is not, we use an image link card that will redirect to your PeerTube instance.<br /><br />
|
If the instance is not, we use an image link card that will redirect to your PeerTube instance.<br /><br />
|
||||||
Check this checkbox, save the configuration and test with a video URL of your instance (https://example.com/w/blabla) on
|
Check this checkbox, save the configuration and test with a video URL of your instance (https://example.com/w/blabla) on
|
||||||
<a target='_blank' rel='noopener noreferrer' href='https://cards-dev.twitter.com/validator'>https://cards-dev.twitter.com/validator</a>
|
<a class="link-orange" target='_blank' rel='noopener noreferrer' href='https://cards-dev.twitter.com/validator'>https://cards-dev.twitter.com/validator</a>
|
||||||
to see if you instance is allowed.
|
to see if you instance is allowed.
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
|
@ -3,11 +3,6 @@
|
||||||
|
|
||||||
$form-base-input-width: 340px;
|
$form-base-input-width: 340px;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
form {
|
form {
|
||||||
padding-bottom: 1.5rem;
|
padding-bottom: 1.5rem;
|
||||||
}
|
}
|
||||||
|
@ -30,7 +25,7 @@ input[type=number] {
|
||||||
|
|
||||||
input[type=number] + span {
|
input[type=number] + span {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 5px;
|
top: 0.2em;
|
||||||
right: 2.5rem;
|
right: 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -74,6 +69,10 @@ input[type=submit] {
|
||||||
@include settings-big-title;
|
@include settings-big-title;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.inner-form-description {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
@include peertube-textarea(500px, 150px);
|
@include peertube-textarea(500px, 150px);
|
||||||
|
|
||||||
|
@ -88,6 +87,7 @@ textarea {
|
||||||
.label-small-info {
|
.label-small-info {
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.disabled-checkbox-extra {
|
.disabled-checkbox-extra {
|
||||||
|
|
|
@ -79,8 +79,8 @@
|
||||||
<div class="row mt-4"> <!-- moderation & nsfw grid -->
|
<div class="row mt-4"> <!-- moderation & nsfw grid -->
|
||||||
<div class="col-12 col-lg-4 col-xl-3">
|
<div class="col-12 col-lg-4 col-xl-3">
|
||||||
<div i18n class="inner-form-title">MODERATION & NSFW</div>
|
<div i18n class="inner-form-title">MODERATION & NSFW</div>
|
||||||
<div i18row="inner-for-description">
|
<div i18row="inner-form-description">
|
||||||
Manage <a routerLink="/admin/users">users</a> to build a moderation team.
|
Manage <a class="link-orange" routerLink="/admin/users">users</a> to build a moderation team.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -46,9 +46,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group" [ngClass]="getDisabledLiveClass()">
|
<div class="form-group" [ngClass]="getDisabledLiveClass()">
|
||||||
<label i18n for="liveMaxInstanceLives">
|
<label i18n for="liveMaxInstanceLives">Max simultaneous lives created on your instance</label>
|
||||||
Max simultaneous lives created on your instance <span class="muted">(-1 for "unlimited")</span>
|
|
||||||
</label>
|
<span class="ms-2 small muted">(-1 for "unlimited")</span>
|
||||||
|
|
||||||
<div class="number-with-unit">
|
<div class="number-with-unit">
|
||||||
<input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" />
|
<input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" />
|
||||||
|
@ -59,9 +59,8 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-group" [ngClass]="getDisabledLiveClass()">
|
<div class="form-group" [ngClass]="getDisabledLiveClass()">
|
||||||
<label i18n for="liveMaxUserLives">
|
<label i18n for="liveMaxUserLives">Max simultaneous lives created per user</label>
|
||||||
Max simultaneous lives created per user <span class="muted">(-1 for "unlimited")</span>
|
<span class="ms-2 small muted">(-1 for "unlimited")</span>
|
||||||
</label>
|
|
||||||
|
|
||||||
<div class="number-with-unit">
|
<div class="number-with-unit">
|
||||||
<input type="number" name="liveMaxUserLives" formControlName="maxUserLives" />
|
<input type="number" name="liveMaxUserLives" formControlName="maxUserLives" />
|
||||||
|
@ -136,7 +135,7 @@
|
||||||
<div class="form-group" [ngClass]="getDisabledLiveTranscodingClass()">
|
<div class="form-group" [ngClass]="getDisabledLiveTranscodingClass()">
|
||||||
<label i18n for="liveTranscodingThreads">Live transcoding threads</label>
|
<label i18n for="liveTranscodingThreads">Live transcoding threads</label>
|
||||||
|
|
||||||
<span class="muted ms-1">
|
<span class="small muted ms-1">
|
||||||
<ng-container *ngIf="getTotalTranscodingThreads().atMost" i18n>
|
<ng-container *ngIf="getTotalTranscodingThreads().atMost" i18n>
|
||||||
will claim at most {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with VOD transcoding
|
will claim at most {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with VOD transcoding
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
@ -157,7 +156,7 @@
|
||||||
|
|
||||||
<div class="form-group mt-4" [ngClass]="getDisabledLiveTranscodingClass()">
|
<div class="form-group mt-4" [ngClass]="getDisabledLiveTranscodingClass()">
|
||||||
<label i18n for="liveTranscodingProfile">Live transcoding profile</label>
|
<label i18n for="liveTranscodingProfile">Live transcoding profile</label>
|
||||||
<span class="muted ms-1" i18n>new live transcoding profiles can be added by PeerTube plugins</span>
|
<span class="small muted ms-1" i18n>new live transcoding profiles can be added by PeerTube plugins</span>
|
||||||
|
|
||||||
<my-select-options
|
<my-select-options
|
||||||
id="liveTranscodingProfile"
|
id="liveTranscodingProfile"
|
||||||
|
|
|
@ -8,15 +8,10 @@
|
||||||
<span i18n>
|
<span i18n>
|
||||||
Estimating a server's capacity to transcode and stream videos isn't easy and we can't tune PeerTube automatically.
|
Estimating a server's capacity to transcode and stream videos isn't easy and we can't tune PeerTube automatically.
|
||||||
</span>
|
</span>
|
||||||
<span i18n>
|
|
||||||
However, you may want to read our guidelines before tweaking the following values.
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<div class="callout-container">
|
<span i18n>
|
||||||
<a class="callout-link" target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/admin-configuration?id=transcoding" i18n>
|
However, you may want to read <a class="link-orange" target="_blank" rel="noopener noreferrer" href="https://docs.joinpeertube.org/admin-configuration?id=transcoding">our guidelines</a> before tweaking the following values.
|
||||||
Read guidelines
|
</span>
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -115,7 +110,11 @@
|
||||||
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
||||||
<label i18n>Resolutions to generate per enabled format</label>
|
<label i18n>Resolutions to generate per enabled format</label>
|
||||||
|
|
||||||
<div class="ms-2 mt-2 d-flex flex-column">
|
<div class="ms-2 d-flex flex-column">
|
||||||
|
<span class="mb-3 small muted" i18n>
|
||||||
|
The original file resolution will be the default target if no option is selected.
|
||||||
|
</span>
|
||||||
|
|
||||||
<ng-container formGroupName="resolutions">
|
<ng-container formGroupName="resolutions">
|
||||||
<div class="form-group" *ngFor="let resolution of resolutions">
|
<div class="form-group" *ngFor="let resolution of resolutions">
|
||||||
<my-peertube-checkbox
|
<my-peertube-checkbox
|
||||||
|
@ -127,10 +126,6 @@
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</my-peertube-checkbox>
|
</my-peertube-checkbox>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<span class="mb-2 muted" i18n>
|
|
||||||
The original file resolution will be the default target if no option is selected.
|
|
||||||
</span>
|
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -142,7 +137,8 @@
|
||||||
|
|
||||||
<div class="form-group mt-4" [ngClass]="getTranscodingDisabledClass()">
|
<div class="form-group mt-4" [ngClass]="getTranscodingDisabledClass()">
|
||||||
<label i18n for="transcodingThreads">Transcoding threads</label>
|
<label i18n for="transcodingThreads">Transcoding threads</label>
|
||||||
<span class="muted ms-1">
|
|
||||||
|
<span class="small muted ms-1">
|
||||||
<ng-container *ngIf="getTotalTranscodingThreads().atMost" i18n>
|
<ng-container *ngIf="getTotalTranscodingThreads().atMost" i18n>
|
||||||
will claim at most {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with live transcoding
|
will claim at most {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with live transcoding
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
@ -164,7 +160,7 @@
|
||||||
|
|
||||||
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
||||||
<label i18n for="transcodingConcurrency">Transcoding jobs concurrency</label>
|
<label i18n for="transcodingConcurrency">Transcoding jobs concurrency</label>
|
||||||
<span class="muted ms-1" i18n>allows to transcode multiple files in parallel. ⚠️ Requires a PeerTube restart</span>
|
<span class="small muted ms-1" i18n>allows to transcode multiple files in parallel. ⚠️ Requires a PeerTube restart</span>
|
||||||
|
|
||||||
<div class="number-with-unit">
|
<div class="number-with-unit">
|
||||||
<input type="number" name="transcodingConcurrency" formControlName="concurrency" />
|
<input type="number" name="transcodingConcurrency" formControlName="concurrency" />
|
||||||
|
@ -176,7 +172,7 @@
|
||||||
|
|
||||||
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
<div class="form-group" [ngClass]="getTranscodingDisabledClass()">
|
||||||
<label i18n for="transcodingProfile">Transcoding profile</label>
|
<label i18n for="transcodingProfile">Transcoding profile</label>
|
||||||
<span class="muted ms-1" i18n>new transcoding profiles can be added by PeerTube plugins</span>
|
<span class="small muted ms-1" i18n>new transcoding profiles can be added by PeerTube plugins</span>
|
||||||
|
|
||||||
<my-select-options
|
<my-select-options
|
||||||
id="transcodingProfile"
|
id="transcodingProfile"
|
||||||
|
|
|
@ -59,7 +59,7 @@
|
||||||
|
|
||||||
<ng-template pTemplate="emptymessage">
|
<ng-template pTemplate="emptymessage">
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="6">
|
<td colspan="5">
|
||||||
<div class="no-results">
|
<div class="no-results">
|
||||||
<ng-container *ngIf="search" i18n>No follower found matching current filters.</ng-container>
|
<ng-container *ngIf="search" i18n>No follower found matching current filters.</ng-container>
|
||||||
<ng-container *ngIf="!search" i18n>Your instance doesn't have any follower.</ng-container>
|
<ng-container *ngIf="!search" i18n>Your instance doesn't have any follower.</ng-container>
|
||||||
|
|
|
@ -4,11 +4,6 @@
|
||||||
|
|
||||||
$form-base-input-width: 340px;
|
$form-base-input-width: 340px;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.account-title {
|
.account-title {
|
||||||
@include settings-big-title;
|
@include settings-big-title;
|
||||||
|
|
||||||
|
|
|
@ -17,8 +17,6 @@
|
||||||
|
|
||||||
input {
|
input {
|
||||||
@include peertube-input-text(500px);
|
@include peertube-input-text(500px);
|
||||||
|
|
||||||
height: 35px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -14,7 +14,6 @@
|
||||||
.plugin-name {
|
.plugin-name {
|
||||||
@include margin-right(10px);
|
@include margin-right(10px);
|
||||||
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,11 +1,7 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.root {
|
code {
|
||||||
font-size: 15px;
|
font-size: 14px;
|
||||||
|
font-weight: $font-semibold;
|
||||||
code {
|
|
||||||
font-size: 14px;
|
|
||||||
font-weight: $font-semibold;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -66,7 +66,6 @@ input[type=email] {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 15px;
|
|
||||||
max-width: 450px;
|
max-width: 450px;
|
||||||
margin-bottom: 40px;
|
margin-bottom: 40px;
|
||||||
|
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-12 col-lg-8 col-xl-9">
|
<div class="col-12 col-lg-8 col-xl-9">
|
||||||
<h6 i18n>Banner image of the channel</h6>
|
<label i18n>Banner image of the channel</label>
|
||||||
|
|
||||||
<my-actor-banner-edit
|
<my-actor-banner-edit
|
||||||
*ngIf="videoChannel" [previewImage]="isCreation()"
|
*ngIf="videoChannel" [previewImage]="isCreation()"
|
||||||
|
|
|
@ -5,11 +5,6 @@
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-channel-title {
|
.video-channel-title {
|
||||||
@include settings-big-title;
|
@include settings-big-title;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.applications-title {
|
.applications-title {
|
||||||
@include settings-big-title;
|
@include settings-big-title;
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,7 +3,6 @@
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
@ -23,11 +22,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
my-user-notifications {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: $mobile-view) {
|
@media screen and (max-width: $mobile-view) {
|
||||||
.header {
|
.header {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
@ -1,18 +1,20 @@
|
||||||
<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
|
<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
|
||||||
<div *ngIf="success" class="alert alert-success">{{ success }}</div>
|
<div *ngIf="success" class="alert alert-success">{{ success }}</div>
|
||||||
|
|
||||||
<div i18n class="current-email">
|
|
||||||
Your current email is <span class="email">{{ user.email }}</span>.
|
|
||||||
It is never shown to the public.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div i18n class="pending-email" *ngIf="user.pendingEmail">
|
<div i18n class="pending-email" *ngIf="user.pendingEmail">
|
||||||
<span class="email">{{ user.pendingEmail }}</span> is awaiting email verification
|
<strong>{{ user.pendingEmail }}</strong> is awaiting email verification
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<form role="form" class="change-email" (ngSubmit)="changeEmail()" [formGroup]="form" *ngIf="user.pluginAuth === null">
|
<form role="form" class="change-email" (ngSubmit)="changeEmail()" [formGroup]="form" *ngIf="user.pluginAuth === null">
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
|
<label i18n for="new-email">Change your email</label>
|
||||||
|
|
||||||
|
<div i18n class="form-group-description">
|
||||||
|
Your current email is <strong>{{ user.email }}</strong>.
|
||||||
|
It is never shown to the public.
|
||||||
|
</div>
|
||||||
|
|
||||||
<input
|
<input
|
||||||
type="email" id="new-email" i18n-placeholder placeholder="New email" class="form-control"
|
type="email" id="new-email" i18n-placeholder placeholder="New email" class="form-control"
|
||||||
formControlName="new-email" [ngClass]="{ 'input-error': formErrors['new-email'] }"
|
formControlName="new-email" [ngClass]="{ 'input-error': formErrors['new-email'] }"
|
||||||
|
|
|
@ -1,18 +1,17 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
form {
|
||||||
font-weight: $font-regular;
|
max-width: 340px;
|
||||||
font-size: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
my-input-text {
|
my-input-text {
|
||||||
width: 340px;
|
|
||||||
display: block;
|
display: block;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=email] {
|
input[type=email] {
|
||||||
@include peertube-input-text(340px);
|
@include peertube-input-text(100%);
|
||||||
|
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
@ -22,15 +21,6 @@ input[type=submit] {
|
||||||
@include orange-button;
|
@include orange-button;
|
||||||
}
|
}
|
||||||
|
|
||||||
.current-email,
|
|
||||||
.pending-email {
|
.pending-email {
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
|
|
||||||
.email {
|
|
||||||
font-weight: $font-semibold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
width: max-content;
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,14 +1,13 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
form {
|
||||||
font-weight: $font-regular;
|
max-width: 340px;
|
||||||
font-size: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
my-input-text {
|
my-input-text {
|
||||||
width: 340px;
|
|
||||||
display: block;
|
display: block;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
my-input-text + my-input-text {
|
my-input-text + my-input-text {
|
||||||
|
|
|
@ -1,13 +1,13 @@
|
||||||
<div *ngIf="webNotifications">
|
<div *ngIf="webNotifications">
|
||||||
<ng-container *ngFor="let group of notificationSettingGroups">
|
<ng-container *ngFor="let group of notificationSettingGroups">
|
||||||
<div class="header custom-row">
|
<div class="header notification-row">
|
||||||
<div i18n>{{ group.label }}</div>
|
<div i18n>{{ group.label }}</div>
|
||||||
<div i18n>Web</div>
|
<div i18n>Web</div>
|
||||||
<div i18n *ngIf="emailEnabled">Email</div>
|
<div i18n *ngIf="emailEnabled">Email</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ng-container *ngFor="let notificationType of group.keys">
|
<ng-container *ngFor="let notificationType of group.keys">
|
||||||
<div class="custom-row" *ngIf="hasUserRight(notificationType)">
|
<div class="small notification-row" *ngIf="hasUserRight(notificationType)">
|
||||||
<div>{{ labelNotifications[notificationType] }}</div>
|
<div>{{ labelNotifications[notificationType] }}</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
|
@ -1,13 +1,12 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.custom-row {
|
.notification-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border-bottom: 1px solid $separator-border-color;
|
border-bottom: 1px solid $separator-border-color;
|
||||||
|
|
||||||
&.header {
|
&.header {
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
type="text" id="username" class="form-control"
|
type="text" id="username" class="form-control"
|
||||||
formControlName="username" readonly
|
formControlName="username" readonly
|
||||||
>
|
>
|
||||||
<div class="muted" i18n>
|
<div class="form-group-description" i18n>
|
||||||
People can find you using @{{ user.username }}@{{ instanceHost }}
|
People can find you using @{{ user.username }}@{{ instanceHost }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input#username + .muted {
|
input#username + .muted {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -14,7 +14,6 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-12 col-lg-8 col-xl-9">
|
<div class="col-12 col-lg-8 col-xl-9">
|
||||||
|
|
||||||
<my-user-quota [user]="user" [userInformationLoaded]="userInformationLoaded"></my-user-quota>
|
<my-user-quota [user]="user" [userInformationLoaded]="userInformationLoaded"></my-user-quota>
|
||||||
|
|
||||||
<my-account-profile [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-profile>
|
<my-account-profile [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-profile>
|
||||||
|
|
|
@ -34,9 +34,11 @@
|
||||||
{videoChannel.followersCount, plural, =0 {No subscribers} =1 {1 subscriber} other {{{ videoChannel.followersCount }} subscribers}}
|
{videoChannel.followersCount, plural, =0 {No subscribers} =1 {1 subscriber} other {{{ videoChannel.followersCount }} subscribers}}
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<div i18n class="video-channel-videos">{videoChannel.videosCount, plural, =0 {No videos} =1 {1 video} other {{{ videoChannel.videosCount }} videos}}</div>
|
<div class="d-flex">
|
||||||
|
<span i18n>{videoChannel.videosCount, plural, =0 {No videos} =1 {1 video} other {{{ videoChannel.videosCount }} videos}}</span>
|
||||||
<div i18n class="video-channel-views">{videoChannel.totalViews, plural, =0 {No views} =1 {1 view} other {{{ videoChannel.totalViews }} views}}</div>
|
<span class="mx-1">·</span>
|
||||||
|
<span i18n>{videoChannel.totalViews, plural, =0 {No views} =1 {1 view} other {{{ videoChannel.totalViews | myNumberFormatter }} views}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="video-channel-buttons">
|
<div class="video-channel-buttons">
|
||||||
<my-edit-button label [routerLink]="[ '/manage/update', videoChannel.nameWithHost ]"></my-edit-button>
|
<my-edit-button label [routerLink]="[ '/manage/update', videoChannel.nameWithHost ]"></my-edit-button>
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
<my-global-icon iconName="external-link"></my-global-icon>
|
<my-global-icon iconName="external-link"></my-global-icon>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<div class="muted">
|
<div class="small muted">
|
||||||
<ng-container *ngIf="isFollowingAccount(follow)" i18n>Is following all your channels</ng-container>
|
<ng-container *ngIf="isFollowingAccount(follow)" i18n>Is following all your channels</ng-container>
|
||||||
<ng-container *ngIf="!isFollowingAccount(follow)" i18n>Is following your channel {{ follow.following.name }}</ng-container>
|
<ng-container *ngIf="!isFollowingAccount(follow)" i18n>Is following your channel {{ follow.following.name }}</ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -13,8 +13,4 @@ input[type=text] {
|
||||||
|
|
||||||
.actor {
|
.actor {
|
||||||
@include actor-row($min-height: auto, $separator: true);
|
@include actor-row($min-height: auto, $separator: true);
|
||||||
|
|
||||||
.actor-display-name {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -27,7 +27,7 @@
|
||||||
[titlePage]="titlePage"
|
[titlePage]="titlePage"
|
||||||
[getVideosObservableFunction]="getVideosObservableFunction"
|
[getVideosObservableFunction]="getVideosObservableFunction"
|
||||||
[user]="user"
|
[user]="user"
|
||||||
i18n-noResultMessage noResultMessage="You don't have any video in your watch history yet."
|
[noResultMessage]="getNoResultMessage()"
|
||||||
[enableSelection]="false"
|
[enableSelection]="false"
|
||||||
[disabled]="disabled"
|
[disabled]="disabled"
|
||||||
#videosSelection
|
#videosSelection
|
||||||
|
|
|
@ -6,7 +6,6 @@
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
font-size: 16px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.top-buttons {
|
.top-buttons {
|
||||||
|
@ -29,11 +28,11 @@
|
||||||
|
|
||||||
grid-column: 3;
|
grid-column: 3;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
label {
|
label {
|
||||||
margin: 0 0 0 5px;
|
margin: 0 0 0 5px;
|
||||||
color: var(--greyForegroundColor);
|
color: var(--greyForegroundColor);
|
||||||
font-size: 15px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -44,8 +43,6 @@
|
||||||
@include button-with-icon;
|
@include button-with-icon;
|
||||||
|
|
||||||
grid-column: 4;
|
grid-column: 4;
|
||||||
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -134,4 +134,12 @@ export class MyHistoryComponent implements OnInit, DisableForReuseHook {
|
||||||
error: err => this.notifier.error(err.message)
|
error: err => this.notifier.error(err.message)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getNoResultMessage () {
|
||||||
|
if (this.search) {
|
||||||
|
return $localize`No videos found for "${this.search}".`
|
||||||
|
}
|
||||||
|
|
||||||
|
return $localize`You don't have any video in your watch history yet.`
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-playlist-title {
|
.video-playlist-title {
|
||||||
@include settings-big-title;
|
@include settings-big-title;
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,7 +6,6 @@ form {
|
||||||
}
|
}
|
||||||
|
|
||||||
.radio-label {
|
.radio-label {
|
||||||
font-size: 15px;
|
|
||||||
font-weight: $font-bold;
|
font-weight: $font-bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -20,7 +20,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.results-header {
|
.results-header {
|
||||||
font-size: 16px;
|
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
border-bottom: 1px solid #DADADA;
|
border-bottom: 1px solid #DADADA;
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.alert {
|
|
||||||
font-size: 16px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.signup-disabled {
|
.signup-disabled {
|
||||||
padding-top: 30vh;
|
padding-top: 30vh;
|
||||||
}
|
}
|
||||||
|
@ -15,10 +10,6 @@
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.register-content {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
my-instance-about-accordion {
|
my-instance-about-accordion {
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.caption-file {
|
.caption-file {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
width: max-content;
|
width: max-content;
|
||||||
|
|
|
@ -1,12 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label,
|
|
||||||
my-dynamic-form-field ::ng-deep label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.peertube-select-container {
|
.peertube-select-container {
|
||||||
@include peertube-select-container(auto);
|
@include peertube-select-container(auto);
|
||||||
}
|
}
|
||||||
|
@ -37,10 +31,6 @@ my-peertube-checkbox {
|
||||||
@include peertube-input-text(100%);
|
@include peertube-input-text(100%);
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-tags + span {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.captions-header {
|
.captions-header {
|
||||||
|
@ -71,7 +61,6 @@ my-peertube-checkbox {
|
||||||
.caption-entry-label {
|
.caption-entry-label {
|
||||||
@include margin-right(20px);
|
@include margin-right(20px);
|
||||||
|
|
||||||
font-size: 15px;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
width: 150px;
|
width: 150px;
|
||||||
}
|
}
|
||||||
|
@ -100,7 +89,6 @@ my-peertube-checkbox {
|
||||||
|
|
||||||
.no-caption {
|
.no-caption {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.submit-container {
|
.submit-container {
|
||||||
|
@ -111,7 +99,6 @@ my-peertube-checkbox {
|
||||||
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
color: pvar(--greyForegroundColor);
|
color: pvar(--greyForegroundColor);
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -10,7 +10,6 @@ $nav-link-height: 40px;
|
||||||
.upload-message {
|
.upload-message {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.root-comment {
|
.root-comment {
|
||||||
font-size: 15px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
|
|
|
@ -7,7 +7,6 @@
|
||||||
|
|
||||||
.view-replies {
|
.view-replies {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
font-size: 15px;
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -33,10 +32,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#dropdown-sort-comments {
|
#dropdown-sort-comments {
|
||||||
font-weight: 600;
|
font-weight: $font-semibold;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
border: 0;
|
border: 0;
|
||||||
transform: translateY(-7%);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 600px) {
|
@media screen and (max-width: 600px) {
|
||||||
|
|
|
@ -7,7 +7,6 @@
|
||||||
|
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
font-size: 15px;
|
|
||||||
|
|
||||||
.video-info-description-html {
|
.video-info-description-html {
|
||||||
@include peertube-word-wrap;
|
@include peertube-word-wrap;
|
||||||
|
|
|
@ -112,7 +112,6 @@ $video-height: 66vh;
|
||||||
margin-top: 50px;
|
margin-top: 50px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-bottom {
|
.video-bottom {
|
||||||
|
@ -158,12 +157,11 @@ $video-height: 66vh;
|
||||||
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
align-self: start;
|
align-self: start;
|
||||||
font-size: 1em;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-info-channel {
|
.video-info-channel {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
font-size: 15px;
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@include disable-default-a-behaviour;
|
@include disable-default-a-behaviour;
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
|
|
||||||
<div class="section videos" *ngFor="let object of overview.categories">
|
<div class="section videos" *ngFor="let object of overview.categories">
|
||||||
<h1 class="section-title">
|
<h1 class="section-title">
|
||||||
<a routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a>
|
<a class="link-orange" routerLink="/search" [queryParams]="{ categoryOneOf: [ object.category.id ] }">{{ object.category.label }}</a>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
|
<div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
|
||||||
|
@ -21,7 +21,7 @@
|
||||||
|
|
||||||
<div class="section videos" *ngFor="let object of overview.tags">
|
<div class="section videos" *ngFor="let object of overview.tags">
|
||||||
<h2 class="section-title">
|
<h2 class="section-title">
|
||||||
<a routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a>
|
<a class="link-orange" routerLink="/search" [queryParams]="{ tagsOneOf: [ object.tag ] }">#{{ object.tag }}</a>
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
|
<div class="video-wrapper" *ngFor="let video of buildVideos(object.videos)">
|
||||||
|
@ -32,7 +32,7 @@
|
||||||
|
|
||||||
<div class="section channel videos" *ngFor="let object of overview.channels">
|
<div class="section channel videos" *ngFor="let object of overview.channels">
|
||||||
<div class="section-title">
|
<div class="section-title">
|
||||||
<a [routerLink]="[ '/c', buildVideoChannelBy(object) ]">
|
<a class="link-orange" [routerLink]="[ '/c', buildVideoChannelBy(object) ]">
|
||||||
<my-actor-avatar [channel]="buildVideoChannel(object)" size="28"></my-actor-avatar>
|
<my-actor-avatar [channel]="buildVideoChannel(object)" size="28"></my-actor-avatar>
|
||||||
|
|
||||||
<h2 class="section-title">{{ object.channel.displayName }}</h2>
|
<h2 class="section-title">{{ object.channel.displayName }}</h2>
|
||||||
|
|
|
@ -13,7 +13,7 @@
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
&:first-child {
|
&:first-child {
|
||||||
padding-top: 30px;
|
padding-top: 15px;
|
||||||
|
|
||||||
.section-title {
|
.section-title {
|
||||||
border-top: 0 !important;
|
border-top: 0 !important;
|
||||||
|
@ -22,66 +22,27 @@
|
||||||
|
|
||||||
.section-title {
|
.section-title {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
font-weight: $font-semibold;
|
padding-top: 20px;
|
||||||
padding-top: 15px;
|
margin-bottom: 30px;
|
||||||
margin-bottom: 15px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
&:not(h2) {
|
&:not(h2) {
|
||||||
border-top: 1px solid $separator-border-color;
|
border-top: 1px solid $separator-border-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a > h2 {
|
||||||
color: pvar(--mainForegroundColor);
|
margin-bottom: 0;
|
||||||
|
display: inline-block;
|
||||||
&:hover,
|
font-weight: $font-bold;
|
||||||
&:focus:not(.focus-visible),
|
|
||||||
&:active {
|
|
||||||
text-decoration: none;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
&.channel {
|
my-actor-avatar {
|
||||||
.section-title {
|
@include margin-right(8px);
|
||||||
a {
|
|
||||||
display: flex;
|
|
||||||
width: fit-content;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
my-actor-avatar {
|
position: relative;
|
||||||
@include margin-right(8px);
|
top: -2px;
|
||||||
|
|
||||||
font-size: initial;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.followers {
|
|
||||||
@include margin-left(10px);
|
|
||||||
|
|
||||||
color: pvar(--greyForegroundColor);
|
|
||||||
font-weight: normal;
|
|
||||||
font-size: 14px;
|
|
||||||
position: relative;
|
|
||||||
top: 2px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.show-more {
|
|
||||||
position: relative;
|
|
||||||
top: -5px;
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 16px;
|
|
||||||
text-transform: uppercase;
|
|
||||||
color: pvar(--greyForegroundColor);
|
|
||||||
margin-bottom: 10px;
|
|
||||||
font-weight: $font-semibold;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: $mobile-view) {
|
@media screen and (max-width: $mobile-view) {
|
||||||
max-height: initial;
|
max-height: initial;
|
||||||
overflow: initial;
|
overflow: initial;
|
||||||
|
|
|
@ -103,14 +103,4 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::ng-deep {
|
|
||||||
p {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -18,7 +18,6 @@
|
||||||
|
|
||||||
a {
|
a {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 16px;
|
|
||||||
margin: 15px;
|
margin: 15px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -16,7 +16,6 @@ $footer-links-base-opacity: .8;
|
||||||
|
|
||||||
color: pvar(--menuForegroundColor);
|
color: pvar(--menuForegroundColor);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 16px;
|
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
transition: background-color .1s ease-in-out;
|
transition: background-color .1s ease-in-out;
|
||||||
|
@ -195,7 +194,6 @@ my-actor-avatar {
|
||||||
.logged-in-display-name {
|
.logged-in-display-name {
|
||||||
@include disable-default-a-behaviour;
|
@include disable-default-a-behaviour;
|
||||||
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
color: pvar(--menuForegroundColor);
|
color: pvar(--menuForegroundColor);
|
||||||
}
|
}
|
||||||
|
@ -319,7 +317,7 @@ my-actor-avatar {
|
||||||
color: pvar(--menuForegroundColor);
|
color: pvar(--menuForegroundColor);
|
||||||
opacity: $footer-links-base-opacity;
|
opacity: $footer-links-base-opacity;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: 90%;
|
font-size: 0.75rem;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
line-height: 1.4rem;
|
line-height: 1.4rem;
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
|
|
||||||
.modal-body {
|
.modal-body {
|
||||||
font-size: 15px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -24,7 +23,6 @@
|
||||||
.subtitle {
|
.subtitle {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
font-size: 16px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
|
|
|
@ -1,10 +1,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
|
|
||||||
.modal-body {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.two-columns {
|
.two-columns {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -26,7 +22,6 @@
|
||||||
.subtitle {
|
.subtitle {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
font-size: 16px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.block-documentation {
|
.block-documentation {
|
||||||
|
@ -63,7 +58,6 @@ li {
|
||||||
}
|
}
|
||||||
|
|
||||||
.link-title {
|
.link-title {
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
|
@ -1,10 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.modal-body {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
padding: 0 13px;
|
padding: 0 13px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
|
|
||||||
.modal-body {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
li {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
|
|
||||||
.modal-body {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
li {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,7 +25,6 @@ textarea {
|
||||||
|
|
||||||
.no-messages {
|
.no-messages {
|
||||||
display: flex;
|
display: flex;
|
||||||
font-size: 15px;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -45,10 +44,6 @@ textarea {
|
||||||
color: var(--mainForegroundColor);
|
color: var(--mainForegroundColor);
|
||||||
background-color: var(--greyBackgroundColor);
|
background-color: var(--greyBackgroundColor);
|
||||||
|
|
||||||
.content {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.date {
|
.date {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--greyForegroundColor);
|
color: var(--greyForegroundColor);
|
||||||
|
|
|
@ -30,7 +30,6 @@ my-actor-avatar {
|
||||||
}
|
}
|
||||||
|
|
||||||
.actor-info-followers {
|
.actor-info-followers {
|
||||||
font-size: 15px;
|
|
||||||
padding-bottom: .5rem;
|
padding-bottom: .5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<ng-template #img>
|
<ng-template #img>
|
||||||
<img *ngIf="previewImage || avatarUrl || !initial" [class]="getClass('avatar')" [src]="previewImage || avatarUrl || defaultAvatarUrl" [alt]="alt" />
|
<img *ngIf="previewImage || avatarUrl || !initial" [class]="classes" [src]="previewImage || avatarUrl || defaultAvatarUrl" [alt]="alt" />
|
||||||
|
|
||||||
<div *ngIf="!avatarUrl && initial" [ngClass]="getClass('initial')">
|
<div *ngIf="!avatarUrl && initial" [ngClass]="classes">
|
||||||
<span>{{ initial }}</span>
|
<span>{{ initial }}</span>
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Component, Input } from '@angular/core'
|
import { Component, Input, OnChanges } from '@angular/core'
|
||||||
import { VideoChannel } from '../shared-main'
|
import { VideoChannel } from '../shared-main'
|
||||||
import { Account } from '../shared-main/account/account.model'
|
import { Account } from '../shared-main/account/account.model'
|
||||||
|
|
||||||
|
@ -15,7 +15,7 @@ export type ActorAvatarSize = '18' | '25' | '28' | '32' | '34' | '35' | '36' | '
|
||||||
styleUrls: [ './actor-avatar.component.scss' ],
|
styleUrls: [ './actor-avatar.component.scss' ],
|
||||||
templateUrl: './actor-avatar.component.html'
|
templateUrl: './actor-avatar.component.html'
|
||||||
})
|
})
|
||||||
export class ActorAvatarComponent {
|
export class ActorAvatarComponent implements OnChanges {
|
||||||
private _title: string
|
private _title: string
|
||||||
|
|
||||||
@Input() account: ActorInput
|
@Input() account: ActorInput
|
||||||
|
@ -42,6 +42,8 @@ export class ActorAvatarComponent {
|
||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
|
|
||||||
|
classes: string[] = []
|
||||||
|
|
||||||
get alt () {
|
get alt () {
|
||||||
if (this.account) return $localize`Account avatar`
|
if (this.account) return $localize`Account avatar`
|
||||||
if (this.channel) return $localize`Channel avatar`
|
if (this.channel) return $localize`Channel avatar`
|
||||||
|
@ -68,20 +70,18 @@ export class ActorAvatarComponent {
|
||||||
return name.slice(0, 1)
|
return name.slice(0, 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
getClass (type: 'avatar' | 'initial') {
|
ngOnChanges () {
|
||||||
const base = [ 'avatar' ]
|
this.classes = [ 'avatar' ]
|
||||||
|
|
||||||
if (this.size) base.push(`avatar-${this.size}`)
|
if (this.size) this.classes.push(`avatar-${this.size}`)
|
||||||
|
|
||||||
if (this.channel) base.push('channel')
|
if (this.channel) this.classes.push('channel')
|
||||||
else base.push('account')
|
else this.classes.push('account')
|
||||||
|
|
||||||
if (type === 'initial' && this.initial) {
|
if (!this.avatarUrl && this.initial) {
|
||||||
base.push('initial')
|
this.classes.push('initial')
|
||||||
base.push(this.getColorTheme())
|
this.classes.push(this.getColorTheme())
|
||||||
}
|
}
|
||||||
|
|
||||||
return base
|
|
||||||
}
|
}
|
||||||
|
|
||||||
hasActor () {
|
hasActor () {
|
||||||
|
|
|
@ -9,8 +9,6 @@ input {
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
@include button-with-icon(18px);
|
@include button-with-icon(18px);
|
||||||
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.copy-text {
|
.copy-text {
|
||||||
|
|
|
@ -102,7 +102,6 @@ $input-border-radius: 3px;
|
||||||
min-height: 75px;
|
min-height: 75px;
|
||||||
padding: $base-padding;
|
padding: $base-padding;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
font-size: 15px;
|
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -34,9 +34,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ms-4 d-flex flex-column">
|
<div class="ms-4 d-flex flex-column">
|
||||||
<small class="wrapper mt-2 muted">
|
<div class="wrapper form-group-description">
|
||||||
<ng-content select="description"></ng-content>
|
<ng-content select="description"></ng-content>
|
||||||
</small>
|
</div>
|
||||||
|
|
||||||
<span class="wrapper mt-3">
|
<span class="wrapper mt-3">
|
||||||
<ng-content select="extra"></ng-content>
|
<ng-content select="extra"></ng-content>
|
||||||
|
|
|
@ -6,12 +6,7 @@
|
||||||
|
|
||||||
label {
|
label {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
font-size: $form-input-font-size;
|
||||||
|
|
||||||
.label-text {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
input {
|
||||||
@include peertube-checkbox(1px);
|
@include peertube-checkbox(1px);
|
||||||
|
@ -23,12 +18,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
my-help {
|
my-help {
|
||||||
position: relative;
|
line-height: 17px;
|
||||||
top: 2px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
small {
|
.form-group-description {
|
||||||
font-size: 90%;
|
margin-top: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrapper:empty {
|
.wrapper:empty {
|
||||||
|
|
|
@ -4,7 +4,6 @@
|
||||||
p-inputmask {
|
p-inputmask {
|
||||||
::ng-deep input {
|
::ng-deep input {
|
||||||
width: 80px;
|
width: 80px;
|
||||||
font-size: 15px;
|
|
||||||
|
|
||||||
&:focus-within,
|
&:focus-within,
|
||||||
&:focus {
|
&:focus {
|
||||||
|
|
|
@ -3,4 +3,9 @@
|
||||||
width: inherit;
|
width: inherit;
|
||||||
height: inherit;
|
height: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.feather-flag {
|
||||||
|
margin-left: -1px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -12,6 +12,5 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.block {
|
.block {
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -33,7 +33,6 @@ table {
|
||||||
|
|
||||||
caption {
|
caption {
|
||||||
caption-side: top;
|
caption-side: top;
|
||||||
font-size: 15px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
}
|
}
|
||||||
|
|
|
@ -39,7 +39,7 @@
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<h6
|
<h6
|
||||||
*ngIf="!action.linkBuilder && action.isHeader" [ngClass]="{ 'with-icon': !!action.iconName }"
|
*ngIf="!action.linkBuilder && action.isHeader && areActionsDisplayed(actions, entry)" [ngClass]="{ 'with-icon': !!action.iconName }"
|
||||||
class="dropdown-header" tabindex="0" role="button" [title]="action.title || ''" (click)="action.handler(entry)" (keyup.enter)="action.handler(entry)"
|
class="dropdown-header" tabindex="0" role="button" [title]="action.title || ''" (click)="action.handler(entry)" (keyup.enter)="action.handler(entry)"
|
||||||
>
|
>
|
||||||
<ng-container *ngTemplateOutlet="templateActionLabel; context:{ $implicit: action }"></ng-container>
|
<ng-container *ngTemplateOutlet="templateActionLabel; context:{ $implicit: action }"></ng-container>
|
||||||
|
|
|
@ -48,7 +48,7 @@ export class ActionDropdownComponent<T> {
|
||||||
return actions.some(a => {
|
return actions.some(a => {
|
||||||
if (Array.isArray(a)) return this.areActionsDisplayed(a, entry)
|
if (Array.isArray(a)) return this.areActionsDisplayed(a, entry)
|
||||||
|
|
||||||
return a.isDisplayed === undefined || a.isDisplayed(entry)
|
return a.isHeader !== true && (a.isDisplayed === undefined || a.isDisplayed(entry))
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<span *ngIf="!routerLink" class="action-button" [ngClass]="getClasses()" [ngbTooltip]="title" tabindex="0">
|
<div *ngIf="!routerLink" class="action-button" [ngClass]="classes" [ngbTooltip]="title" tabindex="0">
|
||||||
<ng-container *ngTemplateOutlet="content"></ng-container>
|
<ng-container *ngTemplateOutlet="content"></ng-container>
|
||||||
</span>
|
</div>
|
||||||
|
|
||||||
<a *ngIf="routerLink" class="action-button" [ngClass]="getClasses()" [ngbTooltip]="title" [routerLink]="routerLink">
|
<a *ngIf="routerLink" class="action-button" [ngClass]="classes" [ngbTooltip]="title" [routerLink]="routerLink">
|
||||||
<ng-container *ngTemplateOutlet="content"></ng-container>
|
<ng-container *ngTemplateOutlet="content"></ng-container>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
|
|
|
@ -16,7 +16,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
:host {
|
:host {
|
||||||
outline: none;
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Component, Input } from '@angular/core'
|
import { Component, Input, OnChanges } from '@angular/core'
|
||||||
import { GlobalIconName } from '@app/shared/shared-icons'
|
import { GlobalIconName } from '@app/shared/shared-icons'
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -7,7 +7,7 @@ import { GlobalIconName } from '@app/shared/shared-icons'
|
||||||
templateUrl: './button.component.html'
|
templateUrl: './button.component.html'
|
||||||
})
|
})
|
||||||
|
|
||||||
export class ButtonComponent {
|
export class ButtonComponent implements OnChanges {
|
||||||
@Input() label = ''
|
@Input() label = ''
|
||||||
@Input() className = 'grey-button'
|
@Input() className = 'grey-button'
|
||||||
@Input() icon: GlobalIconName = undefined
|
@Input() icon: GlobalIconName = undefined
|
||||||
|
@ -17,8 +17,10 @@ export class ButtonComponent {
|
||||||
@Input() disabled = false
|
@Input() disabled = false
|
||||||
@Input() responsiveLabel = false
|
@Input() responsiveLabel = false
|
||||||
|
|
||||||
getClasses () {
|
classes: { [id: string]: boolean } = {}
|
||||||
return {
|
|
||||||
|
ngOnChanges () {
|
||||||
|
this.classes = {
|
||||||
[this.className]: true,
|
[this.className]: true,
|
||||||
disabled: this.disabled,
|
disabled: this.disabled,
|
||||||
'icon-only': !this.label,
|
'icon-only': !this.label,
|
||||||
|
|
|
@ -25,10 +25,6 @@ export class EditButtonComponent implements OnInit {
|
||||||
// <my-edit-button label /> Use default label
|
// <my-edit-button label /> Use default label
|
||||||
if (this.label === '') {
|
if (this.label === '') {
|
||||||
this.label = $localize`Update`
|
this.label = $localize`Update`
|
||||||
|
|
||||||
if (!this.title) {
|
|
||||||
this.title = this.label
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,28 +5,24 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
my-global-icon {
|
my-global-icon {
|
||||||
width: 32px;
|
@include apply-svg-color(pvar(--mainColor));
|
||||||
align-self: flex-start;
|
|
||||||
|
|
||||||
::ng-deep {
|
width: 32px;
|
||||||
svg {
|
align-self: flex-start;
|
||||||
fill: #0c5460;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
+ div {
|
+ div {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
a.channels-settings-link {
|
|
||||||
@include peertube-button-link;
|
|
||||||
@include grey-button;
|
|
||||||
|
|
||||||
height: fit-content;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.channels-settings-link {
|
||||||
|
@include peertube-button-link;
|
||||||
|
@include grey-button;
|
||||||
|
|
||||||
|
height: fit-content;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
|
@ -1,13 +1,7 @@
|
||||||
<div class="root">
|
<div class="root">
|
||||||
<div class="input-group has-clear">
|
<div class="input-group has-clear">
|
||||||
<input
|
<input #ref type="text" class="last-in-group"
|
||||||
#ref
|
[(ngModel)]="value" (keyup.enter)="sendSearch()" [hidden]="!inputShown" [name]="name" [placeholder]="placeholder"
|
||||||
type="text"
|
|
||||||
[(ngModel)]="value"
|
|
||||||
(keyup.enter)="sendSearch()"
|
|
||||||
[hidden]="!inputShown"
|
|
||||||
[name]="name"
|
|
||||||
[placeholder]="placeholder"
|
|
||||||
>
|
>
|
||||||
|
|
||||||
<my-global-icon iconName="cross" role="button" class="form-control-clear" title="Clear filter" i18n-title (click)="onResetFilter()"></my-global-icon>
|
<my-global-icon iconName="cross" role="button" class="form-control-clear" title="Clear filter" i18n-title (click)="onResetFilter()"></my-global-icon>
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-quota {
|
.user-quota {
|
||||||
label {
|
label {
|
||||||
@include margin-right(5px);
|
@include margin-right(5px);
|
||||||
|
|
|
@ -48,7 +48,7 @@
|
||||||
|
|
||||||
<ng-template pTemplate="emptymessage">
|
<ng-template pTemplate="emptymessage">
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="6">
|
<td colspan="3">
|
||||||
<div class="no-results">
|
<div class="no-results">
|
||||||
<ng-container *ngIf="search" i18n>No account found matching current filters.</ng-container>
|
<ng-container *ngIf="search" i18n>No account found matching current filters.</ng-container>
|
||||||
<ng-container *ngIf="!search" i18n>No account found.</ng-container>
|
<ng-container *ngIf="!search" i18n>No account found.</ng-container>
|
||||||
|
|
|
@ -50,7 +50,7 @@
|
||||||
|
|
||||||
<ng-template pTemplate="emptymessage">
|
<ng-template pTemplate="emptymessage">
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="6">
|
<td colspan="3">
|
||||||
<div class="no-results">
|
<div class="no-results">
|
||||||
<ng-container *ngIf="search" i18n>No server found matching current filters.</ng-container>
|
<ng-container *ngIf="search" i18n>No server found matching current filters.</ng-container>
|
||||||
<ng-container *ngIf="!search" i18n>No server found.</ng-container>
|
<ng-container *ngIf="!search" i18n>No server found.</ng-container>
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
.description {
|
.description {
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -6,6 +6,5 @@ textarea {
|
||||||
}
|
}
|
||||||
|
|
||||||
.live-info {
|
.live-info {
|
||||||
font-size: 15px;
|
|
||||||
margin: 40px 0 20px;
|
margin: 40px 0 20px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -34,6 +34,10 @@ my-input-text {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.alert-private {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.filters {
|
.filters {
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
|
|
||||||
|
@ -46,7 +50,6 @@ my-input-text {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type=submit] {
|
input[type=submit] {
|
||||||
@include peertube-button;
|
@include peertube-button;
|
||||||
@include orange-button;
|
@include orange-button;
|
||||||
|
|
|
@ -42,7 +42,7 @@
|
||||||
i18n-labelText labelText="Help share videos being played"
|
i18n-labelText labelText="Help share videos being played"
|
||||||
>
|
>
|
||||||
<ng-container ngProjectAs="description">
|
<ng-container ngProjectAs="description">
|
||||||
<span i18n>The <a routerLink="/about/peertube" fragment="privacy" target="_blank">sharing system</a> implies that some technical information about your system (such as a public IP address) can be sent to other peers, but greatly helps to reduce server load.</span>
|
<span i18n>The <a class="link-orange" routerLink="/about/peertube" fragment="privacy" target="_blank">sharing system</a> implies that some technical information about your system (such as a public IP address) can be sent to other peers, but greatly helps to reduce server load.</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</my-peertube-checkbox>
|
</my-peertube-checkbox>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,11 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
label {
|
|
||||||
font-weight: $font-regular;
|
|
||||||
font-size: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type=submit] {
|
input[type=submit] {
|
||||||
@include peertube-button;
|
@include peertube-button;
|
||||||
@include orange-button;
|
@include orange-button;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<div
|
<div
|
||||||
class="btn-group-subscribe btn-group"
|
class="btn-group-subscribe btn-group" role="group"
|
||||||
[ngClass]="{'subscribe-button': !isAllChannelsSubscribed, 'unsubscribe-button': isAllChannelsSubscribed, 'big': isBigButton }"
|
[ngClass]="{'subscribe-button': !isAllChannelsSubscribed, 'unsubscribe-button': isAllChannelsSubscribed, 'big': isBigButton }"
|
||||||
>
|
>
|
||||||
|
|
||||||
|
@ -20,17 +20,11 @@
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
||||||
<ng-template #userLoggedIn>
|
<ng-template #userLoggedIn>
|
||||||
<button
|
<button *ngIf="!isAllChannelsSubscribed" type="button" class="btn" (click)="subscribe()">
|
||||||
*ngIf="!isAllChannelsSubscribed" type="button"
|
|
||||||
class="btn btn-sm" (click)="subscribe()"
|
|
||||||
>
|
|
||||||
<ng-template [ngTemplateOutlet]="userLoggedOut"></ng-template>
|
<ng-template [ngTemplateOutlet]="userLoggedOut"></ng-template>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<button
|
<button *ngIf="isAllChannelsSubscribed" type="button" class="btn" role="button" (click)="unsubscribe()">
|
||||||
*ngIf="isAllChannelsSubscribed" type="button"
|
|
||||||
class="btn btn-sm" role="button"
|
|
||||||
(click)="unsubscribe()">
|
|
||||||
<ng-container i18n>{account + "", select, undefined {Unsubscribe} other {Unsubscribe from all channels}}</ng-container>
|
<ng-container i18n>{account + "", select, undefined {Unsubscribe} other {Unsubscribe from all channels}}</ng-container>
|
||||||
</button>
|
</button>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
@ -43,7 +37,7 @@
|
||||||
class="btn-group" ngbDropdown autoClose="outside" placement="bottom-right bottom-left bottom auto"
|
class="btn-group" ngbDropdown autoClose="outside" placement="bottom-right bottom-left bottom auto"
|
||||||
role="group" aria-label="Multiple ways to subscribe to the current channel" i18n-aria-label
|
role="group" aria-label="Multiple ways to subscribe to the current channel" i18n-aria-label
|
||||||
>
|
>
|
||||||
<button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle aria-label="Open subscription dropdown" i18n-aria-label>
|
<button class="btn dropdown-toggle-split" ngbDropdownToggle aria-label="Open subscription dropdown" i18n-aria-label>
|
||||||
<ng-container
|
<ng-container
|
||||||
*ngIf="!isUserLoggedIn(); then userLoggedOut">
|
*ngIf="!isUserLoggedIn(); then userLoggedOut">
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
|
@ -3,14 +3,10 @@
|
||||||
|
|
||||||
.btn-group-subscribe {
|
.btn-group-subscribe {
|
||||||
@include peertube-button;
|
@include peertube-button;
|
||||||
@include disable-default-a-behaviour;
|
|
||||||
|
|
||||||
float: right;
|
button.dropdown-toggle {
|
||||||
padding: 0;
|
font-size: $button-font-size;
|
||||||
|
line-height: 1.2;
|
||||||
> .btn,
|
|
||||||
> .dropdown > .dropdown-toggle {
|
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(.big) {
|
&:not(.big) {
|
||||||
|
@ -38,7 +34,7 @@
|
||||||
|
|
||||||
// Unlogged
|
// Unlogged
|
||||||
> .dropdown > .dropdown-toggle span {
|
> .dropdown > .dropdown-toggle span {
|
||||||
@include padding-right(3px);
|
@include padding-right(5px);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Logged
|
// Logged
|
||||||
|
@ -65,9 +61,11 @@
|
||||||
@include padding-left(5px);
|
@include padding-left(5px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.unsubscribe-button {
|
&.unsubscribe-button {
|
||||||
.btn {
|
.btn {
|
||||||
@include grey-button;
|
@include grey-button;
|
||||||
|
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -10,7 +10,6 @@
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
font-size: 16px;
|
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,6 @@
|
||||||
|
|
||||||
.root {
|
.root {
|
||||||
margin-bottom: 45px;
|
margin-bottom: 45px;
|
||||||
font-size: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.first-row {
|
.first-row {
|
||||||
|
@ -49,7 +48,6 @@
|
||||||
|
|
||||||
border-radius: 24px;
|
border-radius: 24px;
|
||||||
padding: 4px 15px;
|
padding: 4px 15px;
|
||||||
font-size: 16px;
|
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,6 +4,10 @@
|
||||||
|
|
||||||
$more-button-width: 40px;
|
$more-button-width: 40px;
|
||||||
|
|
||||||
|
.video-miniature {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
.video-miniature-name {
|
.video-miniature-name {
|
||||||
@include miniature-name;
|
@include miniature-name;
|
||||||
}
|
}
|
||||||
|
|
|
@ -54,9 +54,9 @@ $margin-top: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.date-title {
|
.date-title {
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
font-size: 1rem;
|
||||||
|
|
||||||
// Make the element span a full grid row within .videos grid
|
// Make the element span a full grid row within .videos grid
|
||||||
grid-column: 1 / -1;
|
grid-column: 1 / -1;
|
||||||
|
|
|
@ -30,12 +30,10 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="optional-rows" *ngIf="playlist.optionalRowDisplayed">
|
<div class="optional-rows" *ngIf="playlist.optionalRowDisplayed">
|
||||||
<div class="labels">
|
<div class="header-label" i18n>Start at</div>
|
||||||
<div i18n>Start at</div>
|
<div class="header-label" i18n>Stop at</div>
|
||||||
<div i18n>Stop at</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngFor="let element of buildOptionalRowElements(playlist)">
|
<ng-container *ngFor="let element of buildOptionalRowElements(playlist)">
|
||||||
<my-peertube-checkbox
|
<my-peertube-checkbox
|
||||||
[inputName]="getOptionalInputName(playlist, element)"
|
[inputName]="getOptionalInputName(playlist, element)"
|
||||||
[ngModel]="element.enabled" [onPushWorkaround]="true"
|
[ngModel]="element.enabled" [onPushWorkaround]="true"
|
||||||
|
@ -55,7 +53,7 @@
|
||||||
(inputBlur)="onElementTimestampUpdate(playlist, element)"
|
(inputBlur)="onElementTimestampUpdate(playlist, element)"
|
||||||
#stopAt
|
#stopAt
|
||||||
></my-timestamp-input>
|
></my-timestamp-input>
|
||||||
</div>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,10 +1,6 @@
|
||||||
@use '_variables' as *;
|
@use '_variables' as *;
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
$optional-rows-checkbox-width: 34px;
|
|
||||||
$timestamp-width: 50px;
|
|
||||||
$timestamp-margin-right: 10px;
|
|
||||||
|
|
||||||
.header,
|
.header,
|
||||||
.dropdown-item,
|
.dropdown-item,
|
||||||
.input-container {
|
.input-container {
|
||||||
|
@ -52,12 +48,12 @@ $timestamp-margin-right: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.primary-row,
|
.primary-row {
|
||||||
.optional-rows > div {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
my-peertube-checkbox {
|
my-peertube-checkbox {
|
||||||
@include margin-right(10px);
|
@include margin-right(10px);
|
||||||
|
|
||||||
align-self: center;
|
align-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -84,41 +80,30 @@ $timestamp-margin-right: 10px;
|
||||||
height: 19px;
|
height: 19px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
my-timestamp-input {
|
|
||||||
@include margin-right($timestamp-margin-right);
|
|
||||||
|
|
||||||
::ng-deep .ui-inputtext {
|
|
||||||
padding: 0;
|
|
||||||
width: $timestamp-width;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.optional-rows {
|
.optional-rows {
|
||||||
> div {
|
display: grid;
|
||||||
padding: 8px 5px 5px 10px;
|
grid-template-columns: 35px 80px 80px;
|
||||||
}
|
row-gap: 3px;
|
||||||
|
column-gap: 10px;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
my-peertube-checkbox {
|
my-peertube-checkbox {
|
||||||
@include margin-right(0 !important);
|
@include margin-left(auto);
|
||||||
|
|
||||||
display: block;
|
|
||||||
width: $optional-rows-checkbox-width;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.labels {
|
.header-label {
|
||||||
@include margin-left($optional-rows-checkbox-width);
|
|
||||||
|
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: pvar(--greyForegroundColor);
|
color: pvar(--greyForegroundColor);
|
||||||
padding-top: 5px;
|
padding-left: 2px;
|
||||||
padding-bottom: 0;
|
|
||||||
|
|
||||||
div {
|
&:nth-child(1) {
|
||||||
@include margin-right($timestamp-margin-right);
|
grid-column: 2;
|
||||||
|
}
|
||||||
|
|
||||||
width: $timestamp-width;
|
&:nth-child(2) {
|
||||||
|
grid-column: 3;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -75,40 +75,6 @@ my-video-thumbnail,
|
||||||
left: -2px;
|
left: -2px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-info {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-self: flex-start;
|
|
||||||
min-width: 0;
|
|
||||||
|
|
||||||
.video-info-header {
|
|
||||||
display: flex;
|
|
||||||
align-items: baseline;
|
|
||||||
|
|
||||||
a {
|
|
||||||
width: auto;
|
|
||||||
padding-right: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pt-badge {
|
|
||||||
@include margin-right(5px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-info-account,
|
|
||||||
.video-info-timestamp {
|
|
||||||
color: pvar(--greyForegroundColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-info-name {
|
|
||||||
@include ellipsis;
|
|
||||||
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: $font-semibold;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.more,
|
.more,
|
||||||
|
@ -139,6 +105,45 @@ my-video-thumbnail,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.video-info-name {
|
||||||
|
@include ellipsis;
|
||||||
|
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: $font-semibold;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.video-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-self: flex-start;
|
||||||
|
min-width: 0;
|
||||||
|
|
||||||
|
.video-info-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
|
||||||
|
a {
|
||||||
|
width: auto;
|
||||||
|
padding-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pt-badge {
|
||||||
|
@include margin-right(5px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.video-info-account,
|
||||||
|
.video-info-timestamp {
|
||||||
|
color: pvar(--greyForegroundColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.video-info-account,
|
||||||
|
.video-miniature-created-at-views {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
.dropdown-menu {
|
.dropdown-menu {
|
||||||
|
|
||||||
.dropdown-item {
|
.dropdown-item {
|
||||||
|
|
|
@ -53,7 +53,7 @@
|
||||||
|
|
||||||
.privacy-date {
|
.privacy-date {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
font-size: 13px;
|
font-size: 14px;
|
||||||
|
|
||||||
.privacy {
|
.privacy {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-external-link"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3"/></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-external-link"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3"/></svg>
|
||||||
|
|
Before Width: | Height: | Size: 293 B After Width: | Height: | Size: 314 B |
|
@ -1 +1 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><path d="M0,0h24v24H0V0z" fill="none"/></g><g><g><rect height="3" width="2" x="11" y="19"/><rect height="2" width="3" x="2" y="11"/><rect height="2" width="3" x="19" y="11"/><rect height="3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.6665 17.8014)" width="1.99" x="16.66" y="16.66"/><rect height="1.99" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.9791 9.8041)" width="3" x="4.85" y="17.16"/><path d="M15,8.02V3H9v5.02C7.79,8.94,7,10.37,7,12c0,2.76,2.24,5,5,5s5-2.24,5-5C17,10.37,16.21,8.94,15,8.02z M11,5h2v2.1 C12.68,7.04,12.34,7,12,7s-0.68,0.04-1,0.1V5z"/></g></g></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor" class="misc"><g><path d="M0,0h24v24H0V0z" fill="none"/></g><g><g><rect height="3" width="2" x="11" y="19"/><rect height="2" width="3" x="2" y="11"/><rect height="2" width="3" x="19" y="11"/><rect height="3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.6665 17.8014)" width="1.99" x="16.66" y="16.66"/><rect height="1.99" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.9791 9.8041)" width="3" x="4.85" y="17.16"/><path d="M15,8.02V3H9v5.02C7.79,8.94,7,10.37,7,12c0,2.76,2.24,5,5,5s5-2.24,5-5C17,10.37,16.21,8.94,15,8.02z M11,5h2v2.1 C12.68,7.04,12.34,7,12,7s-0.68,0.04-1,0.1V5z"/></g></g></svg>
|
||||||
|
|
Before Width: | Height: | Size: 726 B After Width: | Height: | Size: 744 B |
|
@ -64,7 +64,7 @@ body {
|
||||||
font-weight: $font-regular;
|
font-weight: $font-regular;
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
background-color: pvar(--mainBackgroundColor);
|
background-color: pvar(--mainBackgroundColor);
|
||||||
font-size: 14px;
|
font-size: 1rem;
|
||||||
// On desktop browsers, make sure vertical scroll bar is always visible
|
// On desktop browsers, make sure vertical scroll bar is always visible
|
||||||
// Allow to disable the scrollbar instead of hide it when the content fit the body
|
// Allow to disable the scrollbar instead of hide it when the content fit the body
|
||||||
// And not move the content and header horizontally sticked to right when the content is updating
|
// And not move the content and header horizontally sticked to right when the content is updating
|
||||||
|
@ -114,7 +114,6 @@ button {
|
||||||
|
|
||||||
label {
|
label {
|
||||||
font-weight: $font-bold;
|
font-weight: $font-bold;
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -200,10 +199,13 @@ table {
|
||||||
}
|
}
|
||||||
|
|
||||||
my-global-icon[iconName=external-link] {
|
my-global-icon[iconName=external-link] {
|
||||||
margin: 0 3px;
|
margin: 0 0.3em;
|
||||||
width: 13px;
|
width: 0.9em;
|
||||||
vertical-align: text-bottom;
|
height: 0.9em;
|
||||||
|
display: inline-block;
|
||||||
color: pvar(--inputPlaceholderColor);
|
color: pvar(--inputPlaceholderColor);
|
||||||
|
position: relative;
|
||||||
|
top: -0.1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: #{breakpoint(xxl)}) {
|
@media screen and (max-width: #{breakpoint(xxl)}) {
|
||||||
|
|
|
@ -42,7 +42,6 @@
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
.dropdown-menu {
|
.dropdown-menu {
|
||||||
font-size: 15px;
|
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
background-color: pvar(--mainBackgroundColor);
|
background-color: pvar(--mainBackgroundColor);
|
||||||
|
|
||||||
|
@ -73,6 +72,16 @@
|
||||||
margin: 0.3rem 0;
|
margin: 0.3rem 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ---------------------------------------------------------------------------
|
||||||
|
// Alert
|
||||||
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
|
.alert {
|
||||||
|
p:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// Modal
|
// Modal
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
@ -115,18 +124,10 @@
|
||||||
my-global-icon {
|
my-global-icon {
|
||||||
@include icon(22px);
|
@include icon(22px);
|
||||||
|
|
||||||
position: relative;
|
|
||||||
top: 5px;
|
|
||||||
float: right;
|
|
||||||
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
|
||||||
&[iconName=cross] { /* stylelint-disable-line selector-max-compound-selectors */
|
&:hover {
|
||||||
@include icon(16px);
|
opacity: 0.8;
|
||||||
|
|
||||||
top: -3px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -165,8 +166,6 @@
|
||||||
opacity: 0.75;
|
opacity: 0.75;
|
||||||
content: '';
|
content: '';
|
||||||
display: block;
|
display: block;
|
||||||
position: fixed;
|
|
||||||
z-index: z(overlay);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -254,6 +253,11 @@
|
||||||
// Buttons & form controls
|
// Buttons & form controls
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
|
.btn:not(.btn-sm) {
|
||||||
|
font-size: $button-font-size;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
.btn-outline-secondary {
|
.btn-outline-secondary {
|
||||||
border-color: $input-border-color;
|
border-color: $input-border-color;
|
||||||
|
|
||||||
|
@ -294,7 +298,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-control {
|
.form-control {
|
||||||
font-size: 15px;
|
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
background-color: pvar(--inputBackgroundColor);
|
background-color: pvar(--inputBackgroundColor);
|
||||||
outline: none;
|
outline: none;
|
||||||
|
@ -317,7 +320,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
> .input-group-text {
|
> .input-group-text {
|
||||||
font-size: 15px;
|
|
||||||
line-height: normal;
|
line-height: normal;
|
||||||
opacity: 0.9;
|
opacity: 0.9;
|
||||||
}
|
}
|
||||||
|
@ -333,8 +335,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.has-clear {
|
.has-clear {
|
||||||
position: relative;
|
|
||||||
|
|
||||||
input {
|
input {
|
||||||
@include padding-right(1.5rem !important);
|
@include padding-right(1.5rem !important);
|
||||||
}
|
}
|
||||||
|
@ -344,10 +344,10 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: absolute;
|
|
||||||
right: .5rem;
|
|
||||||
height: 95%;
|
height: 95%;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
position: absolute;
|
||||||
|
right: .5rem;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: rgba(0, 0, 0, 0.7);
|
color: rgba(0, 0, 0, 0.7);
|
||||||
|
|
|
@ -6,7 +6,9 @@
|
||||||
.link-orange {
|
.link-orange {
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
font-weight: $font-bold;
|
font-weight: $font-bold;
|
||||||
border-bottom: 0.20em solid pvar(--mainColor);
|
border-bottom: 0.19em solid pvar(--mainColor);
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 1.2;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
|
@ -16,7 +18,7 @@
|
||||||
|
|
||||||
.underline-orange {
|
.underline-orange {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
border-bottom: 0.20em solid pvar(--mainColor);
|
border-bottom: 0.19em solid pvar(--mainColor);
|
||||||
}
|
}
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
@ -84,7 +86,7 @@
|
||||||
.form-group-description {
|
.form-group-description {
|
||||||
@extend .muted !optional;
|
@extend .muted !optional;
|
||||||
|
|
||||||
font-size: 90%;
|
font-size: 14px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -102,7 +104,6 @@ label + .form-group-description {
|
||||||
|
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
font-size: 16px;
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
border-bottom: 2px solid transparent;
|
border-bottom: 2px solid transparent;
|
||||||
|
@ -149,7 +150,7 @@ label + .form-group-description {
|
||||||
.title-page-about,
|
.title-page-about,
|
||||||
.title-page-settings {
|
.title-page-settings {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: 115%;
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-sub-header {
|
.admin-sub-header {
|
||||||
|
@ -172,7 +173,6 @@ label + .form-group-description {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 16px;
|
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -246,10 +246,6 @@ label + .form-group-description {
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
.alert {
|
.alert {
|
||||||
p:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.pt-alert-primary {
|
&.pt-alert-primary {
|
||||||
background-color: pvar(--mainColorVeryLight);
|
background-color: pvar(--mainColorVeryLight);
|
||||||
border: 2px solid pvar(--mainColorLightest);
|
border: 2px solid pvar(--mainColorLightest);
|
||||||
|
|
|
@ -36,18 +36,16 @@
|
||||||
.actor-owner {
|
.actor-owner {
|
||||||
@include disable-default-a-behaviour;
|
@include disable-default-a-behaviour;
|
||||||
|
|
||||||
font-size: 13px;
|
|
||||||
color: pvar(--mainForegroundColor);
|
color: pvar(--mainForegroundColor);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
span:hover {
|
span:hover {
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
my-actor-avatar {
|
my-actor-avatar {
|
||||||
@include margin-left(7px);
|
@include margin-left(5px);
|
||||||
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue