Электронный магазин энергосервисной компании

Главные вкладки

Аватар пользователя Stan.Ezersky Stan.Ezersky 19 июня 2014 в 15:40

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

Вживую и пример товара

Много кастомного, включая Bootstrap — изменённый и перепиленный в LESS

Есть ещё фронт работ по сайту, но уже практически невидимых пользователю, разве что изменение текстов под SEO. Работы по мобильной версии ещё ведутся.

Если есть вопросы, отвечу.

Сайт на Drupalogy.ru

ВложениеРазмер
Иконка изображения eneservice_ru.jpg144.99 КБ

Комментарии

Аватар пользователя Anya Anya 19 июня 2014 в 17:26

"Stan.Ezersky" wrote:
Много кастомного, включая Bootstrap — изменённый и перепиленный в LESS

Расскажите, если еще свеже в памяти, как бутстрап через LESS подключили и как с ним работали, а то у меня раньше не получилось (http://www.drupal.ru/node/107291).

Аватар пользователя Stan.Ezersky Stan.Ezersky 19 июня 2014 в 17:42

"Anya" wrote:
Расскажите, если еще свеже в памяти, как бутстрап через LESS подключили
Нет подключал. Кастомизировал отдельно, вырезал ненужное, включал требуемое. То есть, грубо выразиться, своя сборка. Подключаются к теме мои bootstrap.min.css, bootstrap-theme.min.css и bootstrap.min.js

Аватар пользователя Stan.Ezersky Stan.Ezersky 19 июня 2014 в 19:00

"Anya" wrote:
Понятно, то есть фактически свой бутстрап кастомизованный сформировали тут:
http://getbootstrap.com/customize/
и подключили к своей теме?

Нет, редактирование, переписывание, добавление/удаление LESS-файлов.

"Moel" wrote:
так и задумано?
О, спасибо что заметили. По лени (и ещё отсутствующих классах и стилях) при сборке функционала такое встречается.

— — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — — —

По поводу LESS. Мне, лично, не хватает кучи вспомогательных классов, к примеру:
прерывистое подчёркивание инлайн-ссылок,
выделение цветом,
расширение блочного функционала.

Мне не нужны GlythIcons, я заменяю их на FontAwesome (т.е. вырезается одно, подключается другое)

Вот к примеру подключаемые мной кастомные файлы со стилями из одного проекта

@import "custom/tiles.less";
@import "custom/timeline.less";
@import "custom/custom.less";
@import "custom/fileinput.less";
@import "custom/select.less";
@import "custom/slider.less";
@import "custom/badges.less";
@import "custom/animations.less";
@import "custom/nav-filter.less";

А вот как обстоят дела с Javascripts.

bootstrap: {
        src: [
          'js/transition.js',
          'js/alert.js',
          'js/button.js',
          'js/collapse.js',
          'js/dropdown.js',
          'js/tooltip.js',
          'js/popover.js',
          'js/scrollspy.js',
          'js/tab.js',
         
          'js/custom/slider.js',
          'js/custom/inputmask.js',
          'js/custom/select.js',
          'js/custom/fileinput.js',
          'js/custom/maxlength.js'          
        ],
        dest: 'dist/js/<%= pkg.name %>.js'
      }

Нет карусели, модальных окон, эффикса. Добавлены мои скрипты. В основном, это украшательства, но функциональные
На замену модальным окнам — Fancybox, на замену карусели — OwlCarousel

Вот пример дополнительных инлайн-ссылок
Спойлеров нет, так что сорри за простыню.

//Dashed links
a.dashed {
  color: @Brand-dark;
  border-bottom: 1px dashed @Brand-dark;
  text-decoration: none;
    &:hover,
    &:focus,
    &.active  {
      color: @Brand-dark-hover;
      border-bottom: 1px solid @Brand-dark-hover;
      text-decoration: none;
    }
    &.primary {
      color: @Brand-primary;
      border-bottom: 1px dashed @Brand-primary;
      &:hover,
      &:focus,
      &.active  {
        color: @Brand-primary-hover;
        border-bottom: 1px solid @Brand-primary-hover;
        text-decoration: none;
      }
    }    
    &.success {
      color: @Brand-success;
      border-bottom: 1px dashed @Brand-success;
      &:hover,
      &:focus,
      &.active  {
        color: @Brand-success-hover;
        border-bottom: 1px solid @Brand-success-hover;
        text-decoration: none;
      }
    }
    &.info {
      color: @Brand-info;
      border-bottom: 1px dashed @Brand-info;
      &:hover,
      &:focus,
      &.active  {
        color: @Brand-info-hover;
        border-bottom: 1px solid @Brand-info-hover;
        text-decoration: none;
      }
    }
    &.warning {
      color: @Brand-warning;
      border-bottom: 1px dashed @Brand-warning;
      &:hover,
      &:focus,
      &.active  {
        color: @Brand-warning-hover;
        border-bottom: 1px solid @Brand-warning-hover;
        text-decoration: none;
      }
    }
    &.danger {
      color: @Brand-danger;
      border-bottom: 1px dashed @Brand-danger;
      &:hover,
      &:focus,
      &.active  {
        color: @Brand-danger-hover;
        border-bottom: 1px solid @Brand-danger-hover;
        text-decoration: none;
      }
    }
   
}

Здесь ещё и по цветам раскиданы ссылки, т.е. вид инлайн-ссылок будет таким:

<a class="dashed primary" href="#">инлайн-ссылка</a>
<a class="dashed success" href="#">инлайн-ссылка</a>
<a class="dashed info" href="#">инлайн-ссылка</a>
<a class="dashed warning" href="#">инлайн-ссылка</a>
<a class="dashed danger" href="#">инлайн-ссылка</a>

Я дорабатываю свой Бутстрэп, как будет готов, выложу на Гитхабе.

Моё мнение, что использовать Bootstrap в дефолтном виде нет смысла: часть не используется, чего-то не хватает. Переопределять существующие классы — плодить кучу лишних и повторяющихся строк.

Аватар пользователя drupby drupby 20 июня 2014 в 1:25

"ХулиGUN" wrote:
Ну чё-та ты мелко плаваешь... Варвашеня вон уже собирается пилить свою ось... Рабочее название iVarvashenOS ))))

