❤️‍🔥"Это разъ*бный сетап, бро!" 😤

Так сказал мой друг из Африки, когда увидел этот стол)
Не знаю уж че за сетап, меня зовут Саша и качественную необычную мебель из натурального дерева я делаю уже больше 12-ти лет, столько же занимаюсь и темой здоровья.

Когда я услышал, что до 10% смертности связано с сидячим образом жизни, меня это поразило и я задался целью делать максимально функциональные и полезные рабочие пространства, ибо геморрой в 30 это конечно довольно нишево, но все же сомнительно 😂

Ну а собрать такой комплект под свои задачи и при этом сразу прикинуть цены вы можете в удобном Mini App конструкторе ➕

💾 3D Preloader – необычный 3D-лоадер с элементами в виде подвижных столбиков. Чем выше столбик, тем ярче он окрашивается в синий цвет.

Сайтодел | #сниппет #css

Как убрать лишние классы для пустых блоков?

Часто в компонентах есть контейнеры для описания, ошибки, подсказки или дополнительного контента.

Если данных нет — элемент остаётся пустым, но продолжает занимать место.

Обычно это решают через JS или условный рендеринг.
.error {
display: none;
}

А потом отдельно добавляют класс при появлении контента.

Но CSS умеет определять пустые элементы самостоятельно.
.error:empty {
display: none;
}

Теперь блок автоматически скрывается, если внутри ничего нет.

Можно делать и обратную логику.
.card:not(:empty) {
padding: 16px;
}

Отступы появятся только тогда, когда внутри действительно есть контент.

Особенно удобно для:
error,
hint,
description,
badge

Где содержимое может появляться динамически.

🔥 :empty позволяет убрать лишние классы и часть условной логики прямо средствами CSS.

📣 Code Ready | #совет

❤️‍🔥"Это разъ*бный сетап, бро!" 😤

Так сказал мой друг из Африки, когда увидел этот стол)
Не знаю уж че за сетап, меня зовут Саша и качественную необычную мебель из натурального дерева я делаю уже больше 12-ти лет, столько же занимаюсь и темой здоровья.

Когда я услышал, что до 10% смертности связано с сидячим образом жизни, меня это поразило и я задался целью делать максимально функциональные и полезные рабочие пространства, ибо геморрой в 30 это конечно довольно нишево, но все же сомнительно 😂

Ну а собрать такой комплект под свои задачи и при этом сразу прикинуть цены вы можете в удобном Mini App конструкторе ➕

Как убрать лишние классы для пустых блоков?

Часто в компонентах есть контейнеры для описания, ошибки, подсказки или дополнительного контента.

Если данных нет — элемент остаётся пустым, но продолжает занимать место.

Обычно это решают через JS или условный рендеринг.
.error {
display: none;
}

А потом отдельно добавляют класс при появлении контента.

Но CSS умеет определять пустые элементы самостоятельно.
.error:empty {
display: none;
}

Теперь блок автоматически скрывается, если внутри ничего нет.

Можно делать и обратную логику.
.card:not(:empty) {
padding: 16px;
}

Отступы появятся только тогда, когда внутри действительно есть контент.

Особенно удобно для:
error,
hint,
description,
badge

Где содержимое может появляться динамически.

🔥 :empty позволяет убрать лишние классы и часть условной логики прямо средствами CSS.

📣 Code Ready | #совет

📂 Напоминалка для работы с Query Parameters!

Например, get() позволяет получить значение параметра, set() обновить существующий параметр, append() добавить новый, а delete() удалить ключ вместе со всеми значениями.

На картинке — основные методы URLSearchParams, примеры работы с параметрами запроса и базовые сценарии использования в современной web-разработке.

Сохрани, чтобы не потерять!

📣 Code Ready | #ресурс

16 июля встречаемся с JS‑сообществом SberProfi в Сбер.Среде.

AI уже меняет JavaScript‑разработку. Вопрос не в том, заменит ли он инженеров, а в том, кто освоит его быстрее и качественнее.

🔥 Обсудим изменения на реальных кейсах от Сбера, Cloud․ru и Mish. Очные участники увидят спецформат от блогеров и пообщаются с экспертами GigaCode и GitVerse.

⏳ Начало в 17:00, встреча очных гостей - в 16:00.
Количество очных мест ограничено – успейте зарегистрироваться!

👩‍💻 Добавляем подсказки в поля формы с помощью атрибута placeholder!

Атрибут, который подсказывает пользователю, что именно нужно ввести в поле ввода (обычно это пример слова или фразы). А ещё значение атрибута исчезает, как только пользователь начинает вводить текст.

Чаще всего используется с:

• — для текстовых полей, поиска, email, телефона и других типов ввода;
• — для подсказок в многострочных полях.

Часто из-за дизайнерских решений placeholder используется для замены более семантического элемента метки. Однако это не означает, что текст-заполнитель может заменить , поскольку это создаёт неудобства для пользователей с особыми потребностями.

📣 Code Ready | #атрибут

💾 3D Preloader – необычный 3D-лоадер с элементами в виде подвижных столбиков. Чем выше столбик, тем ярче он окрашивается в синий цвет.

