muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 11:06:40 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

stickers: text editing

Browse source
This commit is contained in:
muerwre 2018-12-05 16:00:37 +07:00
parent fa9bff5756
commit f183c8593d
6 changed files with 130 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

61
src/styles/stickers.less
View file

@ -19,7 +19,7 @@
position: absolute;
border-radius: 40px;
opacity: 0.25;
transform: scale(0.6);
transform: scale(0.5);
transition: opacity 250ms, transform 500ms;
}
@ -69,8 +69,8 @@
//}
svg {
left: -12px;
top: -12px;
left: -8px;
top: -8px;
position: relative;
z-index: 0;
}
@ -78,12 +78,20 @@
.sticker-image {
width: 72px;
height: 72px;
left: -8px;
top: -8px;
left: -12px;
top: -12px;
position: relative;
z-index: 0;
background-size: cover;
}
&.left {
.sticker-desc {
padding: 10px 36px 10px 10px;
left: auto;
right: 24px;
}
}
}
.sticker-arrow {
@ -116,8 +124,8 @@
transform: scale(1);
opacity: 1;
pointer-events: all;
left: 42px;
top: 0;
left: 28px;
top: -16px;
z-index: 20;
&:hover {
@ -151,3 +159,42 @@
z-index: 2;
}
}
.sticker-desc {
min-width: 60px;
height: auto;
background: #222222;
position: absolute;
top: 50%;
left: 24px;
transform: translate3d(0, -50%, 0);
color: white;
box-sizing: border-box;
padding: 10px 10px 10px 36px;
}
.sticker-desc-sizer {
position: relative;
width: 100%;
height: 100%;
color: rgba(0,0,0,0);
white-space: nowrap;
padding: 1px;
textarea {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
font: inherit;
padding: 0;
border: none;
background: none;
color: white;
resize: none;
outline: none;
overflow: hidden;
}
}