CSS-TRICKS - хороший коллективный блог с разными интересными и порой очень технически красивыми решениями на #css

Чисто CSS 😐

.col:has([row=p-1]:checked) +
...
.col:has([row=p-1]:checked) ~ .result {
  --win: 1; --winner: var(--p);
}

#css #front

CodePen (вариант 1)
CodePen (вариант 2)
CodePen (вариант 3)

.node {
animation-delay: calc(
sin((var(--index) / var(--total)) * 45deg)
* var(--speed) * -1s
);
}

#css #front

CSS Animated gradient border
Demo
Sources (github)

#css #front

The truth about CSS selector performance с графиками и вариантами улучшения селекторов. #css #front

Introduction of CSS transforms - я не знал что такое можно делать чисто на CSS :) #css

https://www.smashingmagazine.com/2023/10/animate-along-path-css - анимация по заданному пути в CSS (спиннеры, прогресс-бары, ...) #css

Визуальный генератор разметки в т.ч. для mobile/tablet/desktop контейнеров #css

Я и не знал, что современные браузеры умеют нативно разметкой рисовать формулы #css #html

В продолжение поста чудес со шрифтами - теперь оказываеца можно делать highlight текста прямо шрифтом (без всяких CSS) с помощью штуки, которая называеца COLR table в OpenType шрифтах. Да, 8 цветов максимум, но для раскраски текста этого хватает с избытком.
В статье есть ссылка на такой шрифт. #css #front

Волею судеб мне тут пришлось адаптировать один фронт на vue + sass под древнее говно типа iPhone 7...11 (ну потому что ощутимый % кастомеров такое использует - пришлось даже купить древний айфон, боже ну и гавно этот ваш iTunes под винду).

А там вобщем своеобразный Safari, который ложит хер на не знает про некоторые @media запросы в css... Поэтому нашёлся интересный сборник разных хаков, которые под разные браузеры. Вобщем в частности про Safari, если завернуть

@media not all and (min-resolution: .001dpcm) { // old safari
      font-size: 28px;
}

то можно юзать конкретно для Safari разные модификации.

И нет, нормальных полифиллов я чот не нашёл. Может быть конечно плохо искал, но с другой стороны там дичь в этом Safari вылезала всего в десятке мест, так что проще было вот как выше поправить. #css

Большая статья про генерацию favicon (в т.ч. для PWA). Несмотря на то, что статья 2021-го года - автор статьи пишет, что обновил её вот несколько дней назад. #css

Сотни разных CSS-лоадеров #css

Интересный краткий мануал по замене js animations на view transitions. #js #css

Оказывается с помощью css shape можно делать разное с элементами - в т.ч. вырезать куски из него. #css