smaller miniature average size in fluid grid, updated admin instructions for global search

This commit is contained in:
Rigel Kent 2020-06-10 21:09:31 +02:00
parent 1bab226f5c
commit d840487fed
No known key found for this signature in database
GPG Key ID: 5E53E96A494E452F
3 changed files with 52 additions and 36 deletions

View File

@ -342,7 +342,7 @@
<div class="form-group">
<my-peertube-checkbox
inputName="signupEnabled" formControlName="enabled"
i18n-labelText labelText="Signup enabled"
i18n-labelText labelText="Enable Signup"
>
<ng-container ngProjectAs="description">
<span i18n>⚠️ This functionality requires a lot of attention and extra moderation.</span>
@ -461,7 +461,7 @@
i18n-labelText labelText="Allow users to do remote URI/handle search"
>
<ng-container ngProjectAs="description">
<span i18n>Add ability for <strong>your users</strong> to fetch remote videos/actors by their URI, that may not be federated with your instance</span>
<span i18n>Allow <strong>your users</strong> to look up remote videos/actors by their URI, that may not be federated with your instance</span>
</ng-container>
</my-peertube-checkbox>
</div>
@ -472,7 +472,7 @@
i18n-labelText labelText="Allow anonymous to do remote URI/handle search"
>
<ng-container ngProjectAs="description">
<span i18n>Add ability for <strong>anonymous</strong> to fetch remote videos/actors by their URI, that may not be federated with your instance</span>
<span i18n>Allow <strong>anonymous users</strong> to look up remote videos/actors by their URI, that may not be federated with your instance</span>
</ng-container>
</my-peertube-checkbox>
</div>
@ -483,39 +483,46 @@
<div class="form-group">
<my-peertube-checkbox
inputName="searchIndexEnabled" formControlName="enabled"
i18n-labelText labelText="Enable search index"
i18n-labelText labelText="Enable global search"
>
<ng-container ngProjectAs="description">
<p i18n>⚠️ This functionality depends heavily on the moderation of instances followed by the search index you select.</p>
<ng-container ngProjectAs="extra">
<div [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }">
<label i18n for="searchIndexUrl">Search index URL</label>
<input
type="text" id="searchIndexUrl" class="form-control"
formControlName="url" [ngClass]="{ 'input-error': formErrors['search.searchIndex.url'] }"
>
<div *ngIf="formErrors.search.searchIndex.url" class="form-error">{{ formErrors.search.searchIndex.url }}</div>
</div>
<span i18n>
You should only use search indexes you trust, or <a href="https://framagit.org/framasoft/peertube/search-index">host your own</a>.
</span>
</ng-container>
<div class="mt-3">
<my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
inputName="searchIndexDisableLocalSearch" formControlName="disableLocalSearch"
i18n-labelText labelText="Disable local search"
></my-peertube-checkbox>
</div>
<ng-container ngProjectAs="extra">
<div [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }">
<label i18n for="searchIndexUrl">Search index URL</label>
<input
type="text" id="searchIndexUrl" class="form-control"
formControlName="url" [ngClass]="{ 'input-error': formErrors['search.searchIndex.url'] }"
>
<div *ngIf="formErrors.search.searchIndex.url" class="form-error">{{ formErrors.search.searchIndex.url }}</div>
</div>
<div class="mt-3">
<my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
inputName="searchIndexIsDefaultSearch" formControlName="isDefaultSearch"
i18n-labelText labelText="Set search index as default"
>
<ng-container ngProjectAs="description">
<span i18n>The local search is used by default</span>
</ng-container>
</my-peertube-checkbox>
</div>
<div class="mt-3">
<my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
inputName="searchIndexDisableLocalSearch" formControlName="disableLocalSearch"
i18n-labelText labelText="Disable local search in search bar"
></my-peertube-checkbox>
</div>
</ng-container>
</my-peertube-checkbox>
<div class="mt-3">
<my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
inputName="searchIndexIsDefaultSearch" formControlName="isDefaultSearch"
i18n-labelText labelText="Search bar uses the global search index by default"
>
<ng-container ngProjectAs="description">
<span i18n>Otherwise the local search stays used by default</span>
</ng-container>
</my-peertube-checkbox>
</div>
</ng-container>
</my-peertube-checkbox>
</div>
</ng-container>

View File

@ -4,18 +4,20 @@
@import '_miniature';
.videos {
$column-width: #{$video-thumbnail-width - 25px};
display: grid;
column-gap: calc(10px + .2%);
grid-template-columns: repeat(
auto-fill,
minmax(
var(--miniature-min-width, #{$video-thumbnail-width}),
var(--miniature-min-width, #{$column-width}),
1fr
)
);
@media screen and (min-width: #{breakpoint(xxl)}) {
--miniature-min-width: 300px;
@media screen and (min-width: #{breakpoint(fhd)}) {
--miniature-min-width: #{$column-width + 100px};
}
}
@ -61,12 +63,13 @@
font-weight: $font-semibold;
margin-bottom: 20px;
margin-top: -10px;
padding-top: 20px;
// make the element span a full grid row within .videos grid
grid-column: 1 / -1;
&:not(:first-child) {
margin-top: .5rem;
padding-top: 20px;
border-top: 1px solid $separator-border-color;
}
}

View File

@ -4,6 +4,7 @@ $modal-footer-border-width: 0;
$modal-md: 600px;
$grid-breakpoints: (
// CLASSIC BREAKPOINTS GROUP
// Extra small screen / phone
xs: 0,
// Small screen / phone
@ -14,7 +15,12 @@ $grid-breakpoints: (
lg: 900px,
// Extra large screens / wide desktops
xl: 1200px,
xxl: 1600px
xxl: 1600px,
// SCREEN GROUP
fhd: 1920px,
qhd: 2560px,
uhd: 3840px
);
@function breakpoint($label) {