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

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

Маяк. Сообщество ролевиков и дизайнеров

Объявление

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

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



Кодомарафон

Сообщений 1 страница 5 из 5

1

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

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

Про задания

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Личное звание для профиля
Написать и стилизовать HTML-шаблон для поля профиля

200 люменов

 

Для амс

[hideprofile]

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

поблагодарить за всё ♥
https://i.ibb.co/THYFM7h/image.png
анкета / мастерская / обучение / бесплатный шаблон дизайна

© aurum seneca

+14

2

[hideprofile]

Задание 1
Личное звание для профиля

Чтобы было от чего оттолкнуться, подготовил для вас шаблон на Codepen. Нажмите "Fork" в правом нижнем углу интерфейса, чтобы продублировать шаблон к себе и вносить в него изменения. Не забывайте сохраняться ♥

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

поблагодарить за всё ♥
https://i.ibb.co/THYFM7h/image.png
анкета / мастерская / обучение / бесплатный шаблон дизайна

© aurum seneca

+6

3

Задание 1
Личное звание для профиля

Решил сам выполнить задание и показать примером, как это может выглядеть) Я поигрался и поменял дизайн профиля в целом, вы можете это делать, а можете не делать, главное, чтобы само задание было выполнено https://forumupload.ru/uploads/001b/ff/2a/3/257005.png
[html]<p class="codepen" data-height="580" data-default-tab="result" data-slug-hash="qEBPpLR" 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/qEBPpLR">
  Кодомарафон на Маяке: моё ЛЗ</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]
Чтобы в демке сразу было видно результат, можно выбрать Result в настройках при экспорте с Codepen или вручную изменить это значение в вставляемом коде:

data-default-tab="result"

А так меняется высота в пикселях:

data-height="580"

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

поблагодарить за всё ♥
https://i.ibb.co/THYFM7h/image.png
анкета / мастерская / обучение / бесплатный шаблон дизайна

© aurum seneca

+13

4

Задание 1
Личное звание для профиля

[html]<p class="codepen" data-height="800" data-theme-id="dark" data-default-tab="result" data-slug-hash="MYWELMp" data-pen-title="Кодомарафон на Маяке: ЛЗ" data-user="hi_hagen" 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/hi_hagen/pen/MYWELMp">
  Кодомарафон на Маяке: ЛЗ</a> by hagen (<a href="https://codepen.io/hi_hagen">@hi_hagen</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://public.codepenassets.com/embed/index.js"></script>[/html]

Отредактировано hagen (Сегодня 00:13:47)

+7

5

[html]<p class="codepen" data-height="600" data-theme-id="dark" data-default-tab="result" data-slug-hash="pvodzMN" 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/pvodzMN">
  Профиль</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]

Отредактировано Канарейка (Вчера 22:40:41)

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

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

+5



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