mirror of
https://github.com/hcengineering/platform.git
synced 2025-06-01 21:31:04 +00:00
EditBox stroke width in px (#42)
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
parent
28d65ec277
commit
ee3534a4bb
@ -52,15 +52,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
function convertRemToPx(rem: number) {
|
||||
return rem * parseFloat(getComputedStyle(document.documentElement).fontSize)
|
||||
}
|
||||
|
||||
function computeSize (t: EventTarget | null) {
|
||||
const target = t as HTMLInputElement
|
||||
const value = target.value.charCodeAt(target.value.length - 1) === 10 ? convertRemToPx(1.125) : 0
|
||||
const value = target.value.charCodeAt(target.value.length - 1) === 10 ? 1.125 : 0
|
||||
text.innerHTML = label.replaceAll(' ', ' ')
|
||||
target.style.height = text.clientHeight + value + convertRemToPx(.5) + 'px'
|
||||
target.style.height = `calc(${text.clientHeight}px + ${value + .5}rem)`
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
|
@ -32,7 +32,7 @@
|
||||
const target = t as HTMLInputElement
|
||||
const value = target.value
|
||||
text.innerHTML = (value === '' ? placeholder : value).replaceAll(' ', ' ')
|
||||
target.style.width = text.clientWidth + (parseFloat(getComputedStyle(document.documentElement).fontSize) * .5) + 'px'
|
||||
target.style.width = text.clientWidth + 8 + 'px'
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
@ -69,9 +69,9 @@
|
||||
|
||||
input {
|
||||
height: 1.25rem;
|
||||
margin: -.25rem;
|
||||
padding: .125rem;
|
||||
border: .125rem solid transparent;
|
||||
margin: -4px;
|
||||
padding: 2px;
|
||||
border: 2px solid transparent;
|
||||
border-radius: .125rem;
|
||||
|
||||
&:focus {
|
||||
|
@ -29,10 +29,6 @@
|
||||
close()
|
||||
}
|
||||
}
|
||||
|
||||
function convertRemToPx(rem: number) {
|
||||
return rem * parseFloat(getComputedStyle(document.documentElement).fontSize)
|
||||
}
|
||||
|
||||
$: {
|
||||
if (modalHTML) {
|
||||
@ -41,13 +37,13 @@
|
||||
let style: string = 'popup-'
|
||||
if (rect.top > document.body.clientHeight - rect.bottom) {
|
||||
// style += 'top-'
|
||||
modalHTML.style.bottom = document.body.clientHeight - rect.top + convertRemToPx(.75) + 'px'
|
||||
modalHTML.style.bottom = `calc(${document.body.clientHeight - rect.top}px + .75rem)`
|
||||
// arrowHTML.style.top = rect.top - convertRemToPx(.75) + 'px'
|
||||
// arrowHTML.style.left = rect.left + rect.width / 2 + 'px'
|
||||
// arrowHTML.classList.add('popup-top')
|
||||
} else {
|
||||
// style += 'bottom-'
|
||||
modalHTML.style.top = rect.bottom + convertRemToPx(.75) + 'px'
|
||||
modalHTML.style.top = `calc(${rect.bottom}px + .75rem)`
|
||||
// arrowHTML.style.top = '0px'
|
||||
}
|
||||
if (rect.left > document.body.clientWidth - rect.right) {
|
||||
|
@ -48,14 +48,14 @@
|
||||
textarea {
|
||||
width: auto;
|
||||
min-height: 4.5rem;
|
||||
margin: -.25rem;
|
||||
padding: .125rem;
|
||||
margin: -4px;
|
||||
padding: 2px;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: 150%;
|
||||
color: var(--theme-caption-color);
|
||||
background-color: transparent;
|
||||
border: .125rem solid transparent;
|
||||
border: 2px solid transparent;
|
||||
border-radius: .125rem;
|
||||
outline: none;
|
||||
overflow-y: scroll;
|
||||
|
Loading…
Reference in New Issue
Block a user