dima117 Nov 18 2012 at 21:24

Верстка like Metro UI

1 min

37K

CSS*Website development*

+38

Comments 76

int22h Nov 18 2012 at 21:31

А можно пару слов об основных отличиях от тоге же Twitter Bootstrap? Чем принципиально лучше? Возможно есть толк оформить как тему к Twitter Bootstrap, а не плодить очередной css фреймворк.

dima117 Nov 18 2012 at 21:38

Делать тему — больше геморроя. Т.е. будут лишние стили, которые нужно переопределять и проверять, что они не проявились в самых неожиданных местах. Этим имеет смысл заниматься если планируется переключение Metro UI => Bootstrap (а такого я делать точно не буду).

Кроме того, я не ставил целью «плодить очередной css фреймворк». Это просто мой код, который, как мне показалось, пригодится другим.

int22h Nov 18 2012 at 21:43

Цели не ставили, но представили как свой css framework. По этому и закономерный вопрос чем лучше.

dima117 Nov 18 2012 at 21:48

можете привести причины делать тему для bootstrap?

int22h Nov 18 2012 at 21:58

За основу все равно был взят bootstrap. И мне кажется что как тему поставит куда больше людей, чем рискнут использовать вместо уже проверенных фреймворков. Учитывая что пока не видно никаких преимуществ.

dima117 Nov 18 2012 at 22:05

Вы правы: преимущества для разработчика, а не для пользователей. Буду благодарен, если приведете хотя бы одно преимущество для пользователей темы перед отдельными стилями.

dima117 Nov 18 2012 at 22:06

Кстати, на счет темы — она может сломать сайт с бутстрапом точно также, как непроверенный CSS framework — в чем разница?

int22h Nov 18 2012 at 22:08

Тему легче откатить.

dima117 Nov 18 2012 at 22:09

Не согласен — откатить можно точно также.

dima117 Nov 18 2012 at 22:08

И третий вопрос: если бы было написано «с нуля», Вы бы восприняли это нормально?

int22h Nov 18 2012 at 22:10

Не принципиально с нуля или нет. Я не услышал ответа на вопрос «чем же лучше?».

dima117 Nov 18 2012 at 22:20

Видимо, мы с Вами смотрим на вопрос с разных сторон:
— я смотрю с позиции разработчика — у меня 2 преимущества: уменьшение объема работы + меньше потенциальных ошибок, связанных с переопределением стилей;
— Вы смотрите с позиции пользователя этих стилей: с Вашей стороны преимуществ одного варианта над другим я, действительно, не вижу.

int22h Nov 18 2012 at 22:26

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

dima117 Nov 18 2012 at 22:32

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

Fesor Nov 19 2012 at 01:29

Гемороя это да, но все же если переопределять стили через LESS и правильно, на выходе мы получим чистенький и красивый CSS. Уже проверено. Но да, это геморой.

dordzhiev Nov 18 2012 at 21:33

Хлопаю стоя!!! Спасибо, первый нормальный метро-фреймворк!
На остальные, к сожалению, без слез смотреть нельзя.

UFO just landed and posted this here

dima117 Nov 18 2012 at 21:54

Если честно, в safari не проверял.

Сейчас посмотрел, нашел некорректное отображение в разделе «Appended inputs». А какие косяки Вы имели в виду?

UFO just landed and posted this here

dima117 Nov 18 2012 at 22:14

Да, извините, про Pills with dropdowns я забыл.
Это не только в safari происходит, а вообще во всех броузерах — не доделано.

Про иконки и селекты я все проверю и обязательно исправлю. Спасибо Вам!

dima117 Nov 18 2012 at 22:40

Спасибо!
Буду рад, если это пригодится кому-то, кроме меня.

jMas Nov 18 2012 at 22:42

Первый более-менее адекватный metro-like css фреймверк. Thanks.

sugestr Nov 19 2012 at 00:00

Смесь руско-английского слегка сбивает :)

Сам фреймворк очень приятен, скоро допилите до modal windows?

dima117 Nov 19 2012 at 00:08

Про русский язык — согласен. Я планирую сделать все на английском и написать нормальное описание. Пока не сделал, т.к. думаю, что важнее доделать оставшиеся пункты из списка на главной странице.

Я сейчас делаю Navbar и исправляю мелкие недоработки, которые периодически нахожу. Если хотите, следующими сделаю окна. Судя по скорости работы над предыдущими элементами, navbar и окна должны быть готовы на этой неделе.

sugestr Nov 19 2012 at 00:12

Спасибо. Окна и алерты было бы самое то :)

bo883 Nov 19 2012 at 00:17

Чекбоксы, радио сьежают под разными браузарами. В боевых условиях не применимо. Удачи.

dima117 Nov 19 2012 at 00:34

Жаль, что не смог Вам помочь.
Записал, обязательно исправлю.

UFO just landed and posted this here

aeryaguzov Nov 19 2012 at 08:09

А где собственно tiles?

dima117 Nov 19 2012 at 08:16

Точно, забыл добавить в список.
Уже добавил.

(Правда, я не думаю, что это ключевой элемент интерфейса.)

Azy Nov 19 2012 at 08:28

у кнопок текст вверх съехал в хроме — это задумано или баг отображения в хроме?

dima117 Nov 19 2012 at 08:34

Съехал на 1 px вверх от задуманного. Должно быть так, чтобы надпись маленькими буквами была выровнена по вертикали по центру.

Спасибо за Ваше замечание! Обязательно исправлю.

yujin1st Nov 19 2012 at 15:58

Если честно, не понял, о каких маленьких буквах идет речь?

dima117 Nov 19 2012 at 16:15

О буквах в нижнем регистре.

Goobs Nov 19 2012 at 09:08

Еще с отступами в селектах что-то. Ubuntu, Firefox 16.0.2

Goobs Nov 19 2012 at 09:09

Да, а в целом задача создания лаконичного минималистичного интерфейса выполняется, спасибо большое, буду следить за проектом)

dima117 Dec 13 2012 at 15:19

появился репозиторий на github
github.com/dima117/milk

также за обновлениями можно следить через твиттер
twitter.com/ecm7milk

Valeratal Nov 19 2012 at 10:13

А микрософт самостоятельно не желает выложить набор своих стилей? ну чтоб не привязыватся к бустрапам, а просто использовать стили ModernUI в собственно собираемых темах

dima117 Nov 19 2012 at 14:29

Как бы я хотел, чтобы они выложили стили, готовые к употреблению…

Valeratal Nov 19 2012 at 15:08

Петиций интересно нигде не собирают?

un1t Nov 19 2012 at 10:15

Хорошая штука, для прототипирования самое оно. Спасибо.

dima_smol Nov 19 2012 at 11:20

Здорово!

Только непонятно почему на гитхаб не выложили?

dima117 Nov 19 2012 at 11:41

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

yujin1st Nov 19 2012 at 16:00

Мне кажется, выкладку можно и руками немного поделать, а проект тем временем развиваться уже будет =)

dima117 Dec 13 2012 at 15:18

репозиторий на github уже появился
github.com/dima117/milk

также за обновлениями можно следить через твиттер
twitter.com/ecm7milk

Alex_sik Nov 19 2012 at 15:06

Надеюсь фреймворк будет развиваться и дальше.

dima117 Nov 19 2012 at 18:54

Я уже использую его в своем проекте и бросать не планирую :)

RomanNikitin Nov 19 2012 at 18:38

А переключение на черный Metro Style не планируется у вас?

dima117 Nov 19 2012 at 18:52

Пока нет. Надо сначала довести до конца то, что есть сейчас на главной странице.

sugestr Nov 19 2012 at 19:10

скажите, а тумблер on/off существует в этой парадигме и\или в этом фреймверке?

dima117 Nov 20 2012 at 09:15

Вы имеете в виду что-то вроде этого?

sugestr Nov 20 2012 at 22:35

Wow… однако хорошо сделанный framework у человека. Вполне составляет конкуренцию работе топикстартера. А кстати, вы рассматривали этот вариант прежде чем начали писать свой? В чём отличия и преимущества вашего?

dima117 Nov 20 2012 at 23:28

Ссылка на него есть в топике.
На мой взгляд, основное отличие- metroui.org.ua похож на интерфейс Windows 8, а Milk больше похож на интерфейс сайтов MS.

