Commit 5c338051 authored by liujiangnan's avatar liujiangnan

feat: 背景色

parent 32b46ab0
<div class="k-full-fill p-content" <div class="body-bg"></div>
[style.background-color]="data.contentObj.bgColor" <div class="player-border">
(click)="playNextAnimation($event)" <div class="k-full-fill p-content"
> [style.background-color]="data.contentObj.bgColor"
<div class="k-16-9" appResize (resize)="resize($event)"> (click)="playNextAnimation($event)"
<div class="position-absolute p-box" #box >
> <div class="k-16-9" appResize (resize)="resize($event)">
<div class="position-absolute p-sentence {{item.animationClass}}" id="i-sentence-{{item.id}}" <div class="position-absolute p-box" #box
*ngFor="let item of data.contentObj.items; index as i;" >
#list <div class="position-absolute p-sentence {{item.animationClass}}" id="i-sentence-{{item.id}}"
appCustomStyle [customStyle]="item"> *ngFor="let item of data.contentObj.items; index as i;"
<span class="text" [innerHTML]="item.text | brLineBreaker" (click)="playOutAnimation($event, item)"></span> #list
appCustomStyle [customStyle]="item">
<span class="text" [innerHTML]="item.text | brLineBreaker" (click)="playOutAnimation($event, item)"></span>
</div>
</div> </div>
</div> </div>
</div> </div>
......
@import '../style/mixin'; @import '../style/mixin';
.body-bg {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-image: url('../../assets/player-bg.png') !important;
background-size: 100%;
}
.player-border{
position: absolute;
left: calc((100% - 100vh * 1.36)/ 2);
top: 5vh;
right: calc((100% - 100vh * 1.36)/ 2);
bottom: 5vh;
text-align: center;
// box-shadow: 0 2px 12px 0 rgba(0,0,0,.3);
border-radius: 11px;
border: 20px solid #23b1c2;
background-color: #fff;
overflow: hidden;
color: #303133;
transition: .3s;
}
.p-content { .p-content {
padding: 0vh 2vh; padding: 0vh 2vh;
display: flex; display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment