# Webpack loaders, order matters
styleLoaders:
- - style
- - css
- - sass
+ - style-loader
+ - css-loader
+ - sass-loader
# Extract styles to stand-alone css file
# Different settings for different environments can be used,
progress-bars: true
media: true
list-group: false
- panels: false
+ panels: true
wells: false
responsive-embed: true
close: true
{
test: /\.(sass|scss)$/,
- use: ['css-to-string-loader', 'css-loader?sourceMap', 'resolve-url-loader', 'sass-loader?sourceMap'],
- exclude: [ helpers.root('src', 'styles') ]
+ use: [
+ 'css-to-string-loader',
+ 'css-loader?sourceMap',
+ 'resolve-url-loader',
+ {
+ loader: 'sass-loader',
+ options: {
+ sourceMap: true
+ }
+ },
+ {
+ loader: 'sass-resources-loader',
+ options: {
+ resources: [
+ helpers.root('src/sass/_variables.scss')
+ ]
+ }
+ }
+ ]
},
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' },
{
test: /\.html$/,
loader: 'raw-loader',
- exclude: [ helpers.root('src/index.html'), helpers.root('src/standalone/videos/embed.html') ]
+ exclude: [
+ helpers.root('src/index.html'),
+ helpers.root('src/standalone/videos/embed.html')
+ ]
}
]
new LoaderOptionsPlugin({
options: {
sassLoader: {
- precision: 10
+ precision: 10,
+ includePaths: [ helpers.root('src/sass') ]
}
}
}),
module: {
- rules: [
- {
- test: /\.ts$/,
- use: [
- {
- loader: 'tslint-loader',
- options: {
- configFile: 'tslint.json'
- }
- }
- ],
- exclude: [
- /\.(spec|e2e)\.ts$/,
- /node_modules\//
- ]
- }
- ]
+ // Too slow, life is short
+ // rules: [
+ // {
+ // test: /\.ts$/,
+ // use: [
+ // {
+ // loader: 'tslint-loader',
+ // options: {
+ // configFile: 'tslint.json'
+ // }
+ // }
+ // ],
+ // exclude: [
+ // /\.(spec|e2e)\.ts$/,
+ // /node_modules\//
+ // ]
+ // }
+ // ]
},
plugins: [
tslint: {
emitErrors: false,
failOnHint: false,
+ typeCheck: true,
resourcePath: 'src'
},
},
"license": "GPLv3",
"dependencies": {
- "@angular/animations": "^4.0.2",
+ "@angular/animations": "~4.0.0",
"@angular/common": "~4.0.0",
"@angular/compiler": "~4.0.0",
- "@angular/compiler-cli": "^4.0.0",
+ "@angular/compiler-cli": "~4.0.0",
"@angular/core": "~4.0.0",
"@angular/forms": "~4.0.0",
"@angular/http": "~4.0.0",
"assets-webpack-plugin": "^3.4.0",
"awesome-typescript-loader": "3.0.0-beta.18",
"bootstrap": "^3.3.6",
- "bootstrap-loader": "2.0.0-beta.18",
+ "bootstrap-loader": "2.0.0",
"bootstrap-sass": "^3.3.6",
"copy-webpack-plugin": "^4.0.0",
"core-js": "^2.4.1",
- "css-loader": "^0.25.0",
+ "css-loader": "^0.28.0",
"css-to-string-loader": "^0.1.2",
"es6-shim": "^0.35.0",
- "file-loader": "^0.9.0",
+ "file-loader": "^0.11.0",
"html-webpack-plugin": "^2.19.0",
"ie-shim": "^0.1.0",
"intl": "^1.2.4",
"ng2-file-upload": "^1.1.4-2",
"ng2-smart-table": "1.0.3",
"ng2-tag-input": "^1.0.5",
- "ngc-webpack": "1.1.0",
+ "ngc-webpack": "2.0.0",
"ngx-bootstrap": "1.6.6",
"node-sass": "^4.1.1",
"normalize.css": "^5.0.0",
"reflect-metadata": "^0.1.9",
"resolve-url-loader": "^1.6.0",
"rxjs": "~5.0.0-rc.5",
- "sass-loader": "^4.0.2",
+ "sass-loader": "^6.0.3",
+ "sass-resources-loader": "^1.2.1",
"script-ext-html-webpack-plugin": "^1.3.2",
- "source-map-loader": "^0.1.5",
+ "source-map-loader": "^0.2.1",
"string-replace-loader": "^1.0.3",
- "style-loader": "^0.13.1",
+ "style-loader": "^0.16.1",
"tslib": "^1.5.0",
"tslint": "~4.3.1",
"tslint-loader": "^3.3.0",
"videojs-dock": "^2.0.2",
"webpack": "^2.2.0",
"webpack-md5-hash": "0.0.5",
- "webpack-merge": "~2.3.1",
+ "webpack-merge": "~4.1.0",
"webpack-notifier": "^1.3.0",
"webtorrent": "^0.98.0",
- "zone.js": "~0.7.2"
+ "zone.js": "~0.8.5"
},
"devDependencies": {
"add-asset-html-webpack-plugin": "^1.0.2",
- "codelyzer": "^2.0.0",
+ "codelyzer": "^3.0.0-beta.4",
"standard": "^10.0.0",
"webpack-bundle-analyzer": "^2.2.1",
"webpack-dll-bundles-plugin": "^1.0.0-beta.5"
<ng2-smart-table [settings]="tableSettings" [source]="friendsSource"></ng2-smart-table>
-<a *ngIf="hasFriends()" class="add-user btn btn-danger pull-left" (click)="quitFriends()">
+<a *ngIf="hasFriends()" class="btn btn-danger pull-left" (click)="quitFriends()">
Quit friends
</a>
-<a *ngIf="!hasFriends()" class="add-user btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
+<a *ngIf="!hasFriends()" class="btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
Make friends
</a>
-table {
- margin-bottom: 40px;
+.btn {
+ margin-top: 10px;
}
<h3>Requests stats</h3>
-<div *ngFor="let requestSchedulerName of statsTitles | keys">
- <div class="block" *ngIf="stats[requestSchedulerName] !== null">
- <h4>{{ statsTitles[requestSchedulerName] }}</h4>
+<div *ngFor="let requestSchedulerName of statsTitles | keys" class="col-lg-4 col-md-12">
+ <div class="panel panel-default" *ngIf="stats[requestSchedulerName] !== null">
+ <div class="panel-heading">{{ statsTitles[requestSchedulerName] }}</div>
- <div class="requests-general">
- <div>
- <span class="label-description">Remaining requests:</span>
- {{ stats[requestSchedulerName].totalRequests }}
- </div>
+ <div class="panel-body">
+ <div class="requests-general">
+ <div>
+ <span class="label-description">Remaining requests:</span>
+ {{ stats[requestSchedulerName].totalRequests }}
+ </div>
- <div>
- <span class="label-description">Interval seconds between requests:</span>
- {{ stats[requestSchedulerName].secondsInterval }}
- </div>
+ <span class="label-description">Interval seconds between requests:</span>
+ {{ stats[requestSchedulerName].secondsInterval }}
+ </div>
- <div>
- <span class="label-description">Remaining time before the scheduled request:</span>
- {{ stats[requestSchedulerName].remainingSeconds }}
+ <div>
+ <span class="label-description">Remaining time before the scheduled request:</span>
+ {{ stats[requestSchedulerName].remainingSeconds }}
+ </div>
</div>
- </div>
- <div class="requests-limit">
- <div>
- <span class="label-description">Maximum number of different pods for a scheduled request:</span>
- {{ stats[requestSchedulerName].requestsLimitPods }}
- </div>
+
<div class="requests-limit">
+ <span class="label-description">Maximum number of different pods for a scheduled request:</span>
+ {{ stats[requestSchedulerName].requestsLimitPods }}
+ </div>
- <div>
- <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
- {{ stats[requestSchedulerName].requestsLimitPerPod }}
+ <div>
+ <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
+ {{ stats[requestSchedulerName].requestsLimitPerPod }}
+ </div>
</div>
</div>
-
</div>
</div>
-.block {
- margin-bottom: 40px;
-}
-
.label-description {
- display: inline-block;
font-weight: bold;
color: black;
}
-.requests-general {
- .label-description {
- width: 320px;
- }
-}
-
.requests-limit {
margin-top: 20px;
-
- .label-description {
- width: 430px;
- }
}
<h3>Account</h3>
-<div class="block">
- <h4>Change password</h4>
- <my-account-change-password></my-account-change-password>
+<div class="panel panel-default">
+ <div class="panel-heading">Change password</div>
+
+ <div class="panel-body">
+ <my-account-change-password></my-account-change-password>
+ </div>
</div>
-<div class="block">
- <h4>Update my informations</h4>
- <my-account-details [user]="user"></my-account-details>
+<div class="panel panel-default">
+ <div class="panel-heading">Update my informations</div>
+
+ <div class="panel-body">
+ <my-account-details [user]="user"></my-account-details>
+ </div>
</div>
-.block {
+.panel {
margin-top: 40px;
}
-<div class="container">
-
- <header class="row">
- <div class="col-md-2">
- <h4 id="peertube-title">
+<div class="container-fluid">
+ <div class="row">
+ <div class="col-md-2 col-sm-3 col-xs-3 title-menu-left">
+ <h4 id="peertube-title" class="title-menu-left-block header">
<a [routerLink]="['/videos/list']">PeerTube</a>
</h4>
- </div>
- <div class="col-md-9">
- <my-search></my-search>
+ <div class="title-menu-left-block menu">
+ <my-menu *ngIf="isInAdmin() === false"></my-menu>
+ <my-menu-admin *ngIf="isInAdmin() === true"></my-menu-admin>
+ </div>
</div>
- </header>
+ <div class="col-md-10 col-sm-9 col-xs-9 main-col">
+ <div class="header">
+ <my-search></my-search>
+ </div>
- <div class="row">
- <my-menu *ngIf="isInAdmin() === false"></my-menu>
- <my-menu-admin *ngIf="isInAdmin() === true"></my-menu-admin>
-
- <div class="col-md-9 col-sm-8 col-xs-8 router-outlet-container">
- <router-outlet></router-outlet>
+ <div class="main-row">
+ <router-outlet></router-outlet>
+ </div>
</div>
</div>
- <simple-notifications [options]="notificationOptions"></simple-notifications>
- <my-confirm></my-confirm>
-
<footer>
PeerTube, CopyLeft 2015-2017
</footer>
</div>
+
+<my-confirm></my-confirm>
+<simple-notifications [options]="notificationOptions"></simple-notifications>
-#peertube-title a {
- color: inherit !important;
-
- &:hover {
- color: inherit !important;
- text-decoration: none !important;
- }
-}
-
-header div {
- line-height: 25px;
- margin-bottom: 30px;
-}
-
-.router-outlet-container {
- @media screen and (max-width: 400px) {
- padding: 0 3px 0 3px;
- }
-}
-
-[hidden] {
- display: none !important;
-}
-<menu class="col-md-2 col-sm-3 col-xs-3">
+<menu>
<div class="panel-block">
- <div id="panel-users" class="panel-button">
+ <a routerLink="/admin/users/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-user"></span>
- <a [routerLink]="['/admin/users/list']">List users</a>
- </div>
+ List users
+ </a>
- <div id="panel-friends" class="panel-button">
+ <a routerLink="/admin/friends/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cloud"></span>
- <a [routerLink]="['/admin/friends/list']">List friends</a>
- </div>
+ List friends
+ </a>
- <div id="panel-request-stats" class="panel-button">
+ <a routerLink="/admin/requests/stats" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-stats"></span>
- <a [routerLink]="['/admin/requests/stats']">Request stats</a>
- </div>
+ Request stats
+ </a>
- <div id="panel-video-abuses" class="panel-button">
+ <a routerLink="/admin/video-abuses/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-alert"></span>
- <a [routerLink]="['/admin/video-abuses/list']">Video abuses</a>
- </div>
+ Video abuses
+ </a>
</div>
<div class="panel-block">
- <div id="panel-quit-administration" class="panel-button">
+ <a routerLink="/videos/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cog"></span>
- <a [routerLink]="['/videos/list']">Quit admin.</a>
- </div>
+ Quit admin.
+ </a>
</div>
</menu>
--- /dev/null
+menu {
+ background-color: $black-background;
+ padding: 20px;
+ margin: 0;
+ height: 100%;
+
+ a {
+ display: block;
+ height: 30px;
+ color: #9cabb8;
+ cursor: pointer;
+
+ &:hover, &:focus {
+ text-decoration: none !important;
+ outline: none !important;
+ }
+
+ .glyphicon {
+ margin-right: 20px;
+ }
+
+ &:hover, &.active {
+ color: #fff;
+ }
+ }
+}
@Component({
selector: 'my-menu-admin',
- templateUrl: './menu-admin.component.html'
+ templateUrl: './menu-admin.component.html',
+ styleUrls: [ './menu-admin.component.scss' ]
})
export class MenuAdminComponent { }
-<menu class="col-md-2 col-sm-3 col-xs-3">
+<menu>
<div class="panel-block">
<div id="panel-user-login" class="panel-button">
- <span *ngIf="!isLoggedIn" >
+ <a *ngIf="!isLoggedIn" routerLink="/login" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-log-in"></span>
- <a [routerLink]="['/login']">Login</a>
- </span>
+ Login
+ </a>
- <span *ngIf="isLoggedIn">
+ <a *ngIf="isLoggedIn" (click)="logout()">
<span class="hidden-xs glyphicon glyphicon-log-out"></span>
- <a *ngIf="isLoggedIn" (click)="logout()">Logout</a>
- </span>
+ Logout
+ </a>
</div>
- <div *ngIf="!isLoggedIn && isRegistrationEnabled()" id="panel-user-register" class="panel-button">
+ <a *ngIf="!isLoggedIn && isRegistrationEnabled()" routerLink="/signup" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-user"></span>
- <a [routerLink]="['/signup']">Signup</a>
- </div>
+ Signup
+ </a>
- <div *ngIf="isLoggedIn" id="panel-user-account" class="panel-button">
+ <a *ngIf="isLoggedIn" routerLink="/account" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-user"></span>
- <a [routerLink]="['/account']">My account</a>
- </div>
+ My account
+ </a>
</div>
<div class="panel-block">
- <div id="panel-get-videos" class="panel-button">
+ <a routerLink="/videos/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-list"></span>
- <a [routerLink]="['/videos/list']">See videos</a>
- </div>
+ See videos
+ </a>
- <div id="panel-upload-video" class="panel-button" *ngIf="isLoggedIn">
+ <a *ngIf="isLoggedIn" routerLink="/videos/add" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cloud-upload"></span>
- <a [routerLink]="['/videos/add']">Upload a video</a>
- </div>
+ Upload a video
+ </a>
</div>
- <div class="panel-block" *ngIf="isUserAdmin()">
- <div id="panel-get-videos" class="panel-button">
+ <div class="panel-block">
+ <a *ngIf="isUserAdmin()" routerLink="/admin" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cog"></span>
- <a [routerLink]="['/admin']">Administration</a>
- </div>
+ Administration
+ </a>
</div>
</menu>
@Component({
selector: 'my-menu',
- templateUrl: './menu.component.html'
+ templateUrl: './menu.component.html',
+ styleUrls: [ './menu-admin.component.scss' ]
})
export class MenuComponent implements OnInit {
isLoggedIn: boolean;
+
<div class="input-group">
- <div class="input-group-btn" dropdown>
+
+ <span class="input-group-addon icon-addon">
+ <span class="glyphicon glyphicon-search"></span>
+ </span>
+
+ <input
+ type="text" id="search-video" name="search-video" class="form-control" placeholder="Search" class="form-control"
+ [(ngModel)]="searchCriterias.value" (keyup.enter)="doSearch()"
+ >
+
+ <div class="input-group-btn" dropdown placement="bottom right">
<button id="simple-btn-keyboard-nav" type="button" class="btn btn-default" dropdownToggle>
{{ getStringChoice(searchCriterias.field) }} <span class="caret"></span>
</button>
- <ul class="dropdown-menu" role="menu" aria-labelledby="simple-btn-keyboard-nav" *dropdownMenu>
+ <ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="simple-btn-keyboard-nav" *dropdownMenu>
<li *ngFor="let choice of choiceKeys" class="dropdown-item" role="menu-item">
<a class="dropdown-item" href="#" (click)="choose($event, choice)">{{ getStringChoice(choice) }}</a>
</li>
</ul>
</div>
-
- <input
- type="text" id="search-video" name="search-video" class="form-control" placeholder="Search a video..." class="form-control"
- [(ngModel)]="searchCriterias.value" (keyup.enter)="doSearch()"
- >
</div>
--- /dev/null
+.icon-addon {
+ background-color: #fff;
+ border-radius: 0;
+ border-color: $header-border-color;
+ border-width: 0 0 1px 0;
+ text-align: right;
+
+ .glyphicon-search {
+ width: 30px;
+ font-size: 20px;
+ }
+}
+
+input, button, .input-group {
+ height: 100%;
+}
+
+input, .input-group-btn {
+ border-radius: 0;
+ border-top: none;
+ border-left: none;
+}
+
+input {
+ height: $header-height;
+ border-right: none;
+ font-weight: bold;
+ box-shadow: none;
+
+ &, &:focus {
+ border-bottom: 1px solid $header-border-color !important;
+ outline: none !important;
+ box-shadow: none !important;
+ }
+}
+
+button {
+
+ &, &:hover, &:focus, &:active, &:visited {
+ background-color: #fff !important;
+ border-color: $header-border-color !important;
+ color: #858585 !important;
+ outline: none !important;
+
+ height: $header-height;
+ border-width: 0 0 1px 0;
+ font-weight: bold;
+ text-decoration: none;
+ box-shadow: none;
+ }
+}
@Component({
selector: 'my-search',
- templateUrl: './search.component.html'
+ templateUrl: './search.component.html',
+ styleUrls: [ './search.component.scss' ]
})
export class SearchComponent implements OnInit {
.videos-miniatures {
min-height: 720px;
+ text-align: center;
my-video-miniature {
+ text-align: left;
transition: all 0.5s ease;
&.ng-enter {
loading: BehaviorSubject<boolean> = new BehaviorSubject(false);
pagination: RestPagination = {
currentPage: 1,
- itemsPerPage: 9,
+ itemsPerPage: 25,
totalItems: null
};
sort: SortField;
-<div class="video-miniature col-md-4 col-sm-6 col-xs-6" (mouseenter)="onHover()" (mouseleave)="onBlur()">
+<div class="video-miniature" (mouseenter)="onHover()" (mouseleave)="onBlur()">
<a
[routerLink]="['/videos/watch', video.id]" [attr.title]="video.description"
class="video-miniature-thumbnail"
NSFW
</div>
- <span class="video-miniature-duration">{{ video.duration }}</span>
+ <div class="video-miniature-thumbnail-overlay">
+ <span class="video-miniature-thumbnail-overlay-views">{{ video.views }} views</span>
+ <span class="video-miniature-thumbnail-overlay-duration">{{ video.duration }}</span>
+ </div>
</a>
+ <span
+ *ngIf="displayRemoveIcon()" (click)="removeVideo(video.id)"
+ class="video-miniature-remove glyphicon glyphicon-remove"
+ ></span>
+
<div class="video-miniature-informations">
- <span class="video-miniature-name-tags">
+ <span class="video-miniature-name">
<a [routerLink]="['/videos/watch', video.id]" [attr.title]="getVideoName()" class="video-miniature-name">{{ getVideoName() }}</a>
-
- <div class="video-miniature-tags">
- <span *ngFor="let tag of video.tags" class="video-miniature-tag">
- <a [routerLink]="['/videos/list', { field: 'tags', search: tag, sort: currentSort }]" class="label label-primary">{{ tag }}</a>
- </span>
- </div>
</span>
<a [routerLink]="['/videos/list', { field: 'author', search: video.author, sort: currentSort }]" class="video-miniature-author">{{ video.by }}</a>
@import "../../../sass/pre-customizations.scss";
.video-miniature {
- @media screen and (max-width: 400px) {
- padding: 0;
- }
-
margin-top: 30px;
display: inline-block;
position: relative;
- min-width: 220px;
height: 190px;
+ width: 220px;
.video-miniature-thumbnail {
display: inline-block;
height: 110px;
}
- .video-miniature-duration {
+ img, .thumbnail-nsfw {
+ border-radius: 3px;
+ }
+
+ .video-miniature-thumbnail-overlay {
position: absolute;
- right: 5px;
- bottom: 2px;
+ right: 0px;
+ bottom: 0px;
display: inline-block;
- background-color: rgba(0, 0, 0, 0.8);
- color: rgba(255, 255, 255, 0.8);
- padding: 2px;
+ background-color: rgba(0, 0, 0, 0.7);
+ color: #fff;
+ padding: 3px 5px;
font-size: 11px;
+ font-weight: bold;
+ width: 100%;
+
+ .video-miniature-thumbnail-overlay-views {
+
+ }
+
+ .video-miniature-thumbnail-overlay-duration {
+ float: right;
+ }
}
}
.video-miniature-informations {
width: 200px;
- .video-miniature-name-tags {
+ .video-miniature-name {
+ height: 23px;
display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-weight: bold;
+ transition: color 0.2s;
+ font-size: 15px;
+ color: $video-miniature-title-color;
- .video-miniature-name {
- height: 23px;
- display: block;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- font-weight: bold;
- transition: color 0.2s;
- font-size: 15px;
-
- &:hover {
- text-decoration: none;
- }
+ &:hover {
+ text-decoration: none;
}
.video-miniature-tags {
.video-miniature-author, .video-miniature-views-created-at {
display: block;
margin-left: 1px;
- font-size: 12px;
- color: #337ab7;
+ font-size: 11px;
+ color: $video-miniature-other-infos;
opacity: 0.9;
.video-miniature-created-at::before {
--- /dev/null
+$black-background: #1d2125;
+$grey-background: #f6f2f2;
+
+$header-height: 60px;
+$header-border-color: #e9eff6;
+
+$video-miniature-title-color: #16a2b7;
+$video-miniature-other-infos: #686767;
@import '../../node_modules/video.js/dist/video-js.css';
-body {
- padding: 20px;
+[hidden] {
+ display: none !important;
+}
- @media screen and (max-width: 400px) {
- padding: 3px;
- }
+input.readonly {
+ /* Force blank on readonly inputs */
+ background-color: #fff !important;
}
-menu {
- @media screen and (max-width: 600px) {
- margin-right: 3px !important;
- padding: 3px !important;
- min-height: 400px !important;
- }
+.form-control, .btn {
+ border-radius: 0;
+}
- min-height: 600px;
- margin-right: 20px;
- border-right: 1px solid rgba(0, 0, 0, 0.2);
+.glyphicon-black {
+ color: black;
+}
+
+.header {
+ height: $header-height;
- .panel-block:not(:last-child) {
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+ .search-col {
+ height: 100%;
+ margin-left: -15px;
+ padding: 0;
}
+}
- .panel-button {
- margin: 8px;
- cursor: pointer;
- transition: margin 0.2s;
+.main-col {
+ padding: 0;
- &:hover {
- margin-left: 15px;
+ .main-row {
+ padding: 15px 30px;
+
+ @media screen and (min-width: 1400px) {
+ padding: 15px 40px;
}
- a {
- color: #333333;
+ @media screen and (min-width: 1600px) {
+ padding: 15px 50px;
+ }
+
+ @media screen and (min-width: 1800px) {
+ padding: 15px 60px;
}
}
+}
- .glyphicon {
- margin: 5px;
+.title-menu-left {
+ height: calc(100vh - #{$header-height});
+ padding-right: 0;
+
+ .title-menu-left-block {
+ margin-left: -15px;
+
+ &.menu {
+ height: 100%;
+ }
+ }
+
+ #peertube-title {
+ background-color: #fff;
+ border-right: 2px solid $header-border-color;
+ font-size: 25px;
+ line-height: $header-height;
+ text-align: center;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ a {
+ color: inherit !important;
+
+ &:hover {
+ color: inherit !important;
+ text-decoration: none !important;
+ }
+ }
}
}
}
}
-[hidden] {
- display: none !important;
-}
-
-input.readonly {
- /* Force blank on readonly inputs */
- background-color: #fff !important;
-}
-
-.glyphicon-black {
- color: black;
-}
-
footer {
border-top: 1px solid rgba(0, 0, 0, 0.2);
padding-top: 10px;
+@import '_variables.scss';
+
$bootstrap-sass-asset-helper: false !default;
//
// Variables
"pipe-naming": [true, "camelCase", "my"],
"component-class-suffix": true,
"directive-class-suffix": true,
- "import-destructuring-spacing": true,
"templates-use-public": true,
"no-access-missing-member": true,
"invoke-injectable": true,
projects / github / Chocobozzz / PeerTube.git / commitdiff