sugestr Nov 21 2012 at 00:17

а кстати в чем именно страдает качество и какие костыли приходиться вставлять? (кроме упомянутого datepicker)

dima117 Nov 21 2012 at 00:34

Посмотрите на радио-кнопки и на стрелки у выпадающих списков, например.

sugestr Nov 21 2012 at 01:00

да действительно. глянул хромом — чекбоксы не чекаются, в опере чакаются но выглядят коряво.
safari на ipad работают, но выглядят слегка корявенько (но не так плохо как в опере)

losik_ua Nov 23 2012 at 22:23

не могли бы сказать в какой точно версии не работает?
Спасибо.
п.с. Олтон спрашивает.

sugestr Nov 24 2012 at 00:01

opera 12.11 выглядит вот так clip2net.com/s/2xdwZ

chrome 23.0.1271 (пишет что самая последняя) cheсkbox упрямо не чекаются при клике на них clip2net.com/s/2xdyO

dima117 Nov 20 2012 at 23:43

Кстати, по поводу тумблеров…
Тумблер предполагает, что при его нажатии произойдет какое-то действие, а checkbox — нет (нет действия, только изменение состояния). Разница примерно такая же, как между меню (выбор пункта предполагает действие) и выпадающим списком (нет действия при выборе элемента списка). Я с трудом себе представляю сценарий на сайте, в котором действия происходят при переключении тумблера. Поэтому добавлять тумблеры в Milk пока не планирую.

sugestr Nov 21 2012 at 00:15

да запросто.

отображается, скажем, поток фотографий, а тумблер переключает состояние потока «отображать только фаворитс»

очень логично применять именно тумблер(-а) на странице которые влияют на состояние текущего view на этой странице

dima117 Nov 21 2012 at 00:34

Написал Вам личное сообщение.

Omgovich Nov 19 2012 at 19:41

Выглядит отлично, спасибо за труды.
А репозитория на GitHub у вашего проекта нет?

dima117 Nov 19 2012 at 21:40

Сейчас нет. Будет на этой неделе.

UFO just landed and posted this here

dima117 Nov 23 2012 at 19:25

Неделя была очень напряженной, планирую заняться этим завтра (т.е. в субботу).

dima117 Dec 13 2012 at 15:18

репозиторий на github уже появился
github.com/dima117/milk

также за обновлениями можно следить через твиттер
twitter.com/ecm7milk

dima117 Dec 13 2012 at 15:17

репозиторий на github уже появился
github.com/dima117/milk

также за обновлениями можно следить через твиттер
twitter.com/ecm7milk

Omgovich Dec 13 2012 at 15:36

Спасибо

hardtop Nov 20 2012 at 07:39

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

dima117 Nov 20 2012 at 09:00

Готово!

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

hardtop Nov 20 2012 at 10:00

Ок, буду в личку писать. Спасибо — так гораздо лучше смотрится.

gouranga Dec 13 2012 at 11:31

Пожалуйста, загрузите на github или bb. Разработка быстрее пойдет.

dima117 Jul 11 2013 at 16:53

К сожалению, разработка быстрее не пошла, поэтому продолжение будет в собственном репозитории SVN, как раньше (а результаты — на сайте).

yujin1st Apr 16 2013 at 08:12

Жаль что проект оказался заброшен

dima117 Apr 16 2013 at 09:12

Извините, что не уделял времени проекту.

Я планирую продолжить работу над ним (т.к. сам использую его), но прямо сейчас, к сожалению, нет возможности это сделать.
Вы же понимаете, что я пишу Milk в свое свободное время, и не могу для него отказаться от работы или от решения проблем моей семьи.

В первую очередь я реализовал компоненты, которые был инеобходимы мне для использования в других проектах. Сейчас появилась необходимость вновых компонентах (breadcrumbs, pagination, modal windows). Как только появится свободное время, я вернусь к работе над проектом и начну с этих компонентов.

Также я буду рад, если Вы или кто-то другой решит поучаствовать в проекте вместе со мной (код выложен на github).

ozonar Sep 29 2014 at 11:13

День добрый.

Насколько реально использовать фреймворк на данный момент? Работа над ним идёт?