Здесь делается вжух 🪄

Включите JavaScript в браузере, чтобы просматривать форум

Маяк

Объявление

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.

Вы здесь » Маяк » Mayak Design Awards » Кодомарафон

Кодомарафон

Страница:   1 2 3  

Сообщений 31 страница 60 из 61

1

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

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

Ивент запущен в тестовом режиме, со временем правила могут поменяться https://i.imgur.com/K2pBGf6.png

Про задания

  • Каждую неделю открываем новое задание, всего — четыре

  • За выполнение четырёх основных заданий можно удвоить награду за любое из них

  • Одновременно с четвёртым заданием открывается пятое, бонусное

  • Бонус за пятое задание можно забрать, только выполнив все пять заданий

  • Начать выполнение заданий можно в любой момент в течение марафона

  • Задания можно выполнять в любом порядке

Как получить награду

  • В конце марафона опубликуем пост с подсчётом итогов, тогда можно получить призы

  • Вот как их забирать:

    • люмены и ачивки начислим вам сами

    • купоны, иконки, плашки и фоны забираете самостоятельно (их удобно хранить на карточке)

    • для перевода кредитов попросим выигравших написать нам в личку

  • Если выполнили все четыре основных задания, до подведения итогов напишите в посте с последним заданием, какую награду удваиваете

  • За публикацию результатов вашей работы в каталоге также можно получить люмены в банке

Как опубликовать результат

Чтобы засчитать задание, нам нужно его «пощупать». Форумный HTML в постах для этой задачи не подходит (большой риск пересечения классов), но есть удобная альтернатива, которая, к тому же, может стать вашим будущим портфолио.

  • Зарегистрируйтесь на codepen.io

  • Нажмите в левой верхней части интерфейса "Pen"

  • Напишите ваш код

  • Нажмите в правой нижней части интерфейса кнопку "Embed"

  • Скопируйте HTML-код и вставьте его в пост с помощью тегов [html]

  • Добавьте к посту заголовок с названием задания

Задания в этом месяце

Инвентарь персонажа
HTML-шаблон с набором предметов в инвентаре персонажа (например: нож, фонарь, две батарейки, аптечка)

https://forumstatic.ru/files/001b/ff/2a/27948.png

 


Для амс

[hideprofile]

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+17

31

  • Последний визит:
    Сегодня 00:42:44
  • Автор: Angst
  • твой рот не для того, чтобы говорить
  • Angst
  • Сообщений: 2275
  • Уважение: +3940
  • Люмены: 55783

Задание №3
аватарки активистов

