inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-10-08 14:51:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-2588] make comment component compatible with content (#3128)

Browse Source
This commit is contained in:
Mario Romano
2018-03-30 11:13:38 +01:00
committed by Eugenio Romano
parent f985dd11d5
commit 653a510a5c
46 changed files with 1186 additions and 462 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
lib/core/comments/comment-list.component.scss Normal file
View File

@@ -0,0 +1,94 @@
@mixin adf-task-list-comment-list-theme($theme) {
$primary: map-get($theme, primary);
$primaryColor: mat-color($primary, 100);
$rippleColor: mat-color($primary, 300);
.is-selected {
background: mat-color($primary, 100);
}
.adf {
&-comment-img-container {
float: left;
width: 40px;
height: 100%;
display: flex;
align-self: flex-start;
padding-top: 18px;
}
&-comment-list-item {
white-space: initial;
display: table-row-group;
padding-top: 12px;
overflow: hidden;
height: 100% !important;
transition: background 0.8s;
background-position: center;
&:hover {
background: $primaryColor radial-gradient(circle, transparent 1%, $primaryColor 1%) center/15000%;
}
&:active {
background-color: $rippleColor;
background-size: 100%;
transition: background 0s;
}
}
&-comment-user-icon {
padding: 10px 5px;
width: 30px;
background-color: mat-color($primary);
border-radius: 50%;
font-size: 16px;
text-align: center;
height: 20px;
background-size: cover;
}
&-comment-user-name {
float: left;
width: calc(100% - 10%);
padding: 2px 10px;
font-weight: 600;
font-size: 14px;
}
&-comment-message {
float: left;
width: calc(100% - 10px);
padding: 2px 10px;
font-style: italic;
white-space: initial !important;
font-size: 14px;
letter-spacing: -0.2px;
line-height: 1.43;
opacity: 0.54;
}
&-comment-message-time {
float: left;
width: calc(100% - 10%);
padding: 2px 10px;
font-size: 12px !important;
opacity: 0.54;
}
&-comment-contents {
width: calc(100% - 10px);
padding-top: 12px;
padding-bottom: 12px;
padding-left: 5px;
}
&-people-img {
border-radius: 90%;
width: 40px;
height: 40px;
vertical-align: middle;
}
}
}