Skip to content

Improvement for tips/hint support #54

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/dashboard/settings.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
<div class="vue-core-video-player-control settings-control">
<div class="btn-control btn-settings" @click="toggle">
<svg xmlns="http://www.w3.org/2000/svg" width="31.971" height="31.971" viewBox="0 0 31.971 31.971"><g data-name="7" transform="translate(6.985 6.985)" fill="none" stroke="#fff" stroke-width="5"><circle cx="9" cy="9" r="9" stroke="none"/><circle cx="9" cy="9" r="6.5"/></g><g data-name="15 10" fill="#fff"><g data-name="14 1"><g data-name="13 1"><path data-name="17" d="M13.985 3.985h4v3h-4z"/><path data-name="4" d="M15.985 3.985l3 4h-6z"/></g><g data-name="13 2"><path data-name="17" d="M17.985 27.985h-4v-3h4z"/><path data-name="4" d="M15.985 27.985l-3-4h6z"/></g></g><g data-name="14 2"><g data-name="13 1"><path data-name="17" d="M23.056 6.085l2.829 2.829-2.122 2.12-2.828-2.828z"/><path data-name="4" d="M24.47 7.5l-.707 4.95-4.242-4.244z"/></g><g data-name="13 2"><path data-name="17" d="M8.914 25.884l-2.828-2.828 2.12-2.122 2.83 2.829z"/><path data-name="4" d="M7.5 24.47l.707-4.95 4.243 4.243z"/></g></g></g><g data-name="15 11" fill="#fff"><g data-name="14 1"><g data-name="13 1"><path data-name="17" d="M23.056 6.086l2.828 2.828-2.12 2.122-2.83-2.829z"/><path data-name="4" d="M24.47 7.5l-.707 4.95-4.242-4.243z"/></g><g data-name="13 2"><path data-name="17" d="M8.914 25.885l-2.828-2.828 2.12-2.122 2.83 2.829z"/><path data-name="4" d="M7.5 24.47l.707-4.949 4.242 4.243z"/></g></g><g data-name="14 2"><g data-name="13 1"><path data-name="17" d="M27.985 13.985v4h-3v-4z"/><path data-name="4" d="M27.985 15.985l-4 3v-6z"/></g><g data-name="13 2"><path data-name="17" d="M3.985 17.985v-4h3v4z"/><path data-name="4" d="M3.985 15.985l4-3v6z"/></g></g></g><g data-name="15 12" fill="#fff"><g data-name="14 1"><g data-name="13 1"><path data-name="17" d="M27.985 13.985v4h-3v-4z"/><path data-name="4" d="M27.985 15.985l-4 3v-6z"/></g><g data-name="13 2"><path data-name="17" d="M3.985 17.985v-4h3v4z"/><path data-name="4" d="M3.985 15.985l4-3v6z"/></g></g><g data-name="14 2"><g data-name="13 1"><path data-name="17" d="M25.885 23.056l-2.829 2.829-2.12-2.122 2.828-2.828z"/><path data-name="4" d="M24.47 24.47l-4.95-.707 4.244-4.242z"/></g><g data-name="13 2"><path data-name="17" d="M6.086 8.914l2.828-2.828 2.122 2.12-2.829 2.83z"/><path data-name="4" d="M7.5 7.5l4.95.707-4.243 4.243z"/></g></g></g></svg>
<div class="tips">{{$t('dashboard.btn.settings')}}</div>
</div>
<div class="btn-control-panel" @click="preventHide" v-show="panelShow">
<ul class="current-panel" v-show="currentPanel">
Expand Down
2 changes: 2 additions & 0 deletions src/dashboard/volume.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,11 @@
<div class="vue-core-video-player-control volume-control">
<div class="btn-control btn-volume" v-if="!isMuted" @click="toggle">
<svg xmlns="http://www.w3.org/2000/svg" width="23.542" height="23" viewBox="0 0 23.542 23"><path data-name="15" fill="#fff" d="M0 5.5h7v12H0z"/><path data-name="3" d="M.5 11.5L12.5 0v23z" fill="#fff"/><g data-name="12 1" fill="none" stroke="#fff" stroke-width="1.5"><path data-name="2" d="M15.787 8.349a2.89 2.89 0 0 1 3.04 3.126 2.763 2.763 0 0 1-3.142 2.833" stroke-width="1.50021"/><path data-name="3" d="M16.052 4.807s6.917-.147 6.61 6.796-6.83 6.16-6.83 6.16" stroke-width="1.50021"/></g></svg>
<div class="tips">{{$t('dashboard.btn.mute')}}</div>
</div>
<div class="btn-control btn-mute" v-if="isMuted" @click="toggle">
<svg xmlns="http://www.w3.org/2000/svg" width="24.485" height="23" viewBox="0 0 24.485 23"><g fill="#fff"><path data-name="矩形 15" d="M0 5.5h7v12H0z"/><path data-name="多边形 3" d="M.5 11.5L12.5 0v23z"/><g data-name="组 3"><path data-name="矩形 39" d="M23.071 7.257l1.414 1.414-7.07 7.071L16 14.328z"/><path data-name="矩形 40" d="M16 8.672l1.414-1.414 7.071 7.07-1.414 1.415z"/></g></g></svg>
<div class="tips">{{$t('dashboard.btn.unmute')}}</div>
</div>

