Refactor how we use icons

Inject them in an angular component so we can easily change their color
This commit is contained in:
Chocobozzz 2019-01-16 16:05:40 +01:00
parent 848f499def
commit 457bb213b2
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
116 changed files with 670 additions and 894 deletions

View File

@ -154,7 +154,6 @@
"videojs-contextmenu-ui": "^5.0.0",
"videojs-dock": "^2.0.2",
"videojs-hotkeys": "^0.2.21",
"webpack": "^4.17.1",
"webpack-bundle-analyzer": "^3.0.2",
"webpack-cli": "^3.0.8",
"webtorrent": "https://github.com/webtorrent/webtorrent#e9b209c7970816fc29e0cc871157a4918d66001d",

View File

@ -1,7 +1,7 @@
<ng-template #modal>
<div class="modal-header">
<h4 i18n class="modal-title">Contact {{ instanceName }} administrator</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -1,7 +1,8 @@
<ng-template #modal>
<div class="modal-header">
<h4 i18n class="modal-title">Moderation comment</h4>
<span class="close" aria-hidden="true" (click)="hideModerationCommentModal()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">
@ -19,7 +20,7 @@
</div>
<div class="form-group inputs">
<span i18n class="action-button action-button-cancel" (click)="hideModerationCommentModal()">Cancel</span>
<span i18n class="action-button action-button-cancel" (click)="hide()">Cancel</span>
<input
type="submit" i18n-value value="Update this comment" class="action-button-submit"

View File

@ -45,7 +45,7 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI
})
}
hideModerationCommentModal () {
hide () {
this.abuseToComment = undefined
this.openedModal.close()
this.form.reset()
@ -60,7 +60,7 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI
this.notifier.success(this.i18n('Comment updated.'))
this.commentUpdated.emit(moderationComment)
this.hideModerationCommentModal()
this.hide()
},
err => this.notifier.error(err.message)

View File

@ -2,7 +2,7 @@
<div i18n class="form-sub-title">Users list</div>
<a class="add-button" routerLink="/admin/users/create">
<span class="icon icon-add"></span>
<my-global-icon iconName="add"></my-global-icon>
<ng-container i18n>Create user</ng-container>
</a>
</div>

View File

@ -2,7 +2,7 @@
@import '_mixins';
.add-button {
@include create-button('../../../../assets/images/global/add.svg');
@include create-button;
}
tr.banned {
@ -23,4 +23,4 @@ tr.banned {
input {
@include peertube-input-text(250px);
}
}
}

View File

@ -65,10 +65,10 @@
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
color: #585858;
color: $grey-foreground-color;
&:hover {
color: #303030;
color: $grey-foreground-hover-color;
}
}
}

View File

@ -1,7 +1,13 @@
<div class="header">
<a routerLink="/my-account/settings" fragment="notifications" i18n>Notification preferences</a>
<a routerLink="/my-account/settings" fragment="notifications" i18n>
<my-global-icon iconName="cog"></my-global-icon>
Notification preferences
</a>
<button (click)="markAllAsRead()" i18n>Mark all as read</button>
<button (click)="markAllAsRead()" i18n>
<my-global-icon iconName="circle-tick"></my-global-icon>
Mark all as read
</button>
</div>
<my-user-notifications #userNotification></my-user-notifications>

View File

@ -5,16 +5,18 @@
display: flex;
justify-content: space-between;
font-size: 15px;
margin-bottom: 10px;
margin-bottom: 20px;
a {
@include peertube-button-link;
@include grey-button;
@include button-with-icon(18px, 3px, -1px);
}
button {
@include peertube-button;
@include grey-button;
@include button-with-icon(20px, 3px, -1px);
}
}

View File

@ -1,7 +1,8 @@
<ng-template #modal let-close="close" let-dismiss="dismiss">
<div class="modal-header">
<h4 i18n class="modal-title">Accept ownership</h4>
<span class="close" aria-label="Close" role="button" (click)="dismiss()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="dismiss()"></my-global-icon>
</div>
<div class="modal-body" [formGroup]="form">

View File

@ -1,6 +1,6 @@
<div class="video-channels-header">
<a class="create-button" routerLink="create">
<span class="icon icon-add"></span>
<my-global-icon iconName="add"></my-global-icon>
<ng-container i18n>Create another video channel</ng-container>
</a>
</div>

View File

@ -2,7 +2,7 @@
@import '_mixins';
.create-button {
@include create-button('../../../assets/images/global/add.svg');
@include create-button;
}
/deep/ .action-button {

View File

@ -32,7 +32,7 @@
</span>
<span class="action-button action-button-delete-selection" (click)="deleteSelectedVideos()">
<span class="icon icon-delete-white"></span>
<my-global-icon iconName="delete"></my-global-icon>
<ng-container i18n>Delete</ng-container>
</span>
</div>
@ -45,7 +45,7 @@
<my-button i18n-label label="Change ownership"
className="action-button-change-ownership"
icon="icon-im-with-her"
icon="im-with-her"
(click)="changeOwnership($event, video)"
></my-button>
</div>
@ -53,4 +53,4 @@
</div>
</div>
<my-video-change-ownership #videoChangeOwnershipModal></my-video-change-ownership>
<my-video-change-ownership #videoChangeOwnershipModal></my-video-change-ownership>

View File

@ -23,14 +23,11 @@
.action-button-delete-selection {
@include peertube-button;
@include orange-button;
}
@include button-with-icon(21px);
.icon.icon-delete-white {
@include icon(21px);
position: relative;
top: -2px;
background-image: url('../../../assets/images/global/delete-white.svg');
my-global-icon {
@include apply-svg-color(#fff);
}
}
}
}

View File

@ -1,7 +1,8 @@
<ng-template #modal let-close="close" let-dismiss="dismiss">
<div class="modal-header">
<h4 i18n class="modal-title">Change ownership</h4>
<span class="close" aria-label="Close" role="button" (click)="dismiss()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="dismiss()"></my-global-icon>
</div>
<div class="modal-body" [formGroup]="form">

View File

@ -37,7 +37,9 @@
</div>
<ngx-loading-bar [includeSpinner]="false"></ngx-loading-bar>
<my-confirm></my-confirm>
<p-toast position="bottom-right">
<ng-template let-message pTemplate="message">
<div class="notification-block">

View File

@ -1,2 +1 @@
export * from './confirm.component'
export * from './confirm.service'

View File

@ -8,7 +8,7 @@ import { LoadingBarHttpClientModule } from '@ngx-loading-bar/http-client'
import { LoadingBarRouterModule } from '@ngx-loading-bar/router'
import { AuthService } from './auth'
import { ConfirmComponent, ConfirmService } from './confirm'
import { ConfirmService } from './confirm'
import { throwIfAlreadyLoaded } from './module-import-guard'
import { LoginGuard, RedirectService, UserRightGuard } from './routing'
import { ServerService } from './server'
@ -38,7 +38,6 @@ import { UserNotificationSocket } from '@app/core/notification/user-notification
],
declarations: [
ConfirmComponent,
CheatSheetComponent
],
@ -48,7 +47,6 @@ import { UserNotificationSocket } from '@app/core/notification/user-notification
ToastModule,
ConfirmComponent,
CheatSheetComponent
],

View File

@ -5,6 +5,6 @@
<span (click)="doSearch()" class="icon icon-search"></span>
<a class="upload-button" routerLink="/videos/upload">
<span class="icon icon-upload"></span>
<my-global-icon iconName="upload"></my-global-icon>
<span i18n class="upload-button-label">Upload</span>
</a>

View File

@ -40,6 +40,7 @@
.upload-button {
@include peertube-button-link;
@include orange-button;
@include button-with-icon(22px, 3px, -1px);
margin-right: 25px;
@ -47,15 +48,6 @@
margin-right: 0;
}
.icon.icon-upload {
@include icon(22px);
background-image: url('../../assets/images/header/upload-white.svg');
height: 24px;
vertical-align: middle;
margin-right: 6px;
}
@media screen and (max-width: 600px) {
margin-right: 10px;
padding: 0 10px;

View File

@ -55,7 +55,8 @@
<ng-template #forgotPasswordModal>
<div class="modal-header">
<h4 i18n class="modal-title">Forgot your password</h4>
<span class="close" aria-hidden="true" (click)="hideForgotPasswordModal()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hideForgotPasswordModal()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -42,7 +42,7 @@
justify-content: center;
font-weight: $font-semibold;
color: var(--mainForegroundColor);
height: 30px;
padding: 7px 0;
}
}
}

View File

@ -1,7 +1,7 @@
<ng-template #modal let-hide="close">
<div class="modal-header">
<h4 i18n class="modal-title">Change the language</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>

View File

@ -87,10 +87,10 @@
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
color: #585858;
color: $grey-foreground-color;
&:hover {
color: #303030;
color: $grey-foreground-hover-color;
}
}
}

View File