[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="XJWQdNo" data-pen-title="Кодомарафон на Маяке: Активисты" data-user="pk-the-selector" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/pk-the-selector/pen/XJWQdNo">
  Кодомарафон на Маяке: Активисты</a> by Angst (<a href="https://codepen.io/pk-the-selector">@pk-the-selector</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

Ты был не лучше и не хуже, все стоят в одном строю,
И ветер времени стирает выраженья с наших лиц.
И если мы глядим оттуда, нас уже не узнают,
А наше дело сохраняется в скрещениях страниц. ©

+10

32

  • Последний визит:
    Сегодня 00:42:44
  • Автор: Angst
  • твой рот не для того, чтобы говорить
  • Angst
  • Сообщений: 2275
  • Уважение: +3940
  • Люмены: 55783

Задание №4
кнопка

[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="ZYEZWjw" data-pen-title="Кодомарафон на Маяке: Кнопка" data-user="pk-the-selector" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/pk-the-selector/pen/ZYEZWjw">
  Кодомарафон на Маяке: Кнопка</a> by Angst (<a href="https://codepen.io/pk-the-selector">@pk-the-selector</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

Ты был не лучше и не хуже, все стоят в одном строю,
И ветер времени стирает выраженья с наших лиц.
И если мы глядим оттуда, нас уже не узнают,
А наше дело сохраняется в скрещениях страниц. ©

+9

33

  • Последний визит:
    2025-05-12 11:10:32
  • Автор: Coffee table knight
  • 🛸
  • Coffee table knight
  • Сообщений: 1343
  • Уважение: +1940
  • Люмены: 150

Да, я использовал нейросетку. Да, мы смеялись как два безумца.
Осторожно: может увести вас туда, где мышь ещё не ступала. 🌀
[html]<p class="codepen" data-height="500" data-default-tab="result" data-slug-hash="pvoVjLo" data-pen-title="Smiley Spree" data-user="Coffeetableknight" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Coffeetableknight/pen/pvoVjLo">
  Smiley Spree</a> by Coffee Table Knight (<a href="https://codepen.io/Coffeetableknight">@Coffeetableknight</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Coffee table knight (2025-04-06 18:42:36)

Подпись автора

пст...https://forumupload.ru/uploads/001b/ff/2a/46/248573.gif

+12

34

  • Последний визит:
    Сегодня 03:07:41
  • Автор: Lefferoi
  • ха-ха, окно такое смешное, я выпал
  • Lefferoi
  • Сообщений: 932
  • Уважение: +2285
  • Люмены: 1550

Задание №4
Кнопка

[html]<p class="codepen" data-height="300" data-theme-id="dark" data-default-tab="result" data-slug-hash="KwKYzQB" data-pen-title="Кодомарафон на Маяке: Кнопка" data-user="Holger-Brandt" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Holger-Brandt/pen/KwKYzQB">
  Кодомарафон на Маяке: Кнопка</a> by Lefferoi (<a href="https://codepen.io/Holger-Brandt">@Holger-Brandt</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

дрейфуем по волнам в дневнике

+9

35

  • Последний визит:
    2025-05-12 11:10:32
  • Автор: Coffee table knight
  • 🛸
  • Coffee table knight
  • Сообщений: 1343
  • Уважение: +1940
  • Люмены: 150

Кнопка для самых любопытных
[html]<p class="codepen" data-height="300" data-default-tab="result" data-slug-hash="mydgrmY" data-pen-title="Votetopovorot" data-user="Coffeetableknight" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Coffeetableknight/pen/mydgrmY">
Votetopovorot</a> by Coffee Table Knight (<a href="https://codepen.io/Coffeetableknight">@Coffeetableknight</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Coffee table knight (2025-04-06 18:41:34)

Подпись автора

пст...https://forumupload.ru/uploads/001b/ff/2a/46/248573.gif

+9

36

  • Последний визит:
    Вчера 23:05:18
  • Автор: шакал
  • по жизни
  • шакал
  • Сообщений: 635
  • Уважение: +1020
  • Люмены: 2000

Задание 4
Кнопка

[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="XJWQpGp" data-pen-title="Кодомарафон на Маяке: Кнопка" data-user="crtznxnm-the-solid" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/crtznxnm-the-solid/pen/XJWQpGp">
  Кодомарафон на Маяке: Кнопка</a> by Peter Urban (<a href="https://codepen.io/crtznxnm-the-solid">@crtznxnm-the-solid</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

ищу:
авторшу бестселлера | монашку

https://forumupload.ru/uploads/001c/6a/ec/5/154854.png

гп, 2030
cтена между мирами разрушена

+6

37

  • Последний визит:
    Сегодня 00:42:44
  • Автор: Angst
  • твой рот не для того, чтобы говорить
  • Angst
  • Сообщений: 2275
  • Уважение: +3940
  • Люмены: 55783

Задание №5
Шаблон шапки темы

[html]<p class="codepen" data-height="600" data-default-tab="result" data-slug-hash="JojqpmQ" data-pen-title="Кодомарафон на Маяке: HTML-шаблон шапки темы" data-user="pk-the-selector" style="height: 800px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/pk-the-selector/pen/JojqpmQ">
  Кодомарафон на Маяке: HTML-шаблон шапки темы</a> by Angst (<a href="https://codepen.io/pk-the-selector">@pk-the-selector</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Если выполнили все четыре основных задания, до подведения итогов напишите в посте с последним заданием, какую награду удваиваете

Удваиваю купон-кэшбек)

Отредактировано Angst (2025-04-09 01:56:26)

Подпись автора

Ты был не лучше и не хуже, все стоят в одном строю,
И ветер времени стирает выраженья с наших лиц.
И если мы глядим оттуда, нас уже не узнают,
А наше дело сохраняется в скрещениях страниц. ©

+4

38

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]Первый кодомарафон окончен!
Всем спасибо за участие, все молодцы https://forumupload.ru/uploads/001b/ff/2a/3/253186.png

Вот такие были призы

200 люменов

https://forumstatic.ru/files/001b/ff/2a/39263.png

50 кредитов на форум

max, the murderer!, выполнены задания: 1, 2
Награды: 200 люменов, фон профиля

hagen, выполнены задания: 1, 2
Награды: 200 люменов, фон профиля
Важно: второе задание засчитано, потому что это прецедент. В дальнейшем такие задания засчитывать не будем. Подробнее об этом тут

Канарейка, выполнены задания: 1, 2, 3, 4, 5
Награды: 200 люменов х2, фон профиля, купон, иконка, кредиты

Lefferoi, выполнены задания: 1, 2, 3, 4
Награды: 200 люменов х2, фон профиля, купон, иконка

хани, выполнены задания: 1
Награды: 200 люменов

alhenas, выполнены задания: 1
Награды: 200 люменов

Angst, выполнены задания: 1, 2, 3, 4, 5
Награды: 200 люменов, фон профиля, купон х2, иконка, кредиты

океан, выполнены задания: 1
Награды: 200 люменов

Химера, выполнены задания: 1
Награды: 200 люменов

шакал, выполнены задания: 1, 2, 3, 4
Награды: 200 люменов х2, фон профиля, купон, иконка

Naya, выполнены задания: 1
Награды: 200 люменов

Консерва, выполнены задания: 2, 3, 4
Награды: фон профиля, купон, иконка

Coffee table knight, выполнены задания: 2, 4
Награды: фон профиля, иконка

Люмены уже начислены. Иконку, фон и купон забираете самостоятельно. Чтобы получить кредиты, пришлите в личку @max, the murderer! ссылку на форум, куда мы переведём приз https://forumupload.ru/uploads/001b/ff/2a/3/582788.png

Важно: при выполнении четырёх основных заданий, пожалуйста, указывайте сразу, какой приз хотите удвоить — это сэкономит время и нам, и вам https://forumupload.ru/uploads/001b/ff/2a/3/115609.png

https://forumupload.ru/uploads/001b/ff/2a/3/161012.png Новые задания уже в шапке темы https://forumupload.ru/uploads/001b/ff/2a/3/161012.png
Я не удержался, поэтому тема месяца — легущьки https://forumupload.ru/uploads/001b/ff/2a/3/473701.png (это относится только к призам, они будут зелёно-лягушачьи)

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+6

39

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]

Задание 1
Кнопка повышения репутации
Стилизуйте кнопку повышения репутации под постом. Без дополнительных стилей и скриптов кнопка с плюсиком появляется при нажатии на цифру (текущая сумма плюсов поста), нажатие же на плюсик повышает рейтинг поста на 1 (ставит плюс от имени пользователя). В шаблоне ниже плюсик уже по умолчанию отображён

ПЕРЕЙТИ К ШАБЛОНУ

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+3

40

  • Последний визит:
    Вчера 23:30:04
  • Автор: FeatherTail
  • на кончике пера
  • FeatherTail
  • Сообщений: 499
  • Уважение: +850
  • Люмены: 400

Удалить (невнимательно прочитал задание)

Отредактировано FeatherTail (2025-04-09 13:39:24)

Подпись автора

"То, что писатель хочет сказать, он должен не говорить, а писать."

+1

41

  • Последний визит:
    Вчера 23:41:23
  • Автор: Erhart
  • creativity is not a competition
  • Erhart
  • <div style="border-radius:5px!important; line-height:110%; height:30px; min-height:30px; margin:-4px -7px; padding-top:6px; background:url('https://forumupload.ru/uploads/001b/ff/2a/482/690248.png') top center no-repeat !important;"> <p style="filter: brightness(0) saturate(100%) invert(5%) sepia(93%) saturate(5135%) hue-rotate(358deg) brightness(95%) contrast(114%);"> <a href="https://mayak.f-rpg.me/viewtopic.php?id=641#p36725"><img src="https://forumupload.ru/uploads/001b/ff/2a/482/881899.png"></a> <a href="https://mayak.f-rpg.me/viewtopic.php?id=743#p51925"><img src="https://forumupload.ru/uploads/001b/ff/2a/482/490784.png"></a> <br> <a href="https://mayak.f-rpg.me/viewtopic.php?id=1613#p132581"><img src="https://forumupload.ru/uploads/001b/ff/2a/482/218281.png"></a> <a href="https://mayak.f-rpg.me/viewtopic.php?id=1117#p96552"><img src="https://forumupload.ru/uploads/001b/ff/2a/482/23511.png"></a></p></div>
  • Сообщений: 525
  • Уважение: +1029
  • Люмены: 5375

Задание 1
Кнопка повышения репутации

[html]<p class="codepen" data-height="300" data-theme-id="dark" data-default-tab="css,result" data-slug-hash="QwWXboO" data-pen-title="Untitled" data-user="Erhart-the-looper" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Erhart-the-looper/pen/QwWXboO">
  Untitled</a> by Erhart (<a href="https://codepen.io/Erhart-the-looper">@Erhart-the-looper</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://forumstatic.ru/files/001b/ec/ce/14383.png https://forumupload.ru/uploads/001b/6b/7e/2/155644.png
Ищу Беллару 𖹭 для Рука-кунари

+5

42

  • Последний визит:
    2025-05-12 11:10:32
  • Автор: Coffee table knight
  • 🛸
  • Coffee table knight
  • Сообщений: 1343
  • Уважение: +1940
  • Люмены: 150

Задание 1

[html]<p class="codepen" data-height="300" data-default-tab="result" data-slug-hash="MYWMKQy" data-pen-title="1 Like = 1 Fly" data-user="Coffeetableknight" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Coffeetableknight/pen/MYWMKQy">
  1 Like = 1 Fly</a> by Coffee Table Knight (<a href="https://codepen.io/Coffeetableknight">@Coffeetableknight</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

пст...https://forumupload.ru/uploads/001b/ff/2a/46/248573.gif

+6

43

  • Последний визит:
    Сегодня 00:58:42
  • Автор: Канарейка
  • ролевое чмо
  • Канарейка
  • Сообщений: 452
  • Уважение: +992
  • Люмены: 7389

Задание 1
Кнопка повышения репутации

[html]<p class="codepen" data-height="300" data-theme-id="dark" data-default-tab="css,result" data-slug-hash="XJJrOYg" data-pen-title="Кодомарафон на Маяке: Кнопка повышения репутации под постом" data-user="Blahaand-Kiri-KiriWind" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Blahaand-Kiri-KiriWind/pen/XJJrOYg">
  Кодомарафон на Маяке: Кнопка повышения репутации под постом</a> by Blaha& Kiri (KiriWind) (<a href="https://codepen.io/Blahaand-Kiri-KiriWind">@Blahaand-Kiri-KiriWind</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Канарейка (2025-04-15 23:41:07)

Подпись автора

https://images2.imgbox.com/e9/c2/656eOmY7_o.gif

+6

44

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]

Задание 2
Ссылка при наведении
Придумать эффект для текстовой ссылки при наведении

ПЕРЕЙТИ К ШАБЛОНУ

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+1

45

  • Последний визит:
    Сегодня 00:58:42
  • Автор: Канарейка
  • ролевое чмо
  • Канарейка
  • Сообщений: 452
  • Уважение: +992
  • Люмены: 7389

Задание 2
Ссылка при наведении

[html]<p class="codepen" data-height="300" data-theme-id="dark" data-default-tab="html,result" data-slug-hash="yyyLXLg" data-pen-title="Кодомарафон на Маяке: Ссылка при наведении" data-user="Blahaand-Kiri-KiriWind" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Blahaand-Kiri-KiriWind/pen/yyyLXLg">
  Кодомарафон на Маяке: Ссылка при наведении</a> by Blaha& Kiri (KiriWind) (<a href="https://codepen.io/Blahaand-Kiri-KiriWind">@Blahaand-Kiri-KiriWind</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

да, у меня новый гиперфикс...

Отредактировано Канарейка (2025-04-16 17:20:56)

Подпись автора

https://images2.imgbox.com/e9/c2/656eOmY7_o.gif

+6

46

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

Задание 1
Кнопка повышения репутации

[html]<p class="codepen" data-height="300" data-default-tab="result" data-slug-hash="VYYwMWQ" data-pen-title="Кодомарафон на Маяке: Кнопка повышения репутации под постом" data-editable="true" data-user="pivozavr" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/pivozavr/pen/VYYwMWQ">
  Кодомарафон на Маяке: Кнопка повышения репутации под постом</a> by pivozavr (<a href="https://codepen.io/pivozavr">@pivozavr</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+2

47

  • Последний визит:
    Вчера 23:56:22
  • Автор: SomeOwl
  • упал в посты - подняли
  • SomeOwl
  • Сообщений: 49
  • Уважение: +87
  • Люмены: 0

Задание 1
Кнопка повышения репутации

и я тут притулюсь со своим всратеньким

[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="emmYJrq" data-pen-title="mayak1" data-user="-no-the-sans" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/-no-the-sans/pen/emmYJrq">
  mayak1</a> by Анна no (<a href="https://codepen.io/-no-the-sans">@-no-the-sans</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано SomeOwl (2025-04-16 19:48:05)

Подпись автора

https://forumstatic.ru/files/001c/76/cd/52012.png
[html]<div style="text-align:right;opacity:0;pointer-events:none;">
https://dragcave.net/image/QQEjq.gif https://dragcave.net/image/7gNYh.gif https://dragcave.net/image/Vy7nB.gif https://dragcave.net/image/45uHt.gif https://dragcave.net/image/3qM98.gif https://dragcave.net/image/87dhG.gif
https://dragcave.net/image/AMDCv.gif https://dragcave.net/image/BYeKx.gif https://dragcave.net/image/UTKqf.gif https://dragcave.net/image/5Yxzj.gif https://dragcave.net/image/37J4k.gif https://dragcave.net/image/JyHri.gif</div>
[/html]

+5

48

  • Последний визит:
    Вчера 23:56:22
  • Автор: SomeOwl
  • упал в посты - подняли
  • SomeOwl
  • Сообщений: 49
  • Уважение: +87
  • Люмены: 0

Задание 2
Ссылка при наведении

Еще одна иттерация всратых эскпериментов
[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="Eaaxwzb" data-pen-title="mayak2" data-user="-no-the-sans" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/-no-the-sans/pen/Eaaxwzb">
  mayak2</a> by Анна no (<a href="https://codepen.io/-no-the-sans">@-no-the-sans</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://forumstatic.ru/files/001c/76/cd/52012.png
[html]<div style="text-align:right;opacity:0;pointer-events:none;">
https://dragcave.net/image/QQEjq.gif https://dragcave.net/image/7gNYh.gif https://dragcave.net/image/Vy7nB.gif https://dragcave.net/image/45uHt.gif https://dragcave.net/image/3qM98.gif https://dragcave.net/image/87dhG.gif
https://dragcave.net/image/AMDCv.gif https://dragcave.net/image/BYeKx.gif https://dragcave.net/image/UTKqf.gif https://dragcave.net/image/5Yxzj.gif https://dragcave.net/image/37J4k.gif https://dragcave.net/image/JyHri.gif</div>
[/html]

+7

49

  • Последний визит:
    2025-05-12 11:10:32
  • Автор: Coffee table knight
  • 🛸
  • Coffee table knight
  • Сообщений: 1343
  • Уважение: +1940
  • Люмены: 150

Задание 2
Ссылка при наведении
[html]<p class="codepen" data-height="300" data-default-tab="result" data-slug-hash="VYYwQQX" data-pen-title="Untitled" data-user="Coffeetableknight" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Coffeetableknight/pen/VYYwQQX">
  Untitled</a> by Coffee Table Knight (<a href="https://codepen.io/Coffeetableknight">@Coffeetableknight</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

пст...https://forumupload.ru/uploads/001b/ff/2a/46/248573.gif

+9

50

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]

Задание 3
Поле для ввода
Стилизовать поле для ввода текста

ПЕРЕЙТИ К ШАБЛОНУ

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

0

51

  • Последний визит:
    Вчера 23:56:22
  • Автор: SomeOwl
  • упал в посты - подняли
  • SomeOwl
  • Сообщений: 49
  • Уважение: +87
  • Люмены: 0

Задание 3
Поле для ввода

Секция Кринж продолжается, не забудьте погладить ЛягуЩку
[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="zxxKObJ" data-pen-title="Mayak3" data-user="-no-the-sans" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/-no-the-sans/pen/zxxKObJ">
  Mayak3</a> by Анна no (<a href="https://codepen.io/-no-the-sans">@-no-the-sans</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://forumstatic.ru/files/001c/76/cd/52012.png
[html]<div style="text-align:right;opacity:0;pointer-events:none;">
https://dragcave.net/image/QQEjq.gif https://dragcave.net/image/7gNYh.gif https://dragcave.net/image/Vy7nB.gif https://dragcave.net/image/45uHt.gif https://dragcave.net/image/3qM98.gif https://dragcave.net/image/87dhG.gif
https://dragcave.net/image/AMDCv.gif https://dragcave.net/image/BYeKx.gif https://dragcave.net/image/UTKqf.gif https://dragcave.net/image/5Yxzj.gif https://dragcave.net/image/37J4k.gif https://dragcave.net/image/JyHri.gif</div>
[/html]

+4

52

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]

Задание 4
Пост недели
Стилизовать блок с постом недели для шапки форума

ИСПОЛЬЗОВАТЬ ШАБЛОН


https://forumupload.ru/uploads/001b/ff/2a/3/818980.png
Открыто бонусное задание
 

Задание 5
Анкета персонажа
Придумать и стилизовать простой шаблон анкеты персонажа

БЕЗ ШАБЛОНА

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+1

53

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

Задание 3
Поле для ввода

[html]<p class="codepen" data-height="300" data-default-tab="result" data-slug-hash="pvvWmmK" data-pen-title="Моё поле для ввода" data-editable="true" data-user="pivozavr" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/pivozavr/pen/pvvWmmK">
  Моё поле для ввода</a> by pivozavr (<a href="https://codepen.io/pivozavr">@pivozavr</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+1

54

  • Последний визит:
    Сегодня 00:58:42
  • Автор: Канарейка
  • ролевое чмо
  • Канарейка
  • Сообщений: 452
  • Уважение: +992
  • Люмены: 7389

Задание 3
Поле для ввода

да, на меня напали немцы...
[html]<p class="codepen" data-height="305" data-theme-id="dark" data-default-tab="html,result" data-slug-hash="pvvdgeJ" data-pen-title="Кодомарафон на Маяке: Поле для ввода" data-user="Blahaand-Kiri-KiriWind" style="height: 305px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Blahaand-Kiri-KiriWind/pen/pvvdgeJ">
  Кодомарафон на Маяке: Поле для ввода</a> by Blaha& Kiri (KiriWind) (<a href="https://codepen.io/Blahaand-Kiri-KiriWind">@Blahaand-Kiri-KiriWind</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Канарейка (2025-04-29 18:21:09)

Подпись автора

https://images2.imgbox.com/e9/c2/656eOmY7_o.gif

+5

55

  • Последний визит:
    Сегодня 00:58:42
  • Автор: Канарейка
  • ролевое чмо
  • Канарейка
  • Сообщений: 452
  • Уважение: +992
  • Люмены: 7389

Задание 4
Пост недели

[html]<p class="codepen" data-height="510" data-theme-id="dark" data-default-tab="html,result" data-slug-hash="MYYOKBj" data-pen-title="Кодомарафон на Маяке: Лучший пост в таблице" data-user="Blahaand-Kiri-KiriWind" style="height: 510px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Blahaand-Kiri-KiriWind/pen/MYYOKBj">
  Кодомарафон на Маяке: Лучший пост в таблице</a> by Blaha&amp; Kiri (KiriWind) (<a href="https://codepen.io/Blahaand-Kiri-KiriWind">@Blahaand-Kiri-KiriWind</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Канарейка (2025-04-30 12:06:23)

Подпись автора

https://images2.imgbox.com/e9/c2/656eOmY7_o.gif

+6

56

  • Последний визит:
    Сегодня 00:58:42
  • Автор: Канарейка
  • ролевое чмо
  • Канарейка
  • Сообщений: 452
  • Уважение: +992
  • Люмены: 7389

Задание 5
Анкета персонажа

обидно было уменьшать всё, поэтому тут +мобилка
[html]<p class="codepen" data-height="514" data-theme-id="dark" data-default-tab="result" data-slug-hash="EaabRGO" data-pen-title="шаблон анкеты для кодо-марафона" data-user="Blahaand-Kiri-KiriWind" style="height: 514px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/Blahaand-Kiri-KiriWind/pen/EaabRGO">
  шаблон анкеты для кодо-марафона</a> by Blaha&amp; Kiri (KiriWind) (<a href="https://codepen.io/Blahaand-Kiri-KiriWind">@Blahaand-Kiri-KiriWind</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано Канарейка (2025-04-30 13:12:50)

Подпись автора

https://images2.imgbox.com/e9/c2/656eOmY7_o.gif

+6

57

  • Последний визит:
    Вчера 23:56:22
  • Автор: SomeOwl
  • упал в посты - подняли
  • SomeOwl
  • Сообщений: 49
  • Уважение: +87
  • Люмены: 0
#p136167,max, the murderer! написал(а):

Задание 4
Пост недели
Стилизовать блок с постом недели для шапки форума

Кто летит квакать в последний вагон?
[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="YPPLOWP" data-pen-title="mayak4" data-user="-no-the-sans" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/-no-the-sans/pen/YPPLOWP">
  mayak4</a> by Анна no (<a href="https://codepen.io/-no-the-sans">@-no-the-sans</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://forumstatic.ru/files/001c/76/cd/52012.png
[html]<div style="text-align:right;opacity:0;pointer-events:none;">
https://dragcave.net/image/QQEjq.gif https://dragcave.net/image/7gNYh.gif https://dragcave.net/image/Vy7nB.gif https://dragcave.net/image/45uHt.gif https://dragcave.net/image/3qM98.gif https://dragcave.net/image/87dhG.gif
https://dragcave.net/image/AMDCv.gif https://dragcave.net/image/BYeKx.gif https://dragcave.net/image/UTKqf.gif https://dragcave.net/image/5Yxzj.gif https://dragcave.net/image/37J4k.gif https://dragcave.net/image/JyHri.gif</div>
[/html]

+6

58

  • Последний визит:
    Вчера 23:56:22
  • Автор: SomeOwl
  • упал в посты - подняли
  • SomeOwl
  • Сообщений: 49
  • Уважение: +87
  • Люмены: 0
#p136167,max, the murderer! написал(а):

Задание 5
Анкета персонажа
Придумать и стилизовать простой шаблон анкеты персонажа

и еще одно в этот вагон
я вообще не дизигнер и вкуса у еня нет, но есть лягуЩки

И да,  не нашел варианта вывода под кодом, пришлось учиться "мобилить")

[html]<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="JoovmjG" data-pen-title="mayak5" data-user="-no-the-sans" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/-no-the-sans/pen/JoovmjG">
  mayak5</a> by Анна no (<a href="https://codepen.io/-no-the-sans">@-no-the-sans</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Подпись автора

https://forumstatic.ru/files/001c/76/cd/52012.png
[html]<div style="text-align:right;opacity:0;pointer-events:none;">
https://dragcave.net/image/QQEjq.gif https://dragcave.net/image/7gNYh.gif https://dragcave.net/image/Vy7nB.gif https://dragcave.net/image/45uHt.gif https://dragcave.net/image/3qM98.gif https://dragcave.net/image/87dhG.gif
https://dragcave.net/image/AMDCv.gif https://dragcave.net/image/BYeKx.gif https://dragcave.net/image/UTKqf.gif https://dragcave.net/image/5Yxzj.gif https://dragcave.net/image/37J4k.gif https://dragcave.net/image/JyHri.gif</div>
[/html]

+6

59

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]Второй кодомарафон окончен!
Всем спасибо за участие, все молодцы https://forumupload.ru/uploads/001b/ff/2a/3/253186.png

Вот такие были призы

https://forumstatic.ru/files/001b/ff/2a/73828.png

https://forumupload.ru/uploads/001b/ff/2a/3/894182.gif

https://forumupload.ru/uploads/001b/ff/2a/3/246429.gif

Erhart, выполнены задания: 1
Награды: иконка

Coffee table knight, выполнены задания: 1, 2
Награды: иконка, купон

Канарейка, выполнены задания: 1, 2, 3, 4, 5
Награды: иконка, купон, плашка, фон, ачивка

max, the murderer!, выполнены задания: 1, 3
Награды: иконка, плашка

SomeOwl, выполнены задания: 1, 2, 3, 4, 5
Награды: иконка, купон, плашка, фон, ачивка

Коллекционные ачивки выданы. Иконки, плашки, фоны и купоны вы забираете самостоятельно https://forumstatic.ru/files/0013/b7/c4/34400.gif

Важно: при выполнении четырёх основных заданий, пожалуйста, указывайте сразу, какой приз хотите удвоить — это сэкономит время и нам, и вам https://forumupload.ru/uploads/001b/ff/2a/3/115609.png
Также напоминаю, что писать JavaScript для заданий не нужно, задания нацелены на развитие навыков вёрстки на HTML и CSS. Не пользуйтесь нейросетями для выполнения заданий; пусть лучше результат будет простым, но вы сделаете его самостоятельно https://forumupload.ru/uploads/001b/ff/2a/3/514608.png

https://forumupload.ru/uploads/001b/ff/2a/3/161012.png Новые задания уже в шапке темы https://forumupload.ru/uploads/001b/ff/2a/3/161012.png

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+1

60

  • Последний визит:
    Сегодня 02:21:32
  • Автор: max, the murderer!
  • трёхногая сутулая фея
  • max, the murderer!
  • <a href="/viewtopic.php?id=1099">анкета</a> ∙ <a href="/viewtopic.php?id=716#p49483">дизайны и вёрстка</a> ∙ <a href="/viewtopic.php?id=1453#p129624">мастерская графики</a>
  • Сообщений: 2146
  • Уважение: +5059
  • Люмены: 5441

[hideprofile]

Задание 1
Инвентарь персонажа
Придумать и стилизовать HTML-шаблон с набором предметов в инвентаре персонажа (например: нож, фонарь, две батарейки, аптечка). Попробуем в этот раз без шаблонов https://i.imgur.com/BtfGZ.png

Подпись автора

https://i.ibb.co/THYFM7h/image.png
av © serotonin

+2

Страница:   1 2 3  

Вы здесь » Маяк » Mayak Design Awards » Кодомарафон

Рейтинг форумов | Создать форум бесплатно