mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
remove mdl from social component (#2219)
This commit is contained in:
Eugenio Romano
committed by
Mario Romano
Mario Romano
parent
a742e033d1
commit
8f5105d33f
@@ -21,6 +21,7 @@ import { CoreModule } from 'ng2-alfresco-core';
|
||||
import { LikeComponent } from './src/components/like.component';
|
||||
import { RatingComponent } from './src/components/rating.component';
|
||||
import { RatingService } from './src/services/rating.service';
|
||||
import { MaterialModule } from './src/material.module';
|
||||
|
||||
export * from './src/components/rating.component';
|
||||
export * from './src/components/like.component';
|
||||
@@ -37,7 +38,8 @@ export const RATING_PROVIDERS: any[] = [
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CoreModule
|
||||
CoreModule,
|
||||
MaterialModule
|
||||
],
|
||||
declarations: [
|
||||
...RATING_DIRECTIVES
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
.adf-like-container {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.adf-like {
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
margin: 5px 0px 5px 5px;
|
||||
}
|
||||
|
||||
.adf-like-select {
|
||||
cursor: pointer;
|
||||
color: #2196f3;
|
||||
}
|
||||
|
||||
.adf-like-select:hover {
|
||||
cursor: pointer;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-like-grey {
|
||||
cursor: pointer;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-like-grey:hover {
|
||||
cursor: pointer;
|
||||
color: #2196f3;
|
||||
}
|
||||
|
||||
.adf-like-counter {
|
||||
float: left;
|
||||
padding: 13px 0 0 0;
|
||||
}
|
||||
|
||||
.adf-left{
|
||||
float: left;
|
||||
padding: 13px 0 0 4px;
|
||||
}
|
||||
@@ -1,8 +1,8 @@
|
||||
<div id="adf-like-container" class="adf-like-container">
|
||||
<div class="material-icons adf-like">
|
||||
<div class="adf-like">
|
||||
<span id="adf-like-{{nodeId}}" [ngClass]="{'adf-like-select': isLike ,'adf-like-grey': !isLike }"
|
||||
(click)="likeClick()">
|
||||
<i class="material-icons">thumb_up</i>
|
||||
<md-icon>thumb_up</md-icon>
|
||||
</span>
|
||||
</div>
|
||||
<div id="adf-like-counter" class="adf-like-counter">{{likesCounter}}</div>
|
||||
|
||||
@@ -0,0 +1,42 @@
|
||||
.adf-like-container {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
|
||||
.adf-like {
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
margin: 5px 0px 5px 5px;
|
||||
}
|
||||
|
||||
.adf-like-select {
|
||||
cursor: pointer;
|
||||
color: #2196f3;
|
||||
}
|
||||
|
||||
.adf-like-select:hover {
|
||||
cursor: pointer;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-like-grey {
|
||||
cursor: pointer;
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-like-grey:hover {
|
||||
cursor: pointer;
|
||||
color: #2196f3;
|
||||
}
|
||||
|
||||
.adf-like-counter {
|
||||
float: left;
|
||||
padding: 13px 0 0 0;
|
||||
}
|
||||
|
||||
.adf-left {
|
||||
float: left;
|
||||
padding: 13px 0 0 4px;
|
||||
}
|
||||
|
||||
}
|
||||
@@ -15,14 +15,15 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';
|
||||
import { Component, EventEmitter, Input, OnChanges, Output, ViewEncapsulation } from '@angular/core';
|
||||
import { RatingService } from './../services/rating.service';
|
||||
|
||||
@Component({
|
||||
selector: 'adf-like',
|
||||
styleUrls: ['./like.component.css'],
|
||||
styleUrls: ['./like.component.scss'],
|
||||
templateUrl: './like.component.html',
|
||||
providers: [RatingService]
|
||||
providers: [RatingService],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class LikeComponent implements OnChanges {
|
||||
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
.adf-rating-container {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.adf-rating-star {
|
||||
float: left;
|
||||
transition: all .3s;
|
||||
padding: 1px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.adf-colored-star {
|
||||
color: #ffe944;
|
||||
}
|
||||
|
||||
.adf-grey-star {
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-stars-container {
|
||||
padding: 0!important;
|
||||
margin: 0!important;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.adf-rating-star:hover {
|
||||
transform: rotate(13deg) scale(1.2);
|
||||
}
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
<div id="adf-rating-container" class="adf-rating-container">
|
||||
<ul class="mdl-list adf-stars-container">
|
||||
<li class="mdl-list__item adf-rating-star" *ngFor="let currentRate of stars; let idx = index">
|
||||
<span id="adf-rate-{{idx}}" class="mdl-list__item-primary-content">
|
||||
<i id="adf-grey-star-{{idx}}" *ngIf="currentRate.fill" class="material-icons adf-colored-star" (click)="updateVote(idx + 1)" >star_rate</i>
|
||||
<i id="adf-colored-star-{{idx}}" *ngIf="!currentRate.fill" class="material-icons adf-grey-star" (click)="updateVote(idx + 1)" >star_border</i>
|
||||
<md-list id="adf-rating-container" class="adf-rating-container">
|
||||
<md-list-item class="adf-rating-star" *ngFor="let currentRate of stars; let idx = index">
|
||||
<span id="adf-rate-{{idx}}">
|
||||
<md-icon id="adf-grey-star-{{idx}}" *ngIf="currentRate.fill" class="adf-colored-star"
|
||||
(click)="updateVote(idx + 1)">star_rate
|
||||
</md-icon>
|
||||
<md-icon id="adf-colored-star-{{idx}}" *ngIf="!currentRate.fill" class="adf-grey-star"
|
||||
(click)="updateVote(idx + 1)">star_border
|
||||
</md-icon>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</md-list-item>
|
||||
</md-list>
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
.adf-rating-container {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
|
||||
.adf-rating-star {
|
||||
float: left;
|
||||
transition: all .3s;
|
||||
padding: 1px;
|
||||
cursor: pointer;
|
||||
|
||||
.mat-list-item-content {
|
||||
padding: 0 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-colored-star {
|
||||
color: #ffe944;
|
||||
}
|
||||
|
||||
.adf-grey-star {
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.adf-stars-container {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.adf-rating-star:hover {
|
||||
transform: rotate(13deg) scale(1.2);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -15,14 +15,15 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';
|
||||
import { Component, EventEmitter, Input, OnChanges, Output, ViewEncapsulation } from '@angular/core';
|
||||
import { RatingService } from './../services/rating.service';
|
||||
|
||||
@Component({
|
||||
selector: 'adf-rating',
|
||||
styleUrls: ['./rating.component.css'],
|
||||
styleUrls: ['./rating.component.scss'],
|
||||
templateUrl: './rating.component.html',
|
||||
providers: [RatingService]
|
||||
providers: [RatingService],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class RatingComponent implements OnChanges {
|
||||
|
||||
|
||||
35
ng2-components/ng2-alfresco-social/src/material.module.ts
Normal file
35
ng2-components/ng2-alfresco-social/src/material.module.ts
Normal file
@@ -0,0 +1,35 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright 2016 Alfresco Software, Ltd.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import {
|
||||
MdIconModule,
|
||||
MdListModule
|
||||
} from '@angular/material';
|
||||
|
||||
export function modules() {
|
||||
return [
|
||||
MdIconModule,
|
||||
MdListModule
|
||||
];
|
||||
}
|
||||
|
||||
@NgModule({
|
||||
imports: modules(),
|
||||
exports: modules()
|
||||
})
|
||||
export class MaterialModule {}
|
||||
Reference in New Issue
Block a user