update itemsPerRow calculation
This commit is contained in:
parent
761ca72136
commit
9b7d30151f
|
@ -140,19 +140,33 @@ const EmojiPicker = {
|
||||||
},
|
},
|
||||||
updateEmojiSize () {
|
updateEmojiSize () {
|
||||||
const css = window.getComputedStyle(this.$refs.popover.$el)
|
const css = window.getComputedStyle(this.$refs.popover.$el)
|
||||||
|
const fontSize = css.getPropertyValue('font-size')
|
||||||
const emojiSize = css.getPropertyValue('--emojiSize')
|
const emojiSize = css.getPropertyValue('--emojiSize')
|
||||||
|
|
||||||
|
const fontSizeUnit = fontSize.replace(/[0-9,.]+/, '')
|
||||||
|
const fontSizeValue = Number(fontSize.replace(/[^0-9,.]+/, ''))
|
||||||
|
|
||||||
const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '')
|
const emojiSizeUnit = emojiSize.replace(/[0-9,.]+/, '')
|
||||||
const emojiSizeValue = Number(emojiSize.replace(/[^0-9,.]+/, ''))
|
const emojiSizeValue = Number(emojiSize.replace(/[^0-9,.]+/, ''))
|
||||||
const fontSize = css.getPropertyValue('font-size').replace(/[^0-9,.]+/, '')
|
|
||||||
|
let fontSizeMultiplier
|
||||||
|
if (fontSizeUnit.endsWith('em')) {
|
||||||
|
fontSizeMultiplier = fontSizeValue
|
||||||
|
} else {
|
||||||
|
fontSizeMultiplier = fontSizeValue / 14
|
||||||
|
}
|
||||||
|
console.log('Multiplier', fontSizeMultiplier)
|
||||||
|
console.log('Result', fontSizeMultiplier * 14)
|
||||||
|
|
||||||
let emojiSizeReal
|
let emojiSizeReal
|
||||||
if (emojiSizeUnit.endsWith('em')) {
|
if (emojiSizeUnit.endsWith('em')) {
|
||||||
emojiSizeReal = emojiSizeValue * fontSize
|
emojiSizeReal = emojiSizeValue * fontSizeMultiplier * 14
|
||||||
} else {
|
} else {
|
||||||
emojiSizeReal = emojiSizeValue
|
emojiSizeReal = emojiSizeValue
|
||||||
}
|
}
|
||||||
|
console.log(emojiSizeReal)
|
||||||
|
|
||||||
const fullEmojiSize = emojiSizeReal + (2 * 0.2 * fontSize)
|
const fullEmojiSize = emojiSizeReal + (2 * 0.2 * fontSizeMultiplier * 14)
|
||||||
this.emojiSize = fullEmojiSize
|
this.emojiSize = fullEmojiSize
|
||||||
},
|
},
|
||||||
showPicker () {
|
showPicker () {
|
||||||
|
@ -307,6 +321,7 @@ const EmojiPicker = {
|
||||||
return this.emojiSize
|
return this.emojiSize
|
||||||
},
|
},
|
||||||
itemPerRow () {
|
itemPerRow () {
|
||||||
|
console.log('CALC', this.emojiSize, this.width)
|
||||||
return this.width ? Math.floor(this.width / this.emojiSize) : 6
|
return this.width ? Math.floor(this.width / this.emojiSize) : 6
|
||||||
},
|
},
|
||||||
activeGroupView () {
|
activeGroupView () {
|
||||||
|
|
Loading…
Reference in a new issue