forked from
did:plc:2hcnfmbfr4ucfbjpnvjqvt3e/bbell
wip bsky client for the web & android
feat(replycomposer): springy pop in/out animation
+10
-2
+10
-2
src/components/Composer/ReplyComposer.vue
+10
-2
src/components/Composer/ReplyComposer.vue
···
129
129
</template>
130
130
131
131
<style scoped lang="scss">
132
+
@use '@/assets/variables.scss' as vars;
133
+
132
134
.reply-composer {
133
135
padding: 1rem;
134
136
border-top: 1px solid hsla(var(--surface2) / 0.5);
···
194
196
resize: none;
195
197
cursor: pointer;
196
198
font-size: 1rem;
197
-
transition: all 0.2s ease;
199
+
transition: all 0.3s vars.$ease-springier;
198
200
199
201
&::placeholder {
200
202
color: hsl(var(--subtext0));
···
263
265
}
264
266
}
265
267
268
+
.toolbar.is-expanded .toolbar,
269
+
.input-area:deep(textarea) {
270
+
transition-timing-function: vars.$ease-springier;
271
+
transition-duration: 0.4s;
272
+
}
273
+
266
274
.is-expanded {
267
275
.toolbar {
268
276
opacity: 1;
269
277
filter: blur(0);
270
278
pointer-events: auto;
271
-
margin-top: 0.5rem;
279
+
margin-top: 0.1rem;
272
280
}
273
281
}
274
282