Отсутствие класса — тоже стиль 😉

Думаю, многие сталкивались с такой проблемой, когда вам нужно прописать CSS стили именно целиковому блоку, который мы вставляем в редакторе. Да, это можно спокойно сделать, добавив этому блоку свой класс и воздействовать на этот класс из отдельного CSS-блока, который ставится вверху страницы... Слишком много действий. Отсюда вопрос:

Оно вам надо?

Есть очень крутой и органичный способ воздействия на целый родительный блок из внутренних стилей. Для этого достаточно всего лишь поставить фигурные скобки { } и написать в них ваши CSS-свойства :)
(пример на скриншоте)

#лайфхак

Друзья, коллеги, хороших вам выходных 👍🥳

Кто как отдыхает? А может, работает?

И если вы работаете, то я вас прекрасно понимаю, потому что я тоже. Хочу продолжить тему своего знакомства с вами :)

Многие наверняка работают в нескольких направлениях или на несколько проектов, и это совершенно нормальная ситуация в современном мире. Помимо того, что я куратор в Клубе Магии Геткурса, я ещё и имею причастность к игровой индустрии. Я разрабатываю игровые механики, персонажей, их характер, сценарий, сюжет, нарратив. Помимо JavaScript так же знаю Ruby on rails, и разрабатываю свою собственную игру, которая уже поучаствовала в паре игровых выставках мирового уровня :)
(спойлер: награды, конечно, было трудно завоевать, но зато я познакомился с очень интересными людьми)

Сейчас это является моим хобби, так как не приносит мне дохода, а лишь некоторые траты. Но это естественно :) На этой почве мне интересно геймифицировать процессы протекающие на Геткурсе, и я об этом глубоко задумываюсь.

Делитесь тем, как отдыхаете)

Мне очень близка и интересна идея 3D-лендингов и сайтов. Я всецело разделяю креатив от @DmitrySpace по созданию таковых.

Благодаря CSS-правилам, совместно с JS можно творить невообразимые вещи :) В данном случае мне безумно нравится, как вышел этот креативный блок с соц-сетями, который можно поставить, к примеру, внизу лендинга, и ваши соцсети уж точно не потеряются в потоке информации страницы.

К тому же вызывает большое желание кликнуть по ним 😉

#наработки

❗️ У Apple своё видение вёрстки ❗️

Адаптация страниц никогда не бывает лёгкой. И многие уже в этом убедились :) Но есть более глобальная проблема адаптации — это устройства Apple, которые зачастую кривят своим видом страницы на горизонтальных и вертикальных видах. Появляются какие-то полосы между блоками, а адаптированный блок, который нормально смотрится на остальных устройствах и при сжатии браузера, вдруг начинает странно себя вести на iPad...

Как это исправить так, чтобы ваша драгоценная адаптация не слетела на остальных клиентах?
Ответ: прописать стили только для устройств Apple!

И такое возможно благодаря некоторым директивам в @media правилах. Если мы пропишем @media only screen and (max-device-width: 1024px), то такое правило будет означать, что оно применимо "только к устройствам Apple" на разрешении устройства ниже 1024 пикселя. С помощью такой фишки можно не бояться за адаптацию на всех остальных устройствах.

Таким образом, можно локализовать проблему в стилях на определенных разрешениях. Представим, что наша проблема со стилями наблюдается только на iPad'ах в горизонтальном и вертикальном виде. Можно локализовать обращение таким образом:

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
класс {
ваши стили...
}
}

Если не поставить директиву only перед screen, то все стили, которые вы примените внутри этого медиаправила, будут распространяться на все устройства и браузеры, включая Apple. В свою очередь, сама директива screen как раз означает, что эти правила будут действовать для устройств Apple.

#полезная_фишка

Друзья, коллеги, всем хороших выходных! 😉

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

Как я уже говорил в первых постах, я готовлю один интересный обучающий проект. Не простое банальное пересказывание материала, а именно по моей собственной методике и разработанной концепции ;)

Сейчас я доделываю основные моменты в своём проекте и в ближайшее время вы узнаете о том, что я готовил для вас всё это время 😊

День начинается с опросов 😉

Друзья, ни для кого не секрет, что многие заказчики совмещают Тильду с Геткурсом. Тильда имеет множество уже задизайненых блоков и настроенных под нужды современных лендингов, поэтому заказчики зачастую отдают своё предпочтение красивому дизайну на Тильде, не зная, что уже довольно многие умеют делать ровно то же самое на Геткурсе, и не распыляться на два сервиса.

❓Я бы хотел узнать, есть ли среди подписчиков моего канала такие люди, которые работают и с Геткурсом и с Тильдой.

(опрос создам ниже поста)

Да, это Геткурс 😳😱

Заранее отвечаю на зреющий у вас вопрос 😁
И нет, это не простая модификация левой панели, а полностью разработанная с нуля для своего собственного проекта :)

Хотел, чтобы вы оценили масштаб разработки, а главное понимали, что на Геткурсе возможно всё!

В данный момент всё ещё работаю над конечной версией такой панели ;)

#наработки

Свои страницы на Геткурсе вместо системных 🧐

Не секрет, что на Геткурсе можно кастомизировать если не абсолютно, то почти всё. И системные страницы не являются исключением.

Вы можете сильно преобразить исходную страницу, а можете поступить более хитрым способом: создать свою собственную.

Например, свою собственную страницу "Спасибо" после успешной оплаты заказа, отказавшись от старой. Для этого достаточно поставить блок с редиректом, где будет указан адрес вашей новой страницы.

И таким образом можно заменить хоть все системные страницы на свои. Для некоторых, правда, понадобятся знания работы с объектами данных, выводимыми Геткурсом на каждую страницу проекта :)

Кто-то подчеркнет из этого поста полезный лайфхак в виде редиректов и собственных решений по страницам, а кого-то натолкнёт на размышления о чём-то более глобальном 😉

#лайфхак

Бросайте якорь! 😳

Практически все лендинги или страницы, как таковые, имеют якоря для удобной навигации по ним. И чаще всего, если блоки имеют бекграунд, появляется такая проблема с пустым местом (смотрите скриншот).

Встаёт вопрос, что делать в таком случае?

Есть пара вариантов решения. Но для начала хочу поделиться с вами классом якоря. Он имеет класс lt-anchor. Первый вариант - мы можем уменьшить его высоту до 0px, ведь по умолчанию он имеет высоту в 1px. Второй вариант заключается в том, чтобы покрасить наш якорь в цвет блоков :) Для этого просто примените свойство background нужного цвета.

#лайфхак