A #contenteditable #3D text effect on @codepen https://codepen.io/thebabydino/pen/PogJybr

No text duplication, no images save for CSS gradients, no part of the effect baked into the font, no JS. It's all clever #CSS and #SVG #filter magic! 🪄✨

PS re: "trashed panda" 🦝🍾🥂🤪
https://www.bbc.com/news/articles/c5y2271q20lo

#svgFilter #cssGradient #code #coding #cssPattern #extrude #extrusion #frontend #web #dev #webDev #webDevelopment #textEffect #textEffects

Basic #CSS snippets: double border options. Multiple no extra element, no extra pseudo techniques to get a double border, depending on what you want from it.

Live on @codepen https://codepen.io/thebabydino/full/vENZRYK

Nothing but the basics.

Contenteditable code, updates visual result as you make changes. 😼

#code #coding #frontend #contenteditable #web Dev #webDev #webDevelopment

Полезные чипсы с Vue 3 Composition API: Создание адаптивного компонента с фильтрацией и множественным выбором

Современные пользовательские интерфейсы требуют высокой интерактивности и удобства взаимодействия. В этой статье поговорим о том, как реализовать мощный, адаптивный компонент мульти-выбора на основе Vue 3 Composition API. ChipsMultiSelect — это компонент, который объединяет возможности выпадающего списка, визуализации выбора в виде "чипсов" и встроенной фильтрации. Выбранные элементы отображаются в виде “чипсов”

https://habr.com/ru/articles/863210/

#contenteditable #vue3 #composition_api #javascript #css #vue_component

Как мне взбрело в голову свой Notion-like редактор написать

Мне в голову пришла идея пет-проекта, который изначально никак не был связан с текстовым редактором. Однако, в процессе работы все дошло до того, что пользователям нужно где-то набирать текст. Я люблю Notion и пишу там много и часто, поэтому решил сделать похожий (но сильно упрощенный) редактор в своём проекте. Не столько из нужды, сколько из любопытства, ведь я никогда не занимался ничем подобным и мало что знал о том, как писать текстовые редакторы. В статье хочу рассказать про атрибут contenteditable у HTML-элементов, про сопутствующие проблемы при его использовании, про кастомное форматирование и про работу с выделенными участками текста.

https://habr.com/ru/articles/815579/

#текстовые_редакторы #javascript #dom #html #frontend #вебразработа #contenteditable #работа_с_текстом #форматирование_текста #Range_API

After spending several hours trying to simplify my web editor, now I remember why I don't use #HTML #contenteditable 😑

Those br/div tag changes are annoying and probably not worth to fix.

#Development #Hacks
Fit-to-width text · A brilliant CSS-only solution for sizing text to fit the width of its parent https://ilo.im/13pfra

_____
#FitToWithText #ResponsiveDesign #WebDesign #WebDevelopment #WebDev #Frontend #CSS #ScrollDrivenAnimations #ContentEditable #Proposal