Сайтодел | #сниппет #css

💾 CSS Only 3D Image Carousel – объемная галерея для фотографий в виде кольца из карточек. При наведении курсора фото становится цветным, а движение останавливается.

Сайтодел | #сниппет #css

🌟 Всратый киберпанк... Новая фобия

Москвичка по нужде воспользовалась платным уличным туалетом, но... свобода оказалась премиум-функцией.

💀 После оплаты дверь благополучно закрылась, замок перестал открываться, а свет и вентиляция отключились.

В маленькой кабинке быстро закончился воздух и девушке стало трудно дышать. Запаниковав она начала кричать и стучать в дверь 😱

К счастью, рядом оказалась подруга, которая заново оплатила вход, и только после этого дверь открылась.

Wake up, самурай... у тебя недостаточно средств, чтобы покинуть кабинку.

С добрым утром!😎

💾 Custom Rhombus Shape – шаблон в виде ромбов для изображений или карточек с текстом. Каждый ромб меняет цвет и анимируется при наведении курсора либо по нажатию.

Сайтодел | #сниппет #css

💀 Шпаргалка начинающего тестировщика на русском в PDF

Системно, последовательно и очень красиво изложены основы теории тестирования.

🔣Что такое тестирование.
🔣Виды тестирования.
🔣Классификация.
🔣Тестовая документация, её виды, чек-лист.
🔣Тест-кейс и тест-план.
🔣Техника тестирования.
🔣Основы баз данных. SQL запросы.
🔣Тестирование API и д.р полезные вещи.

Сохраняем 👍

😳 Лайф | 📲 Зеркало Max

#doc #cheatsheet

‌AvitoTech устраивает онлайн CTF с призами до 300 000 рублей команду 📍

Что внутри турнира: таски на веб-уязвимости, инфраструктурные мисконфиги, анализ скомпилированного кода, расследование инцидентов, слабости шифров и всё, что требует хакерской смекалки. Если это ваш первый опыт, вписывайтесь в Honey-лигу — туда опытных игроков не пускают.

❗️Регистрация, кстати, уже открыта❗️

Кажется, это знак собрать свою команду и попробовать себя в роли того самого медоеда! Проверьте защиту пчелиного улья и помогите найти все скрытые уязвимости в сотах 🐝

💾 Hexagon Grid Ripple Effect – контейнер с шестиугольными карточками для иконок. При нажатии создается эффект волны.

Сайтодел | #сниппет #css

⚡️ CyberScraper 2077 — веб-скрапер, который словно веб-разведчик на стероидах, агрегирующий в себе последние достижения ИИ от таких гигантов, как OpenAI, Gemini и Ollama.

Зачем оно вам? — чтобы ловко обходить капчи, защиту и глубже понимать контент, который вы собираетесь парсить.

Среди приятных особенностей:

💬 Кроссплатформенный, работает под Windows/Linux, можно запустить через Docker(инструкции по запуску на GitHub);
💬 Интуитивно понятный интерфейс;
💬 Возможность экспорта данных в форматах JSON, CSV, HTML, SQL или Excel;
💬 Точное структурирование извлеченной информации, где ИИ проявляет себя на все сто;
💬 Режим скрытности, чтобы оставаться незамеченным.

И это далеко не все мелочи, которыми может похвастаться этот продвинутый инструмент.

⚙️ GitHub/Инструкция

#python #github #soft

✍️ Source Code Pro – моноширный шрифт с закругленными буквами, который был разработан как дополнительный к шрифту Source Sans. Пример есть в сниппете Futuristic Card Effect

Сайтодел | #шрифт

⚡️ CyberScraper 2077 — веб-скрапер, который словно веб-разведчик на стероидах, агрегирующий в себе последние достижения ИИ от таких гигантов, как OpenAI, Gemini и Ollama.

Зачем оно вам? — чтобы ловко обходить капчи, защиту и глубже понимать контент, который вы собираетесь парсить.

Среди приятных особенностей:

💬 Кроссплатформенный, работает под Windows/Linux, можно запустить через Docker(инструкции по запуску на GitHub);
💬 Интуитивно понятный интерфейс;
💬 Возможность экспорта данных в форматах JSON, CSV, HTML, SQL или Excel;
💬 Точное структурирование извлеченной информации, где ИИ проявляет себя на все сто;
💬 Режим скрытности, чтобы оставаться незамеченным.

И это далеко не все мелочи, которыми может похвастаться этот продвинутый инструмент.

⚙️ GitHub/Инструкция

#python #github #soft

💾 CSS Only 3D Image Carousel – объемная галерея для фотографий в виде кольца из карточек. При наведении курсора фото становится цветным, а движение останавливается.

Сайтодел | #сниппет #css

💾 Custom Rhombus Shape – шаблон в виде ромбов для изображений или карточек с текстом. Каждый ромб меняет цвет и анимируется при наведении курсора либо по нажатию.

Сайтодел | #сниппет #css

💾 Hexagon Grid Ripple Effect – контейнер с шестиугольными карточками для иконок. При нажатии создается эффект волны.

Сайтодел | #сниппет #css