Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
M
mycard
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Locked Files
Issues
0
Issues
0
List
Boards
Labels
Service Desk
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Security & Compliance
Security & Compliance
Dependency List
License Compliance
Packages
Packages
List
Container Registry
Analytics
Analytics
CI / CD
Code Review
Insights
Issues
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
syntax_j
mycard
Commits
893b0bb6
Commit
893b0bb6
authored
Apr 26, 2017
by
2breakegg
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
style
parent
e563544a
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
57 additions
and
31 deletions
+57
-31
app/cube-description/cube-description.component.css
app/cube-description/cube-description.component.css
+20
-0
app/cube-description/cube-description.component.html
app/cube-description/cube-description.component.html
+37
-31
No files found.
app/cube-description/cube-description.component.css
View file @
893b0bb6
...
...
@@ -111,6 +111,26 @@ img {
box-sizing
:
initial
;
}
.appear
{
animation
:
appear
0.5s
;
opacity
:
1
;
z-index
:
100
}
.disappear
{
animation
:
disappear
0.5s
;
opacity
:
0
;
z-index
:
0
}
@keyframes
appear
{
from
{
opacity
:
0
;
z-index
:
0
}
to
{
opacity
:
1
;
z-index
:
100
}
}
@keyframes
disappear
{
from
{
opacity
:
1
;
z-index
:
100
}
to
{
opacity
:
0
;
z-index
:
0
}
}
/*#left {*/
/*font-size: 14px;*/
/*margin-right: 8px;*/
...
...
app/cube-description/cube-description.component.html
View file @
893b0bb6
...
...
@@ -3,46 +3,52 @@
<div
class=
"left-box col-md-8"
>
<div
class=
"left-big-item-box"
(mouseout)=
"carouselUnlock()"
(mouseover)=
"carouselLock_f()"
>
<div
class=
"make-div-16-9"
></div>
<div
class=
"left-big-item"
[style.opacity]=
"selectId<videosrc.length ? 1:0"
[style.display]=
"selectId<videosrc.length? 'block':'none'"
*ngIf=
"videosrc.length"
>
<video
controls=
""
name=
"video"
(ended)=
"nextvedio(selectId)"
autoplay=
"true"
[src]=
"videosrc_now"
type=
"video/webm"
></video>
</div>
<div
*ngFor=
"let src of imgsrc ; index as key"
class=
"left-big-item"
[style.opacity]=
"divOpacity[key+videosrc.length]"
[style.display]=
"divOpacity[key+videosrc.length]? 'block':'none'"
>
<img
class=
"img-fixed"
[src]=
"src"
/>
</div>
<div
class=
"left-big-item"
[ngClass]=
"{'disappear':!(selectId<videosrc.length), 'appear':(selectId<videosrc.length) }"
>
<video
controls=
""
name=
"video"
(ended)=
"nextvedio(selectId)"
autoplay=
"true"
[src]=
"videosrc_now"
type=
"video/webm"
></video>
</div>
<div
*ngFor=
"let src of imgsrc ; index as key"
class=
"left-big-item"
[ngClass]=
"{'disappear':!divOpacity[key+videosrc.length], 'appear':!!divOpacity[key+videosrc.length]}"
>
<img
class=
"img-fixed"
[src]=
"src"
/>
</div>
</div>
<div
class=
"left-small-item-box-overflow"
>
<div
class=
"left-small-item-box"
>
<div
class=
"select-rectangle"
[style.left]=
"(2+120*selectId)+'px'"
(mouseout)=
"carouselUnlock()"
(mouseover)=
"carouselLock_f()"
></div>
<div
*ngFor=
"let src of videosrc ; index as key"
class=
"left-small-item"
(click)=
"select(key);"
>
<img
class=
"img-fixed"
[src]=
"src[1]"
/>
<i
class=
"fa fa-play-circle icon_play"
aria-hidden=
"true"
></i
>
<
/div
>
<div
*ngFor=
"let src of imgsrc ; index as key"
class=
"left-small-item"
(click)=
"select(key+videosrc.length)"
>
<img
class=
"img-fixed"
[src]=
"src"
/
>
<
/div
>
<div
class=
"left-small-item-box-overflow"
>
<div
class=
"left-small-item-box"
>
<div
class=
"select-rectangle"
[style.left]=
"(2+120*selectId)+'px'"
(mouseout)=
"carouselUnlock()"
(mouseover)=
"carouselLock_f()"
></div
>
<div
*ngFor=
"let src of videosrc ; index as key"
class=
"left-small-item"
(click)=
"select(key);"
>
<
img
class=
"img-fixed"
[src]=
"src[1]"
/>
<i
class=
"fa fa-play-circle icon_play"
aria-hidden=
"true"
></i
>
</div
>
<div
*ngFor=
"let src of imgsrc ; index as key"
class=
"left-small-item"
(click)=
"select(key+videosrc.length)"
>
<
img
class=
"img-fixed"
[src]=
"src"
/
>
</div>
</div>
</div>
</div>
<div
class=
"right-box col-md-4"
>
<img
[src]=
"imgsrc[0]"
/>
<p
[innerHTML]=
"currentCube.description"
></p>
<dl>
<dt
i18n
>
开发
</dt>
<dd>
<div
*ngFor=
"let developer of currentCube.developers"
>
<a
*ngIf=
"developer.url"
target=
"_blank"
[href]=
"developer.url"
>
{{developer.name}}
</a>
<span
*ngIf=
"!developer.url"
>
{{developer.name}}
</span>
</div>
</dd>
<dt
i18n
>
发行日期
</dt>
<dd>
{{currentCube.released_at | date:'mediumDate'}}
</dd>
</dl>
<div
id=
"tags"
*ngIf=
"currentCube.tags"
>
<div
i18n
*ngFor=
"let tag of currentCube.tags"
class=
"btn btn-sm btn-danger tag"
>
{tag, select, installed {已安装} test {测试} recommend {推荐} mysterious {迷之物体} touhou {东方 Project} touhou_pc98 {东方旧作} runtime_installed{已安装的运行库} }
</div>
<div
class=
"right-box col-md-4"
>
<img
[src]=
"imgsrc[0]"
/>
<p
[innerHTML]=
"currentCube.description"
></p>
<dl>
<dt
i18n
>
开发
</dt>
<dd>
<div
*ngFor=
"let developer of currentCube.developers"
>
<a
*ngIf=
"developer.url"
target=
"_blank"
[href]=
"developer.url"
>
{{developer.name}}
</a>
<span
*ngIf=
"!developer.url"
>
{{developer.name}}
</span>
</div>
</dd>
<dt
i18n
>
发行日期
</dt>
<dd>
{{currentCube.released_at | date:'mediumDate'}}
</dd>
</dl>
<div
id=
"tags"
*ngIf=
"currentCube.tags"
>
<div
i18n
*ngFor=
"let tag of currentCube.tags"
class=
"btn btn-sm btn-danger tag"
>
{tag, select, installed {已安装}
test {测试} recommend {推荐} mysterious {迷之物体} touhou {东方 Project} touhou_pc98 {东方旧作} runtime_installed{已安装的运行库} }
</div>
</div>
</div>
</div>
<!--<div class="panel" id="left">--><!--<p [innerHTML]="currentCube.description"></p>--><!--<div id="tags" *ngIf="currentCube.tags">--><!--<div i18n *ngFor="let tag of currentCube.tags" class="btn btn-sm btn-danger tag">{tag, select, installed {已安装} test {测试} recommend {推荐} mysterious {迷之物体} touhou {东方 Project} touhou_pc98 {东方旧作} runtime_installed{已安装的运行库} }</div>--><!--</div>--><!--</div>--><!--<div class="panel" id="right">--><!--<dl>--><!--<dt i18n>开发</dt>--><!--<dd>--><!--<div *ngFor="let developer of currentCube.developers">--><!--<a *ngIf="developer.url" target="_blank" [href]="developer.url">{{developer.name}}</a>--><!--<span *ngIf="!developer.url">{{developer.name}}</span>--><!--</div>--><!--</dd>-->
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment