Skip to content

Commit

Permalink
修改键盘支持满屏
Browse files Browse the repository at this point in the history
  • Loading branch information
@youshao
youshao committed Dec 29, 2017
1 parent e9fc26a commit adc36db
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 19 deletions.
36 changes: 24 additions & 12 deletions keyboard/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -158,19 +158,22 @@ class CxyKeyboard {
return {
name: item,
value: item,
className: styles.aBox
className: styles.aBox,
boxClassName: styles.aBoxBox
}
case 'BACK':
return {
name: item,
value: '地区',
className: styles.backBtn
className: styles.backBtn,
boxClassName: styles.keyBox15
};
case 'DEL':
return {
name: 'DEL',
value: '',
className: styles.delBtn
className: styles.delBtn,
boxClassName: styles.keyBox15
}
default:
return {
Expand All @@ -190,13 +193,15 @@ class CxyKeyboard {
return {
name: item,
value: item,
className: styles.abcBox
className: styles.abcBox,
boxClassName: styles.keyBox15
}
case 'DEL':
return {
name: 'DEL',
value: '',
className: styles.delBtn
className: styles.delBtn,
boxClassName: styles.keyBox15
}
default:
return {
Expand All @@ -216,19 +221,23 @@ class CxyKeyboard {
return {
name: item,
value: item,
className: styles.aBox
className: styles.aBox,
boxClassName: styles.aBoxBox

}
case 'SWITCH_URL':
return {
name: 'SWITCH_URL', // 切换到大写字母+数字键盘
value: 'A',
className: styles.switchBtn
className: styles.switchBtn,
boxClassName: styles.keyBox15
};
case 'DEL':
return {
name: 'DEL',
value: '',
className: styles.delBtn
className: styles.delBtn,
boxClassName: styles.keyBox15
}
default:
return {
Expand All @@ -247,19 +256,22 @@ class CxyKeyboard {
return {
name: item,
value: item,
className: styles.aBox
className: styles.aBox,
boxClassName: styles.aBoxBox
}
case 'SWITCH_url':
return {
name: 'SWITCH_url', // 切换到小写字母+符号键盘
value: 'a',
className: styles.switchBtn
className: styles.switchBtn,
boxClassName: styles.keyBox15
};
case 'DEL':
return {
name: 'DEL',
value: '',
className: styles.delBtn
className: styles.delBtn,
boxClassName: styles.keyBox15
}
default:
return {
Expand Down Expand Up @@ -370,7 +382,7 @@ class CxyKeyboard {
} else {
return `<div class="${styles.defaultKeyboard}">
${keys.map(item => `
<div keyboard-key-name="${item.name}" class="${styles.keyBox}">
<div keyboard-key-name="${item.name}" class="${styles.keyBox + ' ' + item.boxClassName}">
<span class="${styles.key + ' ' + (item.className || '')}">${item.value || ''}</span>
</div>
`).join('')}
Expand Down
20 changes: 13 additions & 7 deletions keyboard/index.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,12 +35,12 @@ $font-family-zh: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Mi
// 键盘按键
.keys{
position: fixed;
left: 50%;
left: 0;
right: 0;
bottom: 0;
right: 0;
height: 430px;
width: 750px;
transform: translateX(-50%);
width: 100%;
background: #d1d5da;
color: #000;
z-index: 9999;
Expand Down Expand Up @@ -73,13 +73,17 @@ $font-family-zh: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Mi
.keyBox{
float: left;
overflow: hidden;
min-width: 10%;
}
.keyBox15{
min-width: 15%;
}

// 按键
.key{
float: left;
position: relative;
margin: 10px 5px;
margin: 10px auto;
display: block;
height: 85px;
width: 65px;
background: #fff;
Expand All @@ -93,8 +97,11 @@ $font-family-zh: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Mi
}

// 字面A键
.aBoxBox{
margin-left: 5%;
}
.aBox{
margin-left: 40px;

}

// 特殊按键
Expand All @@ -106,7 +113,6 @@ $font-family-zh: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Mi

// 删除键
.delBtn{
margin-right: 0;
background: #adb3bc url("./images/svg/del.svg") no-repeat center center;
background-size: 48px;
}
Expand Down

0 comments on commit adc36db

Please sign in to comment.