Giter VIP home page Giter VIP logo

Comments (4)

Sergio-Ka avatar Sergio-Ka commented on June 29, 2024
  1. Использовать точечную нотацию для классов css в pug, то есть твое
    span(class="rating") превратиться в span.rating. Во всем проекте привести к одному стилю, а то где-то так где-то эдак.
  2. Тегов без классов быть не должно и это есть в стандартах.

from toxinhoteluikit.

Sergio-Ka avatar Sergio-Ka commented on June 29, 2024
  1. во всем проекте в таком и подобных случаях использовать всю мощь препроцессора, а именно знак амперсанда & в качестве ссылки на родительский селектор
.footer-big {
    width: 100%;
    background: #fff;
    box-shadow: 0px 1px 0px rgba(31, 32, 65, 0.1);
    margin: 2.3125rem 0 0 0;
    padding: 6.25rem 0 0px 0px;
    display: flex;
    position: relative;

}

.footer-big>.wrapper {
    flex-wrap: wrap;
}

.footer-big__main {
    display: flex;
    padding: 0.0625rem 0 5.625rem 0;
    justify-content: space-between;
    width: 100%;
}

.footer-big__logo {
    max-width: 16.25rem;
    p {
        font-size: 0.875rem;
        line-height: 1.5rem;
        color: rgba(31, 32, 65, 0.75);
        letter-spacing: -0.0063rem;
    }
}

Что-то типа &__logo вместо .footer-big__logo. Кроме того тут вижу селектор по тегу и каскад, это все запрещено методологией БЭМ.
По поводу амперсанда кстати уже писал в другом замечании про именование. Если кто-то из проверяющих делает какое-то замечание - это значит что на предмет этого замечания нужно просматривать ВЕСЬ проект, даже если это не указано явно. А если проверяющий за стажера будет все замечания аналогичные отлавливать, то во-первых будет терять время, во-вторых стажер ничему не научится. Не говоря уже о том, что по 10 раз одно и то же повторять - такое себе развлечение.

from toxinhoteluikit.

Sergio-Ka avatar Sergio-Ka commented on June 29, 2024
  1. Для одного уровня вложенности отступы должны быть одинаковые. В противном случае код выглядит неряшливо. Пример:
.bullet-list{
  &__item{
      font-size: 0.875rem;
      line-height: 1.5rem;
      color: rgba(31, 32, 65, 0.75);
      margin: 0 0 0.625rem 0.625rem;
      position: relative;
      padding: 0 0 0 0.75rem;
      width: 15rem;
    }
    &__item:before {
      width: 0.625rem;
      height: 0.625rem;
      border-radius: 0.625rem;
      background: rgba(31, 32, 65, 0.25);
      content: "";
      padding-right: 0rem;
      display: inline-block;
      margin: 0 0.625rem 0 0;
      position: absolute;
      left: -0.5625rem;
      top: 0.4375rem;
     }
  }

Это во-первых. Если тяжело делать это руками, надо пользовать автоформаттер и желательно линтер для scss.
Во-вторых у тебя &__item повторяется дважды. Обычно по нормальному это делается так:

.bullet-list {
  &__item {
    font-size: 0.875rem;
    line-height: 1.5rem;
    color: rgba(31, 32, 65, 0.75);
    margin: 0 0 0.625rem 0.625rem;
    position: relative;
    padding: 0 0 0 0.75rem;
    width: 15rem;

    &:before {
      width: 0.625rem;
      height: 0.625rem;
      border-radius: 0.625rem;
      background: rgba(31, 32, 65, 0.25);
      content: "";
      padding-right: 0rem;
      display: inline-block;
      margin: 0 0.625rem 0 0;
      position: absolute;
      left: -0.5625rem;
      top: 0.4375rem;
    }
  }
}

Как всегда это только для примера. На предмет этого замечания надо просмотреть весь проект.

from toxinhoteluikit.

Sergio-Ka avatar Sergio-Ka commented on June 29, 2024

Я так понимаю, линтер или автоформаттер не использовались? Потому как пробелы, отступы и пустые строки до сих пор пляшут и код выглядит по прежнему неряшливо. Например в коде ниже перед открывающей фигурной скобкой то есть пробел? то нет (а должен быть).

.bullet-list{
  &__item{
      font-size: 0.875rem;
      line-height: 1.5rem;
      color: rgba(31, 32, 65, 0.75);
      margin: 0 0 0.625rem 0.625rem;
      position: relative;
      padding: 0 0 0 0.75rem;
      width: 15rem;

      &:before {

from toxinhoteluikit.

Related Issues (19)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.