@ -16,7 +16,7 @@ export abstract class Actor implements ActorServer {
avatarUrl: string
static GET_ACTOR_AVATAR_URL (actor: { avatar: Avatar }) {
static GET_ACTOR_AVATAR_URL (actor: { avatar?: { path: string } }) {
const absoluteAPIUrl = getAbsoluteAPIUrl()
if (actor && actor.avatar) return absoluteAPIUrl + actor.avatar.path

View File

@ -3,7 +3,7 @@
class="action-button" [ngClass]="{ small: buttonSize === 'small', grey: theme === 'grey', orange: theme === 'orange' }"
ngbDropdownToggle role="button"
>
<span *ngIf="!label" class="icon icon-action"></span>
<my-global-icon *ngIf="!label" class="more-icon" iconName="more"></my-global-icon>
<span *ngIf="label" class="dropdown-toggle">{{ label }}</span>
</div>

View File

@ -24,14 +24,11 @@
}
&:hover, &:active, &:focus {
background-color: $grey-color;
background-color: $grey-background-color;
}
.icon-action {
@include icon(21px);
background-image: url('../../../assets/images/video/more.svg');
top: -1px;
.more-icon {
width: 21px;
}
&.small {

View File

@ -1,4 +1,4 @@
<span class="action-button" [ngClass]="className" [title]="getTitle()">
<span class="icon" [ngClass]="icon"></span>
<my-global-icon [iconName]="icon"></my-global-icon>
<span class="button-label">{{ label }}</span>
</span>

View File

@ -3,41 +3,19 @@
.action-button {
@include peertube-button-link;
@include button-with-icon(21px, 0, -2px);
font-size: 15px;
font-weight: $font-semibold;
color: #585858;
background-color: #E5E5E5;
color: $grey-foreground-color;
background-color: $grey-background-color;
&:hover {
background-color: #EFEFEF;
background-color: $grey-background-hover-color;
}
.icon {
@include icon(21px);
position: relative;
top: -2px;
&.icon-edit {
background-image: url('../../../assets/images/global/edit-grey.svg');
}
&.icon-delete-grey {
background-image: url('../../../assets/images/global/delete-grey.svg');
}
&.icon-im-with-her {
background-image: url('../../../assets/images/global/im-with-her.svg');
}
&.icon-tick {
background-image: url('../../../assets/images/global/tick.svg');
}
&.icon-cross {
background-image: url('../../../assets/images/global/cross.svg');
}
my-global-icon {
@include apply-svg-color($grey-foreground-color);
}
}

View File

@ -1,4 +1,5 @@
import { Component, Input } from '@angular/core'
import { GlobalIconName } from '@app/shared/icons/global-icon.component'
@Component({
selector: 'my-button',
@ -9,7 +10,7 @@ import { Component, Input } from '@angular/core'
export class ButtonComponent {
@Input() label = ''
@Input() className: string = undefined
@Input() icon: string = undefined
@Input() icon: GlobalIconName = undefined
@Input() title: string = undefined
getTitle () {

View File

@ -1,5 +1,5 @@
<span class="action-button action-button-delete" [title]="getTitle()" role="button">
<span class="icon icon-delete-grey"></span>
<my-global-icon iconName="delete"></my-global-icon>
<span class="button-label" *ngIf="label">{{ label }}</span>
<span class="button-label" i18n *ngIf="!label">Delete</span>

View File

@ -1,5 +1,5 @@
<a class="action-button action-button-edit" [routerLink]="routerLink" i18n-title title="Edit">
<span class="icon icon-edit"></span>
<my-global-icon iconName="edit"></my-global-icon>
<span class="button-label" *ngIf="label">{{ label }}</span>
<span i18n class="button-label" *ngIf="!label">Edit</span>

View File

@ -2,7 +2,8 @@
<div class="modal-header">
<h4 class="modal-title">{{ title }}</h4>
<span class="close" aria-label="Close" role="button" (click)="dismiss()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="dismiss()"></my-global-icon>
</div>
<div class="modal-body" >

View File

@ -1,5 +1,5 @@
import { Component, ElementRef, HostListener, OnInit, ViewChild } from '@angular/core'
import { ConfirmService } from './confirm.service'
import { ConfirmService } from '@app/core/confirm/confirm.service'
import { I18n } from '@ngx-translate/i18n-polyfill'
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'

View File

@ -0,0 +1,4 @@
/deep/ svg {
width: inherit;
height: inherit;
}

View File

@ -0,0 +1,47 @@
import { Component, ElementRef, Input, OnInit } from '@angular/core'
const icons = {
'add': require('../../../assets/images/global/add.html'),
'syndication': require('../../../assets/images/global/syndication.html'),
'help': require('../../../assets/images/global/help.html'),
'sparkle': require('../../../assets/images/global/sparkle.html'),
'alert': require('../../../assets/images/global/alert.html'),
'cloud-error': require('../../../assets/images/global/cloud-error.html'),
'user-add': require('../../../assets/images/global/user-add.html'),
'no': require('../../../assets/images/global/no.html'),
'cloud-download': require('../../../assets/images/global/cloud-download.html'),
'undo': require('../../../assets/images/global/undo.html'),
'circle-tick': require('../../../assets/images/global/circle-tick.html'),
'cog': require('../../../assets/images/global/cog.html'),
'download': require('../../../assets/images/global/download.html'),
'edit': require('../../../assets/images/global/edit.html'),
'im-with-her': require('../../../assets/images/global/im-with-her.html'),
'delete': require('../../../assets/images/global/delete.html'),
'cross': require('../../../assets/images/global/cross.html'),
'validate': require('../../../assets/images/global/validate.html'),
'dislike': require('../../../assets/images/video/dislike.html'),
'heart': require('../../../assets/images/video/heart.html'),
'like': require('../../../assets/images/video/like.html'),
'more': require('../../../assets/images/video/more.html'),
'share': require('../../../assets/images/video/share.html'),
'upload': require('../../../assets/images/video/upload.html')
}
export type GlobalIconName = keyof typeof icons
@Component({
selector: 'my-global-icon',
template: '',
styleUrls: [ './global-icon.component.scss' ]
})
export class GlobalIconComponent implements OnInit {
@Input() iconName: GlobalIconName
constructor (private el: ElementRef) {}
ngOnInit () {
const nativeElement = this.el.nativeElement
nativeElement.innerHTML = icons[this.iconName]
}
}

View File

@ -25,4 +25,6 @@
[autoClose]="true"
(onHidden)="onPopoverHidden()"
(onShown)="onPopoverShown()"
></span>
>
<my-global-icon iconName="help"></my-global-icon>
</span>

View File

@ -2,13 +2,15 @@
@import '_mixins';
.help-tooltip-button {
@include icon(17px);
position: relative;
top: -2px;
background-image: url('../../../assets/images/global/help.svg');
cursor: pointer;
border: none;
margin: 5px;
my-global-icon {
width: 17px;
position: relative;
top: -2px;
margin: 5px;
}
}
/deep/ {
@ -24,8 +26,13 @@
color: #000;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
p:last-child {
margin-bottom: 0;
}
ul {
padding-left: 20px;
margin-bottom: 0;
}
}
}

View File

@ -1,7 +1,8 @@
<ng-template #modal>
<div class="modal-header">
<h4 i18n class="modal-title">Ban</h4>
<span class="close" aria-hidden="true" (click)="hideBanUserModal()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">
@ -19,7 +20,7 @@
</div>
<div class="form-group inputs">
<span i18n class="action-button action-button-cancel" (click)="hideBanUserModal()">Cancel</span>
<span i18n class="action-button action-button-cancel" (click)="hide()">Cancel</span>
<input
type="submit" i18n-value value="Ban this user" class="action-button-submit"
@ -29,4 +30,4 @@
</form>
</div>
</ng-template>
</ng-template>

View File

@ -42,7 +42,7 @@ export class UserBanModalComponent extends FormReactive implements OnInit {
this.openedModal = this.modalService.open(this.modal)
}
hideBanUserModal () {
hide () {
this.usersToBan = undefined
this.openedModal.close()
}
@ -60,7 +60,7 @@ export class UserBanModalComponent extends FormReactive implements OnInit {
this.notifier.success(message)
this.userBanned.emit(this.usersToBan)
this.hideBanUserModal()
this.hide()
},
err => this.notifier.error(err.message)

View File

@ -67,6 +67,8 @@ import { UserNotificationService } from '@app/shared/users/user-notification.ser
import { UserNotificationsComponent } from '@app/shared/users/user-notifications.component'
import { InstanceService } from '@app/shared/instance/instance.service'
import { HtmlRendererService, LinkifierService, MarkdownService } from '@app/shared/renderer'
import { ConfirmComponent } from '@app/shared/confirm/confirm.component'
import { GlobalIconComponent } from '@app/shared/icons/global-icon.component'
@NgModule({
imports: [
@ -110,7 +112,9 @@ import { HtmlRendererService, LinkifierService, MarkdownService } from '@app/sha
UserBanModalComponent,
UserModerationDropdownComponent,
TopMenuDropdownComponent,
UserNotificationsComponent
UserNotificationsComponent,
ConfirmComponent,
GlobalIconComponent
],
exports: [
@ -151,6 +155,8 @@ import { HtmlRendererService, LinkifierService, MarkdownService } from '@app/sha
UserModerationDropdownComponent,
TopMenuDropdownComponent,
UserNotificationsComponent,
ConfirmComponent,
GlobalIconComponent,
NumberFormatterPipe,
ObjectLengthPipe,

View File

@ -1,4 +1,5 @@
import { UserNotification as UserNotificationServer, UserNotificationType, VideoInfo } from '../../../../../shared'
import { UserNotification as UserNotificationServer, UserNotificationType, VideoInfo, ActorInfo } from '../../../../../shared'
import { Actor } from '@app/shared/actor/actor.model'
export class UserNotification implements UserNotificationServer {
id: number
@ -6,10 +7,7 @@ export class UserNotification implements UserNotificationServer {
read: boolean
video?: VideoInfo & {
channel: {
id: number
displayName: string
}
channel: ActorInfo & { avatarUrl?: string }
}
videoImport?: {
@ -23,10 +21,7 @@ export class UserNotification implements UserNotificationServer {
comment?: {
id: number
threadId: number
account: {
id: number
displayName: string
}
account: ActorInfo & { avatarUrl?: string }
video: VideoInfo
}
@ -40,18 +35,11 @@ export class UserNotification implements UserNotificationServer {
video: VideoInfo
}
account?: {
id: number
displayName: string
name: string
}
account?: ActorInfo & { avatarUrl?: string }
actorFollow?: {
id: number
follower: {
name: string
displayName: string
}
follower: ActorInfo & { avatarUrl?: string }
following: {
type: 'account' | 'channel'
name: string
@ -76,12 +64,22 @@ export class UserNotification implements UserNotificationServer {
this.read = hash.read
this.video = hash.video
if (this.video) this.setAvatarUrl(this.video.channel)
this.videoImport = hash.videoImport
this.comment = hash.comment
if (this.comment) this.setAvatarUrl(this.comment.account)
this.videoAbuse = hash.videoAbuse
this.videoBlacklist = hash.videoBlacklist
this.account = hash.account
if (this.account) this.setAvatarUrl(this.account)
this.actorFollow = hash.actorFollow
if (this.actorFollow) this.setAvatarUrl(this.actorFollow.follower)
this.createdAt = hash.createdAt
this.updatedAt = hash.updatedAt
@ -150,4 +148,7 @@ export class UserNotification implements UserNotificationServer {
return videoImport.targetUrl || videoImport.magnetUri || videoImport.torrentName
}
private setAvatarUrl (actor: { avatarUrl?: string, avatar?: { path: string } }) {
actor.avatarUrl = Actor.GET_ACTOR_AVATAR_URL(actor)
}
}

View File

@ -15,8 +15,6 @@ export class UserNotificationService {
static BASE_NOTIFICATIONS_URL = environment.apiUrl + '/api/v1/users/me/notifications'
static BASE_NOTIFICATION_SETTINGS = environment.apiUrl + '/api/v1/users/me/notification-settings'
private socket: SocketIOClient.Socket
constructor (
private auth: AuthService,
private authHttp: HttpClient,

View File

@ -1,61 +1,101 @@
<div *ngIf="componentPagination.totalItems === 0" class="no-notification" i18n>You don't have notifications.</div>
<div class="notifications" myInfiniteScroller [autoInit]="true" (nearOfBottom)="onNearOfBottom()">
<div *ngFor="let notification of notifications" class="notification" [ngClass]="{ unread: !notification.read }">
<div *ngFor="let notification of notifications" class="notification" [ngClass]="{ unread: !notification.read }" (click)="markAsRead(notification)">
<div [ngSwitch]="notification.type">
<ng-container [ngSwitch]="notification.type">
<ng-container i18n *ngSwitchCase="UserNotificationType.NEW_VIDEO_FROM_SUBSCRIPTION">
{{ notification.video.channel.displayName }} published a <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">new video</a>
<img alt="" aria-labelledby="avatar" class="avatar" [src]="notification.video.channel.avatarUrl" />
<div class="message">
{{ notification.video.channel.displayName }} published a <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">new video</a>
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.UNBLACKLIST_ON_MY_VIDEO">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.video.name }}</a> has been unblacklisted
<my-global-icon iconName="undo"></my-global-icon>
<div class="message">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.video.name }}</a> has been unblacklisted
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.BLACKLIST_ON_MY_VIDEO">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.videoBlacklist.video.name }}</a> has been blacklisted
<my-global-icon iconName="no"></my-global-icon>
<div class="message">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.videoBlacklist.video.name }}</a> has been blacklisted
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.NEW_VIDEO_ABUSE_FOR_MODERATORS">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoAbuseUrl">A new video abuse</a> has been created on video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.videoAbuse.video.name }}</a>
<my-global-icon iconName="alert"></my-global-icon>
<div class="message">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoAbuseUrl">A new video abuse</a> has been created on video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.videoAbuse.video.name }}</a>
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.NEW_COMMENT_ON_MY_VIDEO">
{{ notification.comment.account.displayName }} commented your video <a (click)="markAsRead(notification)" [routerLink]="notification.commentUrl">{{ notification.comment.video.name }}</a>
<img alt="" aria-labelledby="avatar" class="avatar" [src]="notification.comment.account.avatarUrl" />
<div class="message">
{{ notification.comment.account.displayName }} commented your video <a (click)="markAsRead(notification)" [routerLink]="notification.commentUrl">{{ notification.comment.video.name }}</a>
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.MY_VIDEO_PUBLISHED">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.video.name }}</a> has been published
<my-global-icon iconName="sparkle"></my-global-icon>
<div class="message">
Your video <a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">{{ notification.video.name }}</a> has been published
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.MY_VIDEO_IMPORT_SUCCESS">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">Your video import</a> {{ notification.videoImportIdentifier }} succeeded
<my-global-icon iconName="cloud-download"></my-global-icon>
<div class="message">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoUrl">Your video import</a> {{ notification.videoImportIdentifier }} succeeded
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.MY_VIDEO_IMPORT_ERROR">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoImportUrl">Your video import</a> {{ notification.videoImportIdentifier }} failed
<my-global-icon iconName="cloud-error"></my-global-icon>
<div class="message">
<a (click)="markAsRead(notification)" [routerLink]="notification.videoImportUrl">Your video import</a> {{ notification.videoImportIdentifier }} failed
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.NEW_USER_REGISTRATION">
User <a (click)="markAsRead(notification)" [routerLink]="notification.accountUrl">{{ notification.account.name }} registered</a> on your instance
<my-global-icon iconName="user-add"></my-global-icon>
<div class="message">
User <a (click)="markAsRead(notification)" [routerLink]="notification.accountUrl">{{ notification.account.name }} registered</a> on your instance
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.NEW_FOLLOW">
<a (click)="markAsRead(notification)" [routerLink]="notification.accountUrl">{{ notification.actorFollow.follower.displayName }}</a> is following
<img alt="" aria-labelledby="avatar" class="avatar" [src]="notification.actorFollow.follower.avatarUrl" />
<ng-container *ngIf="notification.actorFollow.following.type === 'channel'">
your channel {{ notification.actorFollow.following.displayName }}
</ng-container>
<ng-container *ngIf="notification.actorFollow.following.type === 'account'">your account</ng-container>
<div class="message">
<a (click)="markAsRead(notification)" [routerLink]="notification.accountUrl">{{ notification.actorFollow.follower.displayName }}</a> is following
<ng-container *ngIf="notification.actorFollow.following.type === 'channel'">your channel {{ notification.actorFollow.following.displayName }}</ng-container>
<ng-container *ngIf="notification.actorFollow.following.type === 'account'">your account</ng-container>
</div>
</ng-container>
<ng-container i18n *ngSwitchCase="UserNotificationType.COMMENT_MENTION">
{{ notification.comment.account.displayName }} mentioned you on <a (click)="markAsRead(notification)" [routerLink]="notification.commentUrl">video {{ notification.comment.video.name }}</a>
</ng-container>
</div>
<img alt="" aria-labelledby="avatar" class="avatar" [src]="notification.comment.account.avatarUrl" />
<div i18n title="Mark as read" class="mark-as-read">
<div class="glyphicon glyphicon-ok" (click)="markAsRead(notification)"></div>
</div>
<div class="message">
{{ notification.comment.account.displayName }} mentioned you on <a (click)="markAsRead(notification)" [routerLink]="notification.commentUrl">video {{ notification.comment.video.name }}</a>
</div>
</ng-container>
</ng-container>
<div class="from-date">{{ notification.createdAt | myFromNow }}</div>
</div>
</div>

View File

@ -1,3 +1,6 @@
@import '_variables';
@import '_mixins';
.no-notification {
display: flex;
justify-content: center;
@ -7,31 +10,42 @@
.notification {
display: flex;
justify-content: space-between;
align-items: center;
font-size: inherit;
padding: 15px 10px;
padding: 15px 5px 15px 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.10);
.mark-as-read {
min-width: 35px;
.glyphicon {
display: none;
cursor: pointer;
color: rgba(20, 20, 20, 0.5)
}
}
&.unread {
background-color: rgba(0, 0, 0, 0.05);
}
&:hover .mark-as-read .glyphicon {
display: block;
my-global-icon {
width: 24px;
margin-right: 11px;
margin-left: 3px;
&:hover {
color: rgba(20, 20, 20, 0.8);
}
@include apply-svg-color(#333);
}
.avatar {
@include avatar(30px);
margin-right: 10px;
}
.message {
flex-grow: 1;
a {
font-weight: $font-semibold;
}
}
.from-date {
font-size: 0.85em;
color: $grey-foreground-color;
padding-left: 5px;
min-width: 70px;
text-align: right;
}
}

View File

@ -20,11 +20,7 @@ export class UserNotificationsComponent implements OnInit {
// So we can access it in the template
UserNotificationType = UserNotificationType
componentPagination: ComponentPagination = {
currentPage: 1,
itemsPerPage: this.itemsPerPage,
totalItems: null
}
componentPagination: ComponentPagination
constructor (
private userNotificationService: UserNotificationService,
@ -32,6 +28,12 @@ export class UserNotificationsComponent implements OnInit {
) { }
ngOnInit () {
this.componentPagination = {
currentPage: 1,
itemsPerPage: this.itemsPerPage, // Reset items per page, because of the @Input() variable
totalItems: null
}
this.loadMoreNotifications()
}
@ -58,6 +60,8 @@ export class UserNotificationsComponent implements OnInit {
}
markAsRead (notification: UserNotification) {
if (notification.read) return
this.userNotificationService.markAsRead(notification)
.subscribe(
() => {

View File

@ -1,10 +1,11 @@
<div class="video-feed">
<span
<my-global-icon
*ngIf="syndicationItems.length !== 0" [ngbPopover]="feedsList" [autoClose]="true" placement="bottom"
class="icon icon-syndication" role="button"
></span>
class="icon-syndication" role="button" iconName="syndication"
>
</my-global-icon>
<ng-template #feedsList>
<a *ngFor="let item of syndicationItems" [href]="item.url" target="_blank" rel="noopener noreferrer">{{ item.label }}</a>
</ng-template>
</div>
</div>

View File

@ -1,3 +1,4 @@
@import '_variables';
@import '_mixins';
.video-feed {
@ -6,14 +7,12 @@
display: block;
}
.icon {
@include icon(12px);
my-global-icon {
cursor: pointer;
width: 12px;
position: relative;
top: -2px;
&.icon-syndication {
position: relative;
top: -2px;
background-color: var(--mainForegroundColor);
mask-image: url('../../../assets/images/global/syndication.svg');
}
@include apply-svg-color(var(--mainForegroundColor))
}
}
}

View File

@ -50,10 +50,10 @@
text-overflow: ellipsis;
white-space: nowrap;
font-size: 13px;
color: #585858;
color: $grey-foreground-color;
&:hover {
color: #303030;
color: $grey-foreground-hover-color;
}
}
}

View File

@ -53,7 +53,7 @@ export class Video implements VideoServerModel {
displayName: string
url: string
host: string
avatar: Avatar
avatar?: Avatar
}
channel: {
@ -63,7 +63,7 @@ export class Video implements VideoServerModel {
displayName: string
url: string
host: string
avatar: Avatar
avatar?: Avatar
}
userHistory?: {

View File

@ -3,7 +3,7 @@
<div class="modal-header">
<h4 i18n class="modal-title">Add caption</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -143,7 +143,7 @@
<div class="captions-header">
<a (click)="openAddCaptionModal()" class="create-caption">
<span class="icon icon-add"></span>
<my-global-icon iconName="add"></my-global-icon>
<ng-container i18n>Add another caption</ng-container>
</a>
</div>

View File

@ -42,7 +42,7 @@ my-peertube-checkbox {
text-align: right;
.create-caption {
@include create-button('../../../../assets/images/global/add.svg');
@include create-button;
}
}
@ -100,13 +100,14 @@ my-peertube-checkbox {
display: inline-block;
margin-right: 25px;
color: #585858;
color: $grey-foreground-color;
font-size: 15px;
}
.submit-button {
@include peertube-button;
@include orange-button;
@include button-with-icon(20px, 1px);
display: inline-block;
@ -119,16 +120,6 @@ my-peertube-checkbox {
color: inherit;
font-weight: $font-semibold;
}
.icon.icon-validate {
@include icon(20px);
cursor: inherit;
position: relative;
top: -1px;
margin-right: 4px;
background-image: url('../../../../assets/images/global/validate.svg');
}
}
}
@ -202,7 +193,7 @@ p-calendar {
top: -1px;
height: auto !important;
vertical-align: middle !important;
fill: #585858 !important;
fill: $grey-foreground-color !important;
}
&:hover {

View File

@ -1,6 +1,6 @@
<div *ngIf="!hasImportedVideo" class="upload-video-container">
<div class="import-video-torrent">
<div class="icon icon-upload"></div>
<div class="first-step-block">
<my-global-icon class="upload-icon" iconName="upload"></my-global-icon>
<div class="button-file">
<span i18n>Select the torrent to import</span>
@ -66,7 +66,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }"
>
<span class="icon icon-validate"></span>
<my-global-icon iconName="validate"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>

View File

@ -1,45 +1,7 @@
@import 'variables';
@import 'mixins';
$width-size: 190px;
.peertube-select-container {
@include peertube-select-container($width-size);
}
.alert.alert-danger {
text-align: center;
& > div {
font-weight: $font-semibold;
}
}
.import-video-torrent {
display: flex;
flex-direction: column;
align-items: center;
.icon.icon-upload {
@include icon(90px);
margin-bottom: 25px;
cursor: default;
background-image: url('../../../../assets/images/video/upload.svg');
}
.button-file {
@include peertube-button-file(auto);
min-width: 190px;
}
.button-file-extension {
display: block;
font-size: 12px;
margin-top: 5px;
}
.first-step-block {
.torrent-or-magnet {
margin: 10px 0;
}
@ -47,19 +9,6 @@ $width-size: 190px;
.form-group-magnet-uri {
margin-bottom: 40px;
}
input[type=text] {
@include peertube-input-text($width-size);
display: block;
}
input[type=button] {
@include peertube-button;
@include orange-button;
width: $width-size;
margin-top: 30px;
}
}

View File

@ -18,7 +18,8 @@ import { scrollToTop } from '@app/shared/misc/utils'
templateUrl: './video-import-torrent.component.html',
styleUrls: [
'../shared/video-edit.component.scss',
'./video-import-torrent.component.scss'
'./video-import-torrent.component.scss',
'./video-send.scss'
]
})
export class VideoImportTorrentComponent extends VideoSend implements OnInit, CanComponentDeactivate {

View File

@ -1,6 +1,6 @@
<div *ngIf="!hasImportedVideo" class="upload-video-container">
<div class="import-video-url">
<div class="icon icon-upload"></div>
<div class="first-step-block">
<my-global-icon class="upload-icon" iconName="upload"></my-global-icon>
<div class="form-group">
<label i18n for="targetUrl">URL</label>
@ -59,7 +59,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }"
>
<span class="icon icon-validate"></span>
<my-global-icon iconName="validate"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>

View File

@ -18,7 +18,7 @@ import { scrollToTop } from '@app/shared/misc/utils'
templateUrl: './video-import-url.component.html',
styleUrls: [
'../shared/video-edit.component.scss',
'./video-import-url.component.scss'
'./video-send.scss'
]
})
export class VideoImportUrlComponent extends VideoSend implements OnInit, CanComponentDeactivate {

View File

@ -3,10 +3,6 @@
$width-size: 190px;
.peertube-select-container {
@include peertube-select-container($width-size);
}
.alert.alert-danger {
text-align: center;
@ -15,17 +11,20 @@ $width-size: 190px;
}
}
.import-video-url {
.first-step-block {
display: flex;
flex-direction: column;
align-items: center;
.icon.icon-upload {
@include icon(90px);
.upload-icon {
width: 90px;
margin-bottom: 25px;
cursor: default;
background-image: url('../../../../assets/images/video/upload.svg');
@include apply-svg-color(#C6C6C6);
}
.peertube-select-container {
@include peertube-select-container($width-size);
}
input[type=text] {
@ -40,6 +39,16 @@ $width-size: 190px;
width: $width-size;
margin-top: 30px;
}
.button-file {
@include peertube-button-file(auto);
min-width: 190px;
}
.button-file-extension {
display: block;
font-size: 12px;
margin-top: 5px;
}
}

View File

@ -1,6 +1,6 @@
<div *ngIf="!isUploadingVideo" class="upload-video-container">
<div class="upload-video">
<div class="icon icon-upload"></div>
<div class="first-step-block">
<my-global-icon class="upload-icon" iconName="upload"></my-global-icon>
<div class="button-file">
<span i18n>Select the file to upload</span>
@ -61,7 +61,7 @@
(click)="updateSecondStep()"
[ngClass]="{ disabled: isPublishingButtonDisabled() }"
>
<span class="icon icon-validate"></span>
<my-global-icon iconName="validate"></my-global-icon>
<input [disabled]="isPublishingButtonDisabled()" type="button" i18n-value value="Publish" />
</div>
</div>

View File

@ -1,47 +1,9 @@
@import 'variables';
@import 'mixins';
.peertube-select-container {
@include peertube-select-container(190px);
}
.alert.alert-danger {
text-align: center;
& > div {
font-weight: $font-semibold;
}
}
.upload-video {
display: flex;
flex-direction: column;
align-items: center;
.form-group-channel {
margin-bottom: 20px;
margin-top: 35px;
}
.icon.icon-upload {
@include icon(90px);
margin-bottom: 25px;
cursor: default;
background-image: url('../../../../assets/images/video/upload.svg');
}
.button-file {
@include peertube-button-file(auto);
min-width: 190px;
}
.button-file-extension {
display: block;
font-size: 12px;
margin-top: 5px;
}
.first-step-block .form-group-channel {
margin-bottom: 20px;
margin-top: 35px;
}
.upload-progress-cancel {

View File

@ -20,7 +20,8 @@ import { scrollToTop } from '@app/shared/misc/utils'
templateUrl: './video-upload.component.html',
styleUrls: [
'../shared/video-edit.component.scss',
'./video-upload.component.scss'
'./video-upload.component.scss',
'./video-send.scss'
]
})
export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy, CanComponentDeactivate {

View File

@ -13,7 +13,7 @@
<div class="submit-container">
<div class="submit-button" (click)="update()" [ngClass]="{ disabled: !form.valid || isUpdatingVideo === true }">
<span class="icon icon-validate"></span>
<my-global-icon iconName="validate"></my-global-icon>
<input type="button" i18n-value value="Update" />
</div>
</div>

View File

@ -41,7 +41,7 @@
}
.comment-date {
color: #585858;
color: $grey-foreground-color;
margin-left: 10px;
}
}
@ -69,7 +69,7 @@
.comment-action-reply,
.comment-action-delete {
color: #585858;
color: $grey-foreground-color;
cursor: pointer;
margin-right: 10px;
@ -108,4 +108,4 @@
.root-comment {
font-size: 14px;
}
}
}

View File

@ -1,7 +1,7 @@
<ng-template #modal>
<div class="modal-header">
<h4 i18n class="modal-title">Blacklist video</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -1,7 +1,7 @@
<ng-template #modal let-hide="close">
<div class="modal-header">
<h4 i18n class="modal-title">Download video</h4>
<span class="close" aria-hidden="true" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -1,7 +1,7 @@
<ng-template #modal>
<div class="modal-header">
<h4 i18n class="modal-title">Report video</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -1,7 +1,7 @@
<ng-template #modal let-hide="close">
<div class="modal-header">
<h4 i18n class="modal-title">Share</h4>
<span class="close" aria-hidden="true" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body">

View File

@ -1,7 +1,7 @@
<ng-template #modal let-hide="close">
<div class="modal-header">
<h4 i18n class="modal-title">Support</h4>
<span class="close" aria-label="Close" role="button" (click)="hide()"></span>
<my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
</div>
<div class="modal-body" [innerHTML]="videoHTMLSupport"></div>

View File

@ -53,55 +53,57 @@
<div
*ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()"
class="action-button action-button-like" role="button" [attr.aria-pressed]="userRating === 'like'"
i18n-title title="Like this video"
>
<span class="icon icon-like" i18n-title title="Like this video" ></span>
<my-global-icon iconName="like"></my-global-icon>
</div>
<div
*ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'dislike' }" (click)="setDislike()"
class="action-button action-button-dislike" role="button" [attr.aria-pressed]="userRating === 'dislike'"
i18n-title title="Dislike this video"
>
<span class="icon icon-dislike" i18n-title title="Dislike this video"></span>
<my-global-icon iconName="dislike"></my-global-icon>
</div>
<div *ngIf="video.support" (click)="showSupportModal()" class="action-button action-button-support">
<span class="icon icon-support"></span>
<my-global-icon iconName="heart"></my-global-icon>
<span class="icon-text" i18n>Support</span>
</div>
<div (click)="showShareModal()" class="action-button action-button-share" role="button">
<span class="icon icon-share"></span>
<my-global-icon iconName="share"></my-global-icon>
<span class="icon-text" i18n>Share</span>
</div>
<div class="action-more" ngbDropdown placement="top" role="button">
<div class="action-button" ngbDropdownToggle role="button">
<span class="icon icon-more"></span>
<my-global-icon class="more-icon" iconName="more"></my-global-icon>
</div>
<div ngbDropdownMenu>
<a class="dropdown-item" i18n-title title="Download the video" href="#" (click)="showDownloadModal($event)">
<span class="icon icon-download"></span> <ng-container i18n>Download</ng-container>
<my-global-icon iconName="download"></my-global-icon> <ng-container i18n>Download</ng-container>
</a>
<a *ngIf="isUserLoggedIn()" class="dropdown-item" i18n-title title="Report this video" href="#" (click)="showReportModal($event)">
<span class="icon icon-alert"></span> <ng-container i18n>Report</ng-container>
<my-global-icon iconName="alert"></my-global-icon> <ng-container i18n>Report</ng-container>
</a>
<a *ngIf="isVideoUpdatable()" class="dropdown-item" i18n-title title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]">
<span class="icon icon-edit"></span> <ng-container i18n>Update</ng-container>
<my-global-icon iconName="edit"></my-global-icon> <ng-container i18n>Update</ng-container>
</a>
<a *ngIf="isVideoBlacklistable()" class="dropdown-item" i18n-title title="Blacklist this video" href="#" (click)="showBlacklistModal($event)">
<span class="icon icon-blacklist"></span> <ng-container i18n>Blacklist</ng-container>
<my-global-icon iconName="no"></my-global-icon> <ng-container i18n>Blacklist</ng-container>
</a>
<a *ngIf="isVideoUnblacklistable()" class="dropdown-item" i18n-title title="Unblacklist this video" href="#" (click)="unblacklistVideo($event)">
<span class="icon icon-unblacklist"></span> <ng-container i18n>Unblacklist</ng-container>
<my-global-icon iconName="undo"></my-global-icon> <ng-container i18n>Unblacklist</ng-container>
</a>
<a *ngIf="isVideoRemovable()" class="dropdown-item" i18n-title title="Delete this video" href="#" (click)="removeVideo($event)">
<span class="icon icon-delete"></span> <ng-container i18n>Delete</ng-container>
<my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete</ng-container>
</a>
</div>
</div>

View File

@ -183,6 +183,8 @@ $other-videos-width: 260px;
.action-button {
@include peertube-button;
@include grey-button;
@include button-with-icon(21px, 0, -1px);
@include apply-svg-color($grey-foreground-color);
font-size: 15px;
font-weight: $font-semibold;
@ -194,53 +196,25 @@ $other-videos-width: 260px;
display: none;
}
.icon {
@include icon(21px);
position: relative;
top: -2px;
&.icon-like {
background-image: url('../../../assets/images/video/like-grey.svg');
}
&.icon-dislike {
background-image: url('../../../assets/images/video/dislike-grey.svg');
}
&.icon-support {
background-image: url('../../../assets/images/video/heart.svg');
}
&.icon-share {
background-image: url('../../../assets/images/video/share.svg');
}
&.icon-more {
background-image: url('../../../assets/images/video/more.svg');
top: -1px;
}
}
.icon-text {
margin-left: 3px;
}
&.action-button-like.activated {
background-color: $green;
.icon-like {
background-image: url('../../../assets/images/video/like-white.svg');
my-global-icon {
@include apply-svg-color(#fff);
}
}
&.action-button-dislike.activated {
background-color: $red;
.icon-dislike {
background-image: url('../../../assets/images/video/dislike-white.svg');
my-global-icon {
@include apply-svg-color(#fff);
}
}
.icon-text {
margin-left: 3px;
}
}
.action-more {
@ -249,36 +223,12 @@ $other-videos-width: 260px;
.dropdown-menu .dropdown-item {
padding: 6px 24px;
.icon {
@include icon(24px);
my-global-icon {
width: 24px;
margin-right: 10px;
position: relative;
top: -1px;
&.icon-download {
background-image: url('../../../assets/images/video/download-black.svg');
}
&.icon-edit {
background-image: url('../../../assets/images/global/edit-black.svg');
}
&.icon-alert {
background-image: url('../../../assets/images/video/alert.svg');
}
&.icon-blacklist {
background-image: url('../../../assets/images/video/blacklist.svg');
}
&.icon-unblacklist {
background-image: url('../../../assets/images/global/undo.svg');
}
&.icon-delete {
background-image: url('../../../assets/images/global/delete-black.svg');
}
top: -2px;
}
}
}
@ -320,7 +270,7 @@ $other-videos-width: 260px;
.video-info-description-more {
cursor: pointer;
font-weight: $font-semibold;
color: #585858;
color: $grey-foreground-color;
font-size: 14px;
.glyphicon {
@ -339,7 +289,7 @@ $other-videos-width: 260px;
min-width: 91px;
padding-right: 5px;
display: inline-block;
color: #585858;
color: $grey-foreground-color;
font-weight: $font-bold;
}

View File

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-92.000000, -115.000000)">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-92.000000, -115.000000)">
<g id="2" transform="translate(92.000000, 115.000000)">
<circle id="Oval-1" stroke="#ffffff" stroke-width="2" cx="12" cy="12" r="10"></circle>
<rect id="Rectangle-1" fill="#ffffff" x="11" y="7" width="2" height="10" rx="1"></rect>

Before

Width:  |  Height:  |  Size: 785 B

After

Width:  |  Height:  |  Size: 700 B

View File

@ -1,11 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>alert</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-48.000000, -467.000000)">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-48.000000, -467.000000)">
<g id="161" transform="translate(48.000000, 467.000000)">
<path d="M12.8715755,3.50973876 L12,1.96027114 L11.1284245,3.50973876 L2.12842446,19.5097388 L1.29015252,21 L3,21 L21,21 L22.7098475,21 L21.8715755,19.5097388 L12.8715755,3.50973876 Z" id="Triangle-2" stroke="#000000" stroke-width="2" stroke-linejoin="round"></path>
<path d="M12,17.75 C12.6903559,17.75 13.25,17.1903559 13.25,16.5 C13.25,15.8096441 12.6903559,15.25 12,15.25 C11.3096441,15.25 10.75,15.8096441 10.75,16.5 C10.75,17.1903559 11.3096441,17.75 12,17.75 Z" id="Oval-8" fill="#000000"></path>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -0,0 +1,12 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-400.000000, -1134.000000)" stroke="#000000" stroke-width="2">
<g id="Extras" transform="translate(48.000000, 1046.000000)">
<g id="yes" transform="translate(352.000000, 88.000000)">
<circle id="Oval-1" cx="12" cy="12" r="10"/>
<polyline id="Path-288" stroke-linecap="round" stroke-linejoin="round" points="8.5 12.5 10.5 14.5 15.5 9.5"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 661 B

View File

@ -0,0 +1,11 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g transform="translate(-356.000000, -775.000000)" stroke="#000000" stroke-width="2">
<g id="308" transform="translate(356.000000, 775.000000)">
<path d="M8,17 L5,17 L5,17 C2.790861,17 1,15.209139 1,13 C1,10.790861 2.790861,9 5,9 C5.35840468,9 5.70579988,9.04713713 6.03632437,9.13555013 C6.01233106,8.92702603 6,8.71495305 6,8.5 C6,5.46243388 8.46243388,3 11.5,3 C14.0673313,3 16.2238156,4.7590449 16.8299648,7.1376465 C17.2052921,7.04765874 17.5970804,7 18,7 C20.7614237,7 23,9.23857625 23,12 C23,14.7614237 20.7614237,17 18,17 L16,17" id="Combined-Shape" stroke-linejoin="round"></path>
<path d="M12,13 L12,21" id="Path-58"></path>
<polyline id="Path-59" stroke-linejoin="round" points="15 20 12 23 9 20"></polyline>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -0,0 +1,11 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g transform="translate(-400.000000, -775.000000)" stroke="#000000" stroke-width="2">
<g id="309" transform="translate(400.000000, 775.000000)">
<path d="M7,18 L5,18 C2.790861,18 1,16.209139 1,14 C1,11.790861 2.790861,10 5,10 C5.35840468,10 5.70579988,10.0471371 6.03632437,10.1355501 C6.01233106,9.92702603 6,9.71495305 6,9.5 C6,6.46243388 8.46243388,4 11.5,4 C14.0673313,4 16.2238156,5.7590449 16.8299648,8.1376465 C17.2052921,8.04765874 17.5970804,8 18,8 C20.7614237,8 23,10.2385763 23,13 C23,15.7614237 20.7614237,18 18,18 L17,18" id="Combined-Shape"></path>
<path d="M9,21 L15,15" id="Path-238"></path>
<path d="M9,21 L15,15" id="Path-238" transform="translate(12.000000, 18.000000) scale(-1, 1) translate(-12.000000, -18.000000) "></path>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -0,0 +1,9 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
<g transform="translate(-796.000000, -159.000000)" stroke="#000000" stroke-width="2">
<g id="38" transform="translate(796.000000, 159.000000)">
<path d="M7.20852293,4.3800958 C8.05442158,3.84706631 8.99528987,3.45099725 10,3.22301642 L10,1.99980749 C10,1.44762906 10.4433532,1 11.0093689,1 L12.9906311,1 C13.5480902,1 14,1.44371665 14,1.99980749 L14,3.22301642 C15.0047101,3.45099725 15.9455784,3.84706631 16.7914771,4.3800958 L17.6569904,3.5145825 C18.0474395,3.12413339 18.6774591,3.12110988 19.0776926,3.52134344 L20.4786566,4.92230738 C20.8728396,5.31649045 20.8786331,5.94979402 20.4854175,6.34300963 L19.6199042,7.20852293 C20.1529337,8.05442158 20.5490027,8.99528987 20.7769836,10 L22.0001925,10 C22.5523709,10 23,10.4433532 23,11.0093689 L23,12.9906311 C23,13.5480902 22.5562834,14 22.0001925,14 L20.7769836,14 C20.5490027,15.0047101 20.1529337,15.9455784 19.6199042,16.7914771 L20.4854175,17.6569904 C20.8758666,18.0474395 20.8788901,18.6774591 20.4786566,19.0776926 L19.0776926,20.4786566 C18.6835095,20.8728396 18.050206,20.8786331 17.6569904,20.4854175 L16.7914771,19.6199042 C15.9455784,20.1529337 15.0047101,20.5490027 14,20.7769836 L14,22.0001925 C14,22.5523709 13.5566468,23 12.9906311,23 L11.0093689,23 C10.4519098,23 10,22.5562834 10,22.0001925 L10,20.7769836 C8.99528987,20.5490027 8.05442158,20.1529337 7.20852293,19.6199042 L6.34300963,20.4854175 C5.95256051,20.8758666 5.32254093,20.8788901 4.92230738,20.4786566 L3.52134344,19.0776926 C3.12716036,18.6835095 3.12136689,18.050206 3.5145825,17.6569904 L4.3800958,16.7914771 C3.84706631,15.9455784 3.45099725,15.0047101 3.22301642,14 L1.99980749,14 C1.44762906,14 1,13.5566468 1,12.9906311 L1,11.0093689 C1,10.4519098 1.44371665,10 1.99980749,10 L3.22301642,10 C3.45099725,8.99528987 3.84706631,8.05442158 4.3800958,7.20852293 L3.5145825,6.34300963 C3.12413339,5.95256051 3.12110988,5.32254093 3.52134344,4.92230738 L4.92230738,3.52134344 C5.31649045,3.12716036 5.94979402,3.12136689 6.34300963,3.5145825 L7.20852293,4.3800958 Z M12,16 C14.209139,16 16,14.209139 16,12 C16,9.790861 14.209139,8 12,8 C9.790861,8 8,9.790861 8,12 C8,14.209139 9.790861,16 12,16 Z" id="Combined-Shape"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-312.000000, -115.000000)" stroke="#585858" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g transform="translate(-312.000000, -115.000000)" stroke="#000000" stroke-width="2">
<g id="7" transform="translate(312.000000, 115.000000)">
<path d="M19,5 L5,19" id="Path-14"></path>
<path d="M19,5 L5,19" id="Path-14" transform="translate(12.000000, 12.000000) scale(-1, 1) translate(-12.000000, -12.000000) "></path>

Before

Width:  |  Height:  |  Size: 743 B

After

Width:  |  Height:  |  Size: 658 B

View File

@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-224.000000, -159.000000)">
<g id="25" transform="translate(224.000000, 159.000000)">
<path d="M5,7 L5,20.0081158 C5,21.1082031 5.89706013,22 7.00585866,22 L16.9941413,22 C18.1019465,22 19,21.1066027 19,20.0081158 L19,7" id="Path-296" stroke="#000" stroke-width="2"></path>
<rect id="Rectangle-424" fill="#000" x="2" y="4" width="20" height="2" rx="1"></rect>
<path d="M9,10.9970301 C9,10.4463856 9.44386482,10 10,10 C10.5522847,10 11,10.4530363 11,10.9970301 L11,17.0029699 C11,17.5536144 10.5561352,18 10,18 C9.44771525,18 9,17.5469637 9,17.0029699 L9,10.9970301 Z M13,10.9970301 C13,10.4463856 13.4438648,10 14,10 C14.5522847,10 15,10.4530363 15,10.9970301 L15,17.0029699 C15,17.5536144 14.5561352,18 14,18 C13.4477153,18 13,17.5469637 13,17.0029699 L13,10.9970301 Z" id="Combined-Shape" fill="#000"></path>
<path d="M9,5 L9,2.99895656 C9,2.44724809 9.45097518,2 9.99077797,2 L14.009222,2 C14.5564136,2 15,2.44266033 15,2.99895656 L15,5" id="Path-33" stroke="#000" stroke-width="2" stroke-linejoin="round"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-224.000000, -159.000000)">
<g id="25" transform="translate(224.000000, 159.000000)">
<path d="M5,7 L5,20.0081158 C5,21.1082031 5.89706013,22 7.00585866,22 L16.9941413,22 C18.1019465,22 19,21.1066027 19,20.0081158 L19,7" id="Path-296" stroke="#ffffff" stroke-width="2"></path>
<rect id="Rectangle-424" fill="#ffffff" x="2" y="4" width="20" height="2" rx="1"></rect>
<path d="M9,10.9970301 C9,10.4463856 9.44386482,10 10,10 C10.5522847,10 11,10.4530363 11,10.9970301 L11,17.0029699 C11,17.5536144 10.5561352,18 10,18 C9.44771525,18 9,17.5469637 9,17.0029699 L9,10.9970301 Z M13,10.9970301 C13,10.4463856 13.4438648,10 14,10 C14.5522847,10 15,10.4530363 15,10.9970301 L15,17.0029699 C15,17.5536144 14.5561352,18 14,18 C13.4477153,18 13,17.5469637 13,17.0029699 L13,10.9970301 Z" id="Combined-Shape" fill="#ffffff"></path>
<path d="M9,5 L9,2.99895656 C9,2.44724809 9.45097518,2 9.99077797,2 L14.009222,2 C14.5564136,2 15,2.44266033 15,2.99895656 L15,5" id="Path-33" stroke="#ffffff" stroke-width="2" stroke-linejoin="round"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,13 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-224.000000, -159.000000)">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-224.000000, -159.000000)">
<g id="25" transform="translate(224.000000, 159.000000)">
<path d="M5,7 L5,20.0081158 C5,21.1082031 5.89706013,22 7.00585866,22 L16.9941413,22 C18.1019465,22 19,21.1066027 19,20.0081158 L19,7" id="Path-296" stroke="#585858" stroke-width="2"></path>
<rect id="Rectangle-424" fill="#585858" x="2" y="4" width="20" height="2" rx="1"></rect>
<path d="M9,10.9970301 C9,10.4463856 9.44386482,10 10,10 C10.5522847,10 11,10.4530363 11,10.9970301 L11,17.0029699 C11,17.5536144 10.5561352,18 10,18 C9.44771525,18 9,17.5469637 9,17.0029699 L9,10.9970301 Z M13,10.9970301 C13,10.4463856 13.4438648,10 14,10 C14.5522847,10 15,10.4530363 15,10.9970301 L15,17.0029699 C15,17.5536144 14.5561352,18 14,18 C13.4477153,18 13,17.5469637 13,17.0029699 L13,10.9970301 Z" id="Combined-Shape" fill="#585858"></path>
<path d="M9,5 L9,2.99895656 C9,2.44724809 9.45097518,2 9.99077797,2 L14.009222,2 C14.5564136,2 15,2.44266033 15,2.99895656 L15,5" id="Path-33" stroke="#585858" stroke-width="2" stroke-linejoin="round"></path>
<path d="M5,7 L5,20.0081158 C5,21.1082031 5.89706013,22 7.00585866,22 L16.9941413,22 C18.1019465,22 19,21.1066027 19,20.0081158 L19,7" id="Path-296" stroke="#000000" stroke-width="2"></path>
<rect id="Rectangle-424" fill="#000000" x="2" y="4" width="20" height="2" rx="1"></rect>
<path d="M9,10.9970301 C9,10.4463856 9.44386482,10 10,10 C10.5522847,10 11,10.4530363 11,10.9970301 L11,17.0029699 C11,17.5536144 10.5561352,18 10,18 C9.44771525,18 9,17.5469637 9,17.0029699 L9,10.9970301 Z M13,10.9970301 C13,10.4463856 13.4438648,10 14,10 C14.5522847,10 15,10.4530363 15,10.9970301 L15,17.0029699 C15,17.5536144 14.5561352,18 14,18 C13.4477153,18 13,17.5469637 13,17.0029699 L13,10.9970301 Z" id="Combined-Shape" fill="#000000"></path>
<path d="M9,5 L9,2.99895656 C9,2.44724809 9.45097518,2 9.99077797,2 L14.009222,2 C14.5564136,2 15,2.44266033 15,2.99895656 L15,5" id="Path-33" stroke="#000000" stroke-width="2" stroke-linejoin="round"></path>
</g>
</g>
</g>

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,11 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>download</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-180.000000, -291.000000)" stroke="#000000" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g transform="translate(-180.000000, -291.000000)" stroke="#000000" stroke-width="2">
<g id="84" transform="translate(180.000000, 291.000000)">
<path d="M12,3 L12,15" id="Path-58"></path>
<polyline id="Path-59" stroke-linejoin="round" transform="translate(12.000000, 14.000000) rotate(-270.000000) translate(-12.000000, -14.000000) " points="9 8 15 14 9 20"></polyline>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 961 B

View File

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>edit</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-48.000000, -203.000000)" stroke="#585858" stroke-width="2">
<g id="41" transform="translate(48.000000, 203.000000)">
<path d="M3,21.0000003 L3,17 L15.8898356,4.11016442 C17.0598483,2.9401517 18.9638992,2.94723715 20.1306896,4.11402752 L19.9181432,3.90148112 C21.0902894,5.07362738 21.0882407,6.97202708 19.9174652,8.1377941 L7,21.0000003 L3,21.0000003 Z" id="Path-74" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M14.5,5.5 L18.5,9.5" id="Path-75"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -1,11 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>edit</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-48.000000, -203.000000)" stroke="#000000" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-48.000000, -203.000000)" stroke="#000000" stroke-width="2">
<g id="41" transform="translate(48.000000, 203.000000)">
<path d="M3,21.0000003 L3,17 L15.8898356,4.11016442 C17.0598483,2.9401517 18.9638992,2.94723715 20.1306896,4.11402752 L19.9181432,3.90148112 C21.0902894,5.07362738 21.0882407,6.97202708 19.9174652,8.1377941 L7,21.0000003 L3,21.0000003 Z" id="Path-74" stroke-linecap="round" stroke-linejoin="round"></path>
<path d="M14.5,5.5 L18.5,9.5" id="Path-75"></path>

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 813 B

View File

@ -1,12 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-400.000000, -247.000000)">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-400.000000, -247.000000)">
<g id="69" transform="translate(400.000000, 247.000000)">
<circle id="Oval-7" stroke="#333333" stroke-width="2" cx="12" cy="12" r="10"></circle>
<path d="M12.016,14.544 C12.384,14.544 12.64,14.256 12.704,13.904 L12.768,13.168 C14.544,12.864 16,11.952 16,9.936 L16,9.904 C16,7.904 14.48,6.656 12.24,6.656 C10.768,6.656 9.696,7.184 8.848,7.984 C8.624,8.176 8.528,8.432 8.528,8.672 C8.528,9.152 8.928,9.552 9.424,9.552 C9.648,9.552 9.856,9.456 10.016,9.328 C10.656,8.752 11.344,8.448 12.192,8.448 C13.344,8.448 14.032,9.072 14.032,9.968 L14.032,10 C14.032,11.008 13.2,11.584 11.696,11.728 C11.264,11.776 11.008,12.096 11.072,12.528 L11.232,13.904 C11.28,14.272 11.552,14.544 11.92,14.544 L12.016,14.544 Z M10.784,16.816 L10.784,16.976 C10.784,17.6 11.264,18.08 11.92,18.08 C12.576,18.08 13.056,17.6 13.056,16.976 L13.056,16.816 C13.056,16.192 12.576,15.712 11.92,15.712 C11.264,15.712 10.784,16.192 10.784,16.816 Z" id="?" fill="#333333"></path>
</g>
</g>
</g>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -1,15 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>im-with-her</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-708.000000, -467.000000)">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-708.000000, -467.000000)">
<g id="176" transform="translate(708.000000, 467.000000)">
<path d="M8,9 L8,3.99339768 C8,3.44494629 7.55641359,3 7.00922203,3 L2.99077797,3 C2.45097518,3 2,3.44475929 2,3.99339768 L2,20.0066023 C2,20.5550537 2.44358641,21 2.99077797,21 L7.00922203,21 C7.54902482,21 8,20.5552407 8,20.0066023 L8,15 L14,15 L14,20.0066023 C14,20.5550537 14.4435864,21 14.990778,21 L19.009222,21 C19.5490248,21 20,20.5564587 20,20.0093228 L20,15.0006104 L23,12 L20,8.99267578 L20,4.00303919 C20,3.45042467 19.5564136,3 19.009222,3 L14.990778,3 C14.4509752,3 14,3.44475929 14,3.99339768 L14,9 L8,9 Z" id="Combined-Shape" fill="#333333" opacity="0.5"></path>
<path d="M8,9 L8,3.99339768 C8,3.44494629 7.55641359,3 7.00922203,3 L2.99077797,3 C2.45097518,3 2,3.44475929 2,3.99339768 L2,20.0066023 C2,20.5550537 2.44358641,21 2.99077797,21 L7.00922203,21 C7.54902482,21 8,20.5552407 8,20.0066023 L8,15 L14,15 L14,20.0066023 C14,20.5550537 14.4435864,21 14.990778,21 L19.009222,21 C19.5490248,21 20,20.5564587 20,20.0093228 L20,15.0006104 L23,12 L20,8.99267578 L20,4.00303919 C20,3.45042467 19.5564136,3 19.009222,3 L14.990778,3 C14.4509752,3 14,3.44475929 14,3.99339768 L14,9 L8,9 Z" id="Combined-Shape" fill="#000000" opacity="0.5"></path>
<path d="M2,9 L14,9 L14,3.99077797 C14,3.44358641 14.3203148,3.32031476 14.7062149,3.7062149 L23,12 L14.7062149,20.2937851 C14.3161832,20.6838168 14,20.5490248 14,20.009222 L14,15 L2,15 L2,9 Z" id="Rectangle-121" fill-opacity="0.5" fill="#000000"></path>
</g>
</g>
</g>
</svg>
</svg>

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,10 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-312.000000, -863.000000)" stroke="#000000" stroke-width="2">
<g id="347" transform="translate(312.000000, 863.000000)">
<circle id="Oval-196" cx="12" cy="12" r="9"></circle>
<path d="M18,18 L6,6" id="Path-275"></path>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 557 B

View File

@ -0,0 +1,11 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g transform="translate(-488.000000, -731.000000)" stroke="#000000" stroke-width="2">
<g id="291" transform="translate(488.000000, 731.000000)">
<path d="M10,9 C8.5,7.5 8,3 8,3 C8,3 7.5,7.5 6,9 C4.5,10.5 2,11 2,11 C2,11 4.5,11.5 6,13 C7.5,14.5 8,19 8,19 C8,19 8.5,14.5 10,13 C11.5,11.5 14,11 14,11 C14,11 11.5,10.5 10,9 Z" id="Combined-Shape"></path>
<path d="M19.6666667,4.75 C18.7916667,3.8125 18.5,1 18.5,1 C18.5,1 18.2083333,3.8125 17.3333333,4.75 C16.4583333,5.6875 15,6 15,6 C15,6 16.4583333,6.3125 17.3333333,7.25 C18.2083333,8.1875 18.5,11 18.5,11 C18.5,11 18.7916667,8.1875 19.6666667,7.25 C20.5416667,6.3125 22,6 22,6 C22,6 20.5416667,5.6875 19.6666667,4.75 Z" id="Combined-Shape"></path>
<path d="M17,17 C16.25,16.25 16,14 16,14 C16,14 15.75,16.25 15,17 C14.25,17.75 13,18 13,18 C13,18 14.25,18.25 15,19 C15.75,19.75 16,22 16,22 C16,22 16.25,19.75 17,19 C17.75,18.25 19,18 19,18 C19,18 17.75,17.75 17,17 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -1,10 +1,8 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 559.372 559.372" style="enable-background:new 0 0 559.372 559.372;" xml:space="preserve">
<g>
<g>
<path style="fill:#010002;" d="M53.244,0.002c46.512,0,91.29,6.018,134.334,18.054s83.334,29.07,120.869,51.102
<path fill="#000000" d="M53.244,0.002c46.512,0,91.29,6.018,134.334,18.054s83.334,29.07,120.869,51.102
c37.537,22.032,71.707,48.45,102.514,79.254c30.803,30.804,57.221,64.974,79.254,102.51
c22.029,37.539,39.063,77.828,51.102,120.873c12.037,43.043,18.055,87.818,18.055,134.334c0,14.688-5.201,27.23-15.605,37.637
c-10.404,10.407-22.949,15.604-37.637,15.604c-14.689,0-27.234-5.199-37.641-15.604c-10.402-10.404-15.604-22.949-15.604-37.637

Before

Width:  |  Height:  |  Size: 2.7 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-356.000000, -115.000000)" stroke="#585858" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g transform="translate(-356.000000, -115.000000)" stroke="#000000" stroke-width="2">
<g id="8" transform="translate(356.000000, 115.000000)">
<path d="M21,6 L9,18" id="Path-14"></path>
<path d="M9,13 L4,18" id="Path-14" transform="translate(6.500000, 15.500000) scale(-1, 1) translate(-6.500000, -15.500000) "></path>

Before

Width:  |  Height:  |  Size: 741 B

After

Width:  |  Height:  |  Size: 656 B

View File

@ -0,0 +1,9 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-180.000000, -115.000000)" fill="#000000">
<g id="4" transform="translate(180.000000, 115.000000)">
<path d="M10,19 C10.5522847,19 11,19.4477153 11,20 C11,20.5522847 10.5522847,21 10,21 C9.99404288,21 9.98809793,20.9999479 9.98216558,20.9998442 C5.01980239,20.990358 1,16.9646166 1,12 C1,7.02943725 5.02943725,3 10,3 C14.9705627,3 19,7.02943725 19,12 L17,12 C17,8.13400675 13.8659932,5 10,5 C6.13400675,5 3,8.13400675 3,12 C3,15.8659932 6.13400675,19 10,19 Z M14,12 L22,12 L18,16 L14,12 Z" id="Combined-Shape" transform="translate(11.500000, 12.000000) scale(-1, 1) translate(-11.500000, -12.000000) "/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 894 B

View File

@ -1,11 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-180.000000, -115.000000)" fill="#000">
<g id="4" transform="translate(180.000000, 115.000000)">
<path d="M10,19 C10.5522847,19 11,19.4477153 11,20 C11,20.5522847 10.5522847,21 10,21 C9.99404288,21 9.98809793,20.9999479 9.98216558,20.9998442 C5.01980239,20.990358 1,16.9646166 1,12 C1,7.02943725 5.02943725,3 10,3 C14.9705627,3 19,7.02943725 19,12 L17,12 C17,8.13400675 13.8659932,5 10,5 C6.13400675,5 3,8.13400675 3,12 C3,15.8659932 6.13400675,19 10,19 Z M14,12 L22,12 L18,16 L14,12 Z" id="Combined-Shape" transform="translate(11.500000, 12.000000) scale(-1, 1) translate(-11.500000, -12.000000) "></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1014 B

View File

@ -0,0 +1,11 @@
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-136.000000, -863.000000)">
<g id="343" transform="translate(136.000000, 863.000000)">
<path d="M14.2571621,15 L7,15 C4.20063223,15 2.390348,16.1679253 1.5255785,18.0896353 C1.07423388,19.0926234 0.949016905,20.1108713 0.995546634,20.9698816 C0.998604759,21.0263393 1.0014872,21.0632937 1.00496281,21.0995037 C1.0599172,21.6490476 1.54995985,22.0499916 2.09950372,21.9950372 C2.64904758,21.9400828 3.04999158,21.4500401 2.99503719,20.9004963 C2.99555422,20.9071205 2.99399879,20.8871791 2.99261905,20.8617069 C2.96185588,20.2937714 3.05021139,19.575276 3.34942151,18.9103647 C3.890902,17.7070747 4.98686778,17 7,17 L12.0070975,17 L13.2070325,17 C13.4170071,16.2576107 13.7789623,15.5790321 14.2571621,15 Z" id="Path-41" fill="#000000" fill-rule="nonzero"></path>
<path d="M19,18 L19,16.4976988 C19,16.2228273 18.7680664,16 18.5,16 C18.2238576,16 18,16.2148438 18,16.4976988 L18,18 L16.4976988,18 C16.2148438,18 16,18.2238576 16,18.5 C16,18.7680664 16.2228273,19 16.4976988,19 L18,19 L18,20.5023012 C18,20.7771727 18.2319336,21 18.5,21 C18.7761424,21 19,20.7851562 19,20.5023012 L19,19 L20.5023012,19 C20.7851562,19 21,18.7761424 21,18.5 C21,18.2319336 20.7771727,18 20.5023012,18 L19,18 Z M18.5,23 C16.0147186,23 14,20.9852814 14,18.5 C14,16.0147186 16.0147186,14 18.5,14 C20.9852814,14 23,16.0147186 23,18.5 C23,20.9852814 20.9852814,23 18.5,23 Z" id="Combined-Shape" fill="#000000"></path>
<circle id="Oval-40" stroke="#000000" stroke-width="2" cx="12" cy="8" r="5"></circle>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-400.000000, -1134.000000)" stroke="#ffffff" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-400.000000, -1134.000000)" stroke="#000000" stroke-width="2">
<g id="Extras" transform="translate(48.000000, 1046.000000)">
<g id="yes" transform="translate(352.000000, 88.000000)">
<circle id="Oval-1" cx="12" cy="12" r="10"></circle>

Before

Width:  |  Height:  |  Size: 824 B

After

Width:  |  Height:  |  Size: 739 B

View File

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>no</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-312.000000, -863.000000)" stroke="#000000" stroke-width="2">
<g id="347" transform="translate(312.000000, 863.000000)">
<circle id="Oval-196" cx="12" cy="12" r="9"></circle>
<path d="M18,18 L6,6" id="Path-275"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 785 B

View File

@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-752.000000, -1090.000000)" stroke="#ffffff" stroke-width="2">
<g id="Extras" transform="translate(48.000000, 1046.000000)">
<g id="thumbs-down" transform="translate(704.000000, 44.000000)">
<path d="M6,16 C6,18.5 6.5,21 8,21 L16.9938335,21 C17.5495239,21 18.1819788,20.5956028 18.4072817,20.0949295 L20.8562951,14.6526776 C21.7640882,12.6353595 20.7154925,11 18.5092545,11 L15.5,11 C15.5,11 18.5,5 15,5 C12.5,5 11.5,11 8,11 C6.5,11 6,13.5 6,16 Z" id="Path-188" stroke-linejoin="round" transform="translate(13.591488, 13.000000) scale(1, -1) translate(-13.591488, -13.000000) "></path>
<path d="M4,4.5 C4,4.5 3,7 3,10 C3,13 4,15.5 4,15.5" id="Path-189" transform="translate(3.500000, 10.000000) scale(1, -1) translate(-3.500000, -10.000000) "></path>
</g>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1,8 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-752.000000, -1090.000000)" stroke="#585858" stroke-width="2">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g transform="translate(-752.000000, -1090.000000)" stroke="#000000" stroke-width="2">
<g id="Extras" transform="translate(48.000000, 1046.000000)">
<g id="thumbs-down" transform="translate(704.000000, 44.000000)">
<path d="M6,16 C6,18.5 6.5,21 8,21 L16.9938335,21 C17.5495239,21 18.1819788,20.5956028 18.4072817,20.0949295 L20.8562951,14.6526776 C21.7640882,12.6353595 20.7154925,11 18.5092545,11 L15.5,11 C15.5,11 18.5,5 15,5 C12.5,5 11.5,11 8,11 C6.5,11 6,13.5 6,16 Z" id="Path-188" stroke-linejoin="round" transform="translate(13.591488, 13.000000) scale(1, -1) translate(-13.591488, -13.000000) "></path>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -1,16 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>download</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
<g id="Artboard-4" transform="translate(-180.000000, -291.000000)" stroke="#585858" stroke-width="2">
<g id="84" transform="translate(180.000000, 291.000000)">
<path d="M12,3 L12,15" id="Path-58"></path>
<polyline id="Path-59" stroke-linejoin="round" transform="translate(12.000000, 14.000000) rotate(-270.000000) translate(-12.000000, -14.000000) " points="9 8 15 14 9 20"></polyline>
<path d="M3,18 L3,20.0590859 C3,20.6127331 3.44494889,21.0615528 3.99340349,21.0615528 L20.0067018,21.0615528 C20.5553434,21.0615528 21.0001052,20.6098102 21.0001051,20.0590859 L21.0001049,18" id="Path-12" stroke-linejoin="round"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

Some files were not shown because too many files have changed in this diff Show More