new danmaku sending panel
This commit is contained in:
DIYgod
parent
c145ecfe90
commit
db5483ef12
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "dplayer",
|
||||
"version": "1.13.0",
|
||||
"version": "1.14.0",
|
||||
"description": "Wow, such a lovely HTML5 danmaku video player",
|
||||
"main": "dist/DPlayer.min.js",
|
||||
"style": "dist/DPlayer.min.css",
|
||||
|
|
|
|||
|
|
@ -334,7 +334,7 @@ class DPlayer {
|
|||
this.container.classList.remove('dplayer-hide-controller');
|
||||
clearTimeout(this.hideTime);
|
||||
this.hideTime = setTimeout(() => {
|
||||
if (this.video.played.length) {
|
||||
if (this.video.played.length && !this.disableHideController) {
|
||||
this.container.classList.add('dplayer-hide-controller');
|
||||
closeSetting();
|
||||
closeComment();
|
||||
|
|
@ -368,8 +368,12 @@ class DPlayer {
|
|||
settingEvent();
|
||||
}, 300);
|
||||
}
|
||||
|
||||
this.disableHideController = false;
|
||||
};
|
||||
const openSetting = () => {
|
||||
this.disableHideController = true;
|
||||
|
||||
settingBox.classList.add('dplayer-setting-box-open');
|
||||
mask.classList.add('dplayer-mask-show');
|
||||
};
|
||||
|
|
@ -523,9 +527,9 @@ class DPlayer {
|
|||
/**
|
||||
* comment
|
||||
*/
|
||||
const controller = this.container.getElementsByClassName('dplayer-controller')[0];
|
||||
const commentInput = this.container.getElementsByClassName('dplayer-comment-input')[0];
|
||||
const commentIcon = this.container.getElementsByClassName('dplayer-comment-icon')[0];
|
||||
const commentBox = this.container.getElementsByClassName('dplayer-comment-box')[0];
|
||||
const commentSettingIcon = this.container.getElementsByClassName('dplayer-comment-setting-icon')[0];
|
||||
const commentSettingBox = this.container.getElementsByClassName('dplayer-comment-setting-box')[0];
|
||||
const commentSendIcon = this.container.getElementsByClassName('dplayer-send-icon')[0];
|
||||
|
|
@ -544,36 +548,28 @@ class DPlayer {
|
|||
}
|
||||
};
|
||||
|
||||
let disableHide = 0;
|
||||
let commentFocusTimeout = 0;
|
||||
const closeComment = () => {
|
||||
if (!commentBox.classList.contains('dplayer-comment-box-open')) {
|
||||
if (!controller.classList.contains('dplayer-controller-comment')) {
|
||||
return;
|
||||
}
|
||||
|
||||
commentBox.classList.remove('dplayer-comment-box-open');
|
||||
controller.classList.remove('dplayer-controller-comment');
|
||||
mask.classList.remove('dplayer-mask-show');
|
||||
this.container.classList.remove('dplayer-show-controller');
|
||||
|
||||
clearInterval(disableHide);
|
||||
clearTimeout(commentFocusTimeout);
|
||||
closeCommentSetting();
|
||||
|
||||
this.disableHideController = false;
|
||||
};
|
||||
const openComment = () => {
|
||||
if (commentBox.classList.contains('dplayer-comment-box-open')) {
|
||||
return;
|
||||
}
|
||||
this.disableHideController = true;
|
||||
|
||||
commentBox.classList.add('dplayer-comment-box-open');
|
||||
mask.classList.add('dplayer-mask-show');
|
||||
this.container.classList.add('dplayer-show-controller');
|
||||
|
||||
disableHide = setInterval(() => {
|
||||
clearTimeout(this.hideTime);
|
||||
}, 1000);
|
||||
commentFocusTimeout = setTimeout(() => {
|
||||
if (!controller.classList.contains('dplayer-controller-comment')) {
|
||||
controller.classList.add('dplayer-controller-comment');
|
||||
mask.classList.add('dplayer-mask-show');
|
||||
this.container.classList.add('dplayer-show-controller');
|
||||
commentInput.focus();
|
||||
}, 300);
|
||||
}
|
||||
};
|
||||
|
||||
mask.addEventListener('click', () => {
|
||||
|
|
@ -587,10 +583,14 @@ class DPlayer {
|
|||
});
|
||||
|
||||
// comment setting box
|
||||
this.container.getElementsByClassName('dplayer-comment-setting-color')[0].addEventListener('click', () => {
|
||||
const sele = this.container.querySelector('input[name="dplayer-danmaku-color-${index}"]:checked+span');
|
||||
const colorSetting = this.container.getElementsByClassName('dplayer-comment-setting-color')[0];
|
||||
colorSetting.addEventListener('click', () => {
|
||||
const sele = colorSetting.querySelector(`input:checked+span`);
|
||||
if (sele) {
|
||||
commentSettingIcon.getElementsByClassName('dplayer-fill')[0].style.fill = this.container.querySelector('input[name="dplayer-danmaku-color-${index}"]:checked').value;
|
||||
const color = colorSetting.querySelector(`input:checked`).value;
|
||||
commentSettingIcon.getElementsByClassName('dplayer-fill')[0].style.fill = color;
|
||||
commentInput.style.color = color;
|
||||
commentSendIcon.getElementsByClassName('dplayer-fill')[0].style.fill = color;
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
322
src/DPlayer.scss
322
src/DPlayer.scss
|
|
@ -376,6 +376,16 @@
|
|||
user-select: none;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&.dplayer-controller-comment {
|
||||
.dplayer-icons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dplayer-icons.dplayer-comment-box {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-bar-wrap {
|
||||
padding: 5px 0;
|
||||
cursor: pointer;
|
||||
|
|
@ -476,6 +486,156 @@
|
|||
position: absolute;
|
||||
bottom: 0;
|
||||
|
||||
&.dplayer-comment-box {
|
||||
display: none;
|
||||
position: absolute;
|
||||
transition: all .3s ease-in-out;
|
||||
z-index: 2;
|
||||
height: 38px;
|
||||
bottom: 0;
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
color: #fff;
|
||||
|
||||
.dplayer-icon {
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-icon {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.dplayer-send-icon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-box {
|
||||
position: absolute;
|
||||
background: rgba(28, 28, 28, 0.9);
|
||||
bottom: 41px;
|
||||
left: 0;
|
||||
box-shadow: 0 0 25px rgba(0,0,0,.3);
|
||||
border-radius: 4px;
|
||||
padding: 10px 10px 16px;
|
||||
font-size: 14px;
|
||||
width: 204px;
|
||||
transition: all .3s ease-in-out;
|
||||
transform: scale(0);
|
||||
|
||||
&.dplayer-comment-setting-open {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
input[type=radio] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-title {
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-type {
|
||||
font-size: 0;
|
||||
|
||||
.dplayer-comment-setting-title {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
label {
|
||||
&:nth-child(2) {
|
||||
span {
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
}
|
||||
&:nth-child(4) {
|
||||
span {
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
width: 33%;
|
||||
padding: 4px 6px;
|
||||
line-height: 16px;
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
border: 1px solid #fff;
|
||||
margin-right: -1px;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input:checked+span {
|
||||
background: #E4E4E6;
|
||||
color: #1c1c1c;
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-color {
|
||||
font-size: 0;
|
||||
|
||||
label {
|
||||
font-size: 0;
|
||||
padding: 6px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
span {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
animation: my-face 5s infinite ease-in-out;
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
}
|
||||
}
|
||||
|
||||
input:checked+span {
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-comment-input {
|
||||
outline: none;
|
||||
border: none;
|
||||
padding: 8px 31px;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
background: none;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
|
||||
&::placeholder {
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.dplayer-icons-left {
|
||||
.dplayer-icon {
|
||||
padding: 7px;
|
||||
|
|
@ -489,11 +649,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
#dplayer-menu {
|
||||
stroke: #ddd;
|
||||
stroke-width: 1px;
|
||||
}
|
||||
|
||||
.dplayer-time {
|
||||
line-height: 38px;
|
||||
color: #eee;
|
||||
|
|
@ -624,7 +779,7 @@
|
|||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 50px;
|
||||
transform: translateX(170px);
|
||||
transform: scale(0);
|
||||
width: 150px;
|
||||
border-radius: 2px;
|
||||
background: rgba(28, 28, 28, 0.9);
|
||||
|
|
@ -634,7 +789,7 @@
|
|||
z-index: 2;
|
||||
|
||||
&.dplayer-setting-box-open {
|
||||
transform: translateX(0);
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
&.dplayer-setting-box-narrow {
|
||||
|
|
@ -799,158 +954,7 @@
|
|||
display: inline-block;
|
||||
height: 100%;
|
||||
|
||||
.dplayer-comment-box {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 50px;
|
||||
transform: translateX(382px);
|
||||
border-radius: 2px;
|
||||
transition: all .3s ease-in-out;
|
||||
z-index: 2;
|
||||
|
||||
&.dplayer-comment-box-open {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-icon {
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 7px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-box {
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
bottom: 40px;
|
||||
left: -93px;
|
||||
box-shadow: 0 0 25px rgba(0,0,0,.3);
|
||||
border-radius: 4px;
|
||||
padding: 10px 10px 16px;
|
||||
font-size: 14px;
|
||||
width: 204px;
|
||||
transition: all .3s ease-in-out;
|
||||
transform: scale(0);
|
||||
|
||||
&.dplayer-comment-setting-open {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
margin-left: -12px;
|
||||
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 12"><path fill="#FFF" d="M23.7,0c-1.2,0-2.4,0.5-3.2,1.3l-7.7,7.8c-0.4,0.4-1.1,0.4-1.5,0L3.5,1.3C2.7,0.5,1.5,0,0.3,0"/></svg>');
|
||||
width: 24px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
input[type=radio] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-title {
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-type {
|
||||
font-size: 0;
|
||||
|
||||
label {
|
||||
&:nth-child(2) {
|
||||
span {
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
}
|
||||
&:nth-child(4) {
|
||||
span {
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
width: 33%;
|
||||
padding: 4px 6px;
|
||||
line-height: 16px;
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
border: 1px solid #E4E4E6;
|
||||
margin-right: -1px;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input:checked+span {
|
||||
background: #E4E4E6;
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-comment-setting-color {
|
||||
font-size: 0;
|
||||
|
||||
label {
|
||||
font-size: 0;
|
||||
padding: 6px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
span {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
animation: my-face 5s infinite ease-in-out;
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
}
|
||||
}
|
||||
|
||||
input:checked+span {
|
||||
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dplayer-comment-input {
|
||||
outline: none;
|
||||
border: none;
|
||||
padding: 8px 31px;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
width: 300px;
|
||||
background: #fff;
|
||||
margin: 0;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.dplayer-send-icon {
|
||||
height: 22px;
|
||||
width: 22px;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 7px;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.dplayer-label {
|
||||
|
|
|
|||
106
src/html.js
106
src/html.js
|
|
@ -45,6 +45,59 @@ const html = {
|
|||
</div>
|
||||
<div class="dplayer-controller-mask"></div>
|
||||
<div class="dplayer-controller">
|
||||
<div class="dplayer-icons dplayer-comment-box">
|
||||
<button class="dplayer-icon dplayer-comment-setting-icon" data-balloon="${tran('Setting')}" data-balloon-pos="up">
|
||||
<span class="dplayer-icon-content">${icons.get('pallette')}</span>
|
||||
</button>
|
||||
<div class="dplayer-comment-setting-box">
|
||||
<div class="dplayer-comment-setting-color">
|
||||
<div class="dplayer-comment-setting-title">${tran('Set danmaku color')}</div>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#fff" checked>
|
||||
<span style="background: #fff;"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#e54256">
|
||||
<span style="background: #e54256"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#ffe133">
|
||||
<span style="background: #ffe133"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#64DD17">
|
||||
<span style="background: #64DD17"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#39ccff">
|
||||
<span style="background: #39ccff"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#D500F9">
|
||||
<span style="background: #D500F9"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="dplayer-comment-setting-type">
|
||||
<div class="dplayer-comment-setting-title">${tran('Set danmaku type')}</div>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="top">
|
||||
<span>${tran('Top')}</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="right" checked>
|
||||
<span>${tran('Rolling')}</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="bottom">
|
||||
<span>${tran('Bottom')}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<input class="dplayer-comment-input" type="text" placeholder="${tran('Input danmaku, hit Enter')}" maxlength="30">
|
||||
<button class="dplayer-icon dplayer-send-icon" data-balloon="${tran('Send')}" data-balloon-pos="up">
|
||||
<span class="dplayer-icon-content">${icons.get('send')}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="dplayer-icons dplayer-icons-left">
|
||||
<button class="dplayer-icon dplayer-play-icon">
|
||||
<span class="dplayer-icon-content">${icons.get('play')}</span>
|
||||
|
|
@ -81,59 +134,6 @@ const html = {
|
|||
<button class="dplayer-icon dplayer-comment-icon" data-balloon="${tran('Send danmaku')}" data-balloon-pos="up">
|
||||
<span class="dplayer-icon-content">${icons.get('comment')}</span>
|
||||
</button>
|
||||
<div class="dplayer-comment-box">
|
||||
<button class="dplayer-icon dplayer-comment-setting-icon" data-balloon="${tran('Setting')}" data-balloon-pos="up">
|
||||
<span class="dplayer-icon-content">${icons.get('menu')}</span>
|
||||
</button>
|
||||
<div class="dplayer-comment-setting-box">
|
||||
<div class="dplayer-comment-setting-color">
|
||||
<div class="dplayer-comment-setting-title">${tran('Set danmaku color')}</div>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#fff" checked>
|
||||
<span style="background: #fff; border: 1px solid rgba(0,0,0,.1);"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#e54256">
|
||||
<span style="background: #e54256"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#ffe133">
|
||||
<span style="background: #ffe133"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#64DD17">
|
||||
<span style="background: #64DD17"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#39ccff">
|
||||
<span style="background: #39ccff"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-color-${index}" value="#D500F9">
|
||||
<span style="background: #D500F9"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="dplayer-comment-setting-type">
|
||||
<div class="dplayer-comment-setting-title">${tran('Set danmaku type')}</div>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="top">
|
||||
<span>${tran('Top')}</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="right" checked>
|
||||
<span>${tran('Rolling')}</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="dplayer-danmaku-type-${index}" value="bottom">
|
||||
<span>${tran('Bottom')}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<input class="dplayer-comment-input" type="text" placeholder="${tran('Input danmaku, hit Enter')}" maxlength="30">
|
||||
<button class="dplayer-icon dplayer-send-icon" data-balloon="${tran('Send')}" data-balloon-pos="up">
|
||||
<span class="dplayer-icon-content">${icons.get('send')}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
${options.subtitle ? `
|
||||
<div class="dplayer-subtitle-btn">
|
||||
|
|
|
|||
|
|
@ -74,9 +74,9 @@ module.exports = (options) => {
|
|||
'0 0 32 32',
|
||||
'M13.725 30l3.9-5.325-3.9-1.125v6.45zM0 17.5l11.050 3.35 13.6-11.55-10.55 12.425 11.8 3.65 6.1-23.375-32 15.5z'
|
||||
],
|
||||
menu: [
|
||||
'0 0 22 32',
|
||||
'M20.8 14.4q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2zM1.6 11.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2zM20.8 20.8q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2z'
|
||||
pallette: [
|
||||
'0 0 32 32',
|
||||
'M19.357 2.88c1.749 0 3.366 0.316 4.851 0.946 1.485 0.632 2.768 1.474 3.845 2.533s1.922 2.279 2.532 3.661c0.611 1.383 0.915 2.829 0.915 4.334 0 1.425-0.304 2.847-0.915 4.271-0.611 1.425-1.587 2.767-2.928 4.028-0.855 0.813-1.811 1.607-2.869 2.38s-2.136 1.465-3.233 2.075c-1.099 0.61-2.198 1.098-3.296 1.465-1.098 0.366-2.115 0.549-3.051 0.549-1.343 0-2.441-0.438-3.296-1.311-0.854-0.876-1.281-2.41-1.281-4.608 0-0.366 0.020-0.773 0.060-1.221s0.062-0.895 0.062-1.343c0-0.773-0.183-1.353-0.55-1.738-0.366-0.387-0.793-0.58-1.281-0.58-0.652 0-1.21 0.295-1.678 0.886s-0.926 1.23-1.373 1.921c-0.447 0.693-0.905 1.334-1.372 1.923s-1.028 0.886-1.679 0.886c-0.529 0-1.048-0.427-1.556-1.282s-0.763-2.259-0.763-4.212c0-2.197 0.529-4.241 1.587-6.133s2.462-3.529 4.21-4.912c1.75-1.383 3.762-2.471 6.041-3.264 2.277-0.796 4.617-1.212 7.018-1.253zM7.334 15.817c0.569 0 1.047-0.204 1.434-0.611s0.579-0.875 0.579-1.404c0-0.569-0.193-1.047-0.579-1.434s-0.864-0.579-1.434-0.579c-0.529 0-0.987 0.193-1.373 0.579s-0.58 0.864-0.58 1.434c0 0.53 0.194 0.998 0.58 1.404 0.388 0.407 0.845 0.611 1.373 0.611zM12.216 11.79c0.691 0 1.292-0.254 1.8-0.763s0.762-1.107 0.762-1.8c0-0.732-0.255-1.343-0.762-1.831-0.509-0.489-1.109-0.732-1.8-0.732-0.732 0-1.342 0.244-1.831 0.732-0.488 0.488-0.732 1.098-0.732 1.831 0 0.693 0.244 1.292 0.732 1.8s1.099 0.763 1.831 0.763zM16.366 25.947c0.692 0 1.282-0.214 1.77-0.64s0.732-0.987 0.732-1.678-0.244-1.261-0.732-1.709c-0.489-0.448-1.078-0.671-1.77-0.671-0.65 0-1.21 0.223-1.678 0.671s-0.702 1.018-0.702 1.709c0 0.692 0.234 1.25 0.702 1.678s1.027 0.64 1.678 0.64zM19.113 9.592c0.651 0 1.129-0.203 1.433-0.611 0.305-0.406 0.459-0.874 0.459-1.404 0-0.488-0.154-0.947-0.459-1.373-0.304-0.427-0.782-0.641-1.433-0.641-0.529 0-1.008 0.193-1.434 0.58s-0.64 0.865-0.64 1.434c0 0.571 0.213 1.049 0.64 1.434 0.427 0.389 0.905 0.581 1.434 0.581zM24.848 12.826c0.57 0 1.067-0.213 1.495-0.64 0.427-0.427 0.64-0.947 0.64-1.556 0-0.57-0.214-1.068-0.64-1.495-0.428-0.427-0.927-0.64-1.495-0.64-0.611 0-1.129 0.213-1.555 0.64-0.428 0.427-0.642 0.926-0.642 1.495 0 0.611 0.213 1.129 0.642 1.556s0.947 0.64 1.555 0.64z'
|
||||
],
|
||||
camera: [
|
||||
'0 0 32 32',
|
||||
|
|
|
|||
Loading…
Reference in New Issue