Ну так АХулиOS ждемс.

Аватар пользователя Stan.Ezersky Stan.Ezersky 20 июня 2014 в 11:17

"ХулиGUN" wrote:
Все эти универсальные хреньки как правило малоокупаемы
Зато, как инструменты в работе, очень даже удобны. Я ни в коем случае ни про ОС Smile

Аватар пользователя Cynicus Cynicus 21 июня 2014 в 15:44

Moel wrote:
"Anya" wrote:
Пробовала модулем (https://www.drupal.org/project/less), но у меня не работало.

Что то не так делаете. Модуль рабочий.

Для бутстрапа с рекомендуемым парсером - не рабочий, сыпется на обработке extend. Нужно ставить другой парсер или переделывать исходники.

Аватар пользователя Moel Moel 21 июня 2014 в 18:56

"Cynicus" wrote:
Для бутстрапа с рекомендуемым парсером - не рабочий, сыпется на обработке extend. Нужно ставить другой парсер или переделывать исходники.

Я подтему делал вот этого https://www.drupal.org/project/bootstrap У мну модуль Less работает

Аватар пользователя Cynicus Cynicus 23 июня 2014 в 8:19

Moel wrote:
"Cynicus" wrote:
Для бутстрапа с рекомендуемым парсером - не рабочий, сыпется на обработке extend. Нужно ставить другой парсер или переделывать исходники.

Я подтему делал вот этого https://www.drupal.org/project/bootstrap У мну модуль Less работает

Не пользовался никогда базовыми темами. Проверь, если интересно, подавится или нет:
.a {
color: black;
}
.b:extend(.a) {
background: white;
}

Аватар пользователя Moel Moel 5 августа 2014 в 20:23

"Stan.Ezersky" wrote:
Много кастомного, включая Bootstrap — изменённый и перепиленный в LESS

Если еще актуальна критика, то страница заказа как простыня.
P.s. просто тоже сейчас бьюсь над темизацией заказа.

Аватар пользователя Stan.Ezersky Stan.Ezersky 11 апреля 2015 в 23:26

"VasyOK" wrote:
Можно вопрос:

вот тут http://eneservice.ru/catalog/dir/arhitekturnoe_osveshchenie/
раньше по наведению на товар тема с помощью JS плоявлялась. А теперь с помощью CSS. Почему?

Заказчик оставил дизайн, ушёл с Drupal

Аватар пользователя Stan.Ezersky Stan.Ezersky 19 мая 2015 в 10:50

"Andruxa" wrote:
а в чем причина?
Мы договорились с заказчиком, что модуль онлайн-оплаты он купит позже, разработаем, прикрутим. Потом появился, попросил на халяву, я отказал. попросил отсрочку платежа — отказал. Просто заказчик кинул до этого сайта многих — ему сделали три версии, он всех кинул, а сайты работали. когда взялся за проект раюотал только со 100%-предоплатой. Я не стал в рассрочку работать. Он понял, что кинуть меня не выйдет и нанял другого разработчика. Нуб ему сделал хню, а тот, как обычно, кинул. Дизайн они оставили.