<div class="btn-control-panel">
Expand Down
3 changes: 2 additions & 1 deletion src/lang/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
"mute": "Mute",
"unmute": "Unmute",
"back": "Back",
"pip": "Picture-in-Picture"
"pip": "Picture-in-Picture",
"settings": "Settings"
},
"settings" : {
"autoplay": "Autoplay",
Expand Down
3 changes: 2 additions & 1 deletion src/lang/jp.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
"mute": "ミュート",
"unmute": "ミュートを解除",
"back": "戻る",
"pip": "ピクチャインピクチャ"
"pip": "ピクチャインピクチャ",
"settings": "設定"
},
"settings" : {
"autoplay": "自動再生",
Expand Down
3 changes: 2 additions & 1 deletion src/lang/zh-cn.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
"mute": "静音",
"unmute": "取消静音",
"back": "返回",
"pip": "画中画模式"
"pip": "画中画模式",
"settings": "设置"
},
"settings" : {
"autoplay": "自动播放",
Expand Down
2 changes: 2 additions & 0 deletions src/layers/play-pause-layer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,11 @@
<div class="vcp-layer play-pause-layer" v-show="show">
<a href="javascript:;" v-if="!isPlaying" class="btn-control btn-play" @click="play">
<svg xmlns="http://www.w3.org/2000/svg" width="31" height="35" viewBox="0 0 41 47"><path d="M23.5,0,47,41H0Z" transform="translate(41) rotate(90)" fill="#ff6060"/></svg>
<div class="tips tips--loose">{{$t('dashboard.btn.play')}}</div>
</a>
<a href="javascript:;" v-if="isPlaying" class="btn-control btn-pause" @click="pause">
<svg xmlns="http://www.w3.org/2000/svg" width="27" height="36" viewBox="0 0 36 48"><g transform="translate(-950 -398)"><rect width="12" height="48" transform="translate(950 398)" fill="#ff6060"/><rect width="12" height="48" transform="translate(974 398)" fill="#ff6060"/></g></svg>
<div class="tips tips--loose">{{$t('dashboard.btn.pause')}}</div>
</a>
</div>
</template>
Expand Down
9 changes: 7 additions & 2 deletions src/style/common.less
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@
min-width: 30px;
padding: 4px;
border-radius: 2px;
bottom: 54px;
bottom: 28px;
left: 50%;
transform: translateX(-50%);
font-size: 12px;
Expand All @@ -97,11 +97,16 @@
text-align: center;
line-height: 1.2;
word-break: keep-all;
word-wrap: no-wrap;
word-wrap: normal;
white-space: nowrap;
opacity: 0;
transition: opacity .15s ease-in;
}

.tips--loose {
bottom: 54px;
}

svg {
opacity: .85;
transition: opacity .1s ease;
Expand Down