Commit f4b162de authored by liujiangnan's avatar liujiangnan

feat: 添加背景色

parent 1e983049
<div class="vocabulary-container">
<div class="player-border">
<div class="vocabulary-container">
<div class="content-wrap">
<div class="top-line">
<img class="star" src="assets/vocabulary/star.png" alt="" size="20">
......@@ -20,4 +21,5 @@
<img [src]="data.contentObj.pic_id" alt="" (dragstart)="false;$event.preventDefault();"/>
</div>
</div>
</div>
</div>
\ No newline at end of file
.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;
}
.vocabulary-container {
text-align: left;
height: 100%;
......
import { Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener, OnChanges, AfterViewInit } from '@angular/core';
import { Component, ElementRef, ViewChild, ApplicationRef,ChangeDetectorRef, OnInit, Input, OnDestroy, HostListener, OnChanges, AfterViewInit } from '@angular/core';
import * as _ from 'lodash';
import { animate, state, style, transition, trigger } from '@angular/animations';
......@@ -23,7 +23,8 @@ export class PlayComponent implements OnInit, OnDestroy, OnChanges, AfterViewIni
vocabularyPlaying = false;
definitionPlaying = false;
constructor() {
constructor(private appRef: ApplicationRef,
public changeDetectorRef: ChangeDetectorRef) {
this.vocabulary_audio.onplay = () => {
this.vocabularyPlaying = true;
};
......@@ -64,6 +65,7 @@ export class PlayComponent implements OnInit, OnDestroy, OnChanges, AfterViewIni
}
this.init();
window["air"].hideAirClassLoading(this.saveKey, this.data);
this.refresh();
}, this.saveKey);
}
......@@ -127,5 +129,11 @@ export class PlayComponent implements OnInit, OnDestroy, OnChanges, AfterViewIni
}
}
refresh() {
setTimeout(() => {
this.appRef.tick();
}, 1);
}
}
......@@ -10,7 +10,7 @@
<script type="text/javascript" src="https://staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"></script>
</head>
<body>
<body style="background-image: url('./assets/player-bg.jpg')">
<app-root></app-root>
</body>
</html>
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