Styles published icon on dmp listing

This commit is contained in:
apapachristou 2019-10-31 10:19:56 +02:00
parent e0c5e4a955
commit 5fb6e62017
4 changed files with 23 additions and 31 deletions

View File

@ -1,25 +0,0 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DmpInfoCounterComponent } from './dmp-info-counter.component';
describe('DmpInfoCounterComponent', () => {
let component: DmpInfoCounterComponent;
let fixture: ComponentFixture<DmpInfoCounterComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ DmpInfoCounterComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(DmpInfoCounterComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -34,9 +34,8 @@
<mat-icon *ngIf="isFinalized && !isPublished" matTooltip="{{'DMP-LISTING.TOOLTIP.DMP-STATUS.FINALIZED' | translate}}" class="lock-icon">
lock
</mat-icon>
<mat-icon *ngIf="isPublished" matTooltip="{{'DMP-LISTING.TOOLTIP.DMP-STATUS.PUBLISHED' | translate}}" class="published-icon">
radio_button_checked
</mat-icon>
<div *ngIf="isPublished" class="outer-circle"><div class="inner-circle" matTooltip="{{'DMP-LISTING.TOOLTIP.DMP-STATUS.PUBLISHED' | translate}}"></div></div>
<!-- <mat-icon *ngIf="isPublished" matTooltip="{{'DMP-LISTING.TOOLTIP.DMP-STATUS.PUBLISHED' | translate}}" class="published-icon">radio_button_checked</mat-icon> -->
</div>
<div class="col">
<div class="row d-flex flex-wrap">

View File

@ -86,3 +86,23 @@ p {
.description {
margin-bottom: 0.4em;
}
.outer-circle {
background: #08bd6342;
border-radius: 50%;
width: 20px;
height: 20px;
position: relative;
margin-top: 3px;
}
.inner-circle {
position: absolute;
background: #08bd63;
border-radius: 50%;
height: 10px;
width: 10px;
top: 50%;
left: 50%;
margin: -5px 0px 0px -5px;
}

View File

@ -8,9 +8,7 @@
</div>
<div class="row">
<div class="col-auto">
<div class="outer-circle">
<div class="inner-circle" matTooltip="{{'DMP-PUBLIC-LISTING.TOOLTIP.PUBLISHED' | translate}}"></div>
</div>
<div class="outer-circle"><div class="inner-circle" matTooltip="{{'DMP-PUBLIC-LISTING.TOOLTIP.PUBLISHED' | translate}}"></div></div>
<!-- <mat-icon matTooltip="{{'DMP-PUBLIC-LISTING.TOOLTIP.PUBLISHED' | translate}}" class="published-icon">fiber_manual_record</mat-icon> -->
<!-- <mat-icon matTooltip="{{'DMP-PUBLIC-LISTING.TOOLTIP.PUBLISHED' | translate}}" class="published-icon">radio_button_checked</mat-icon> -->
</div>