Comments (4)
- Использовать точечную нотацию для классов css в pug, то есть твое
span(class="rating") превратиться в span.rating. Во всем проекте привести к одному стилю, а то где-то так где-то эдак. - Тегов без классов быть не должно и это есть в стандартах.
from toxinhoteluikit.
- во всем проекте в таком и подобных случаях использовать всю мощь препроцессора, а именно знак амперсанда & в качестве ссылки на родительский селектор
.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.
- Для одного уровня вложенности отступы должны быть одинаковые. В противном случае код выглядит неряшливо. Пример:
.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.
Я так понимаю, линтер или автоформаттер не использовались? Потому как пробелы, отступы и пустые строки до сих пор пляшут и код выглядит по прежнему неряшливо. Например в коде ниже перед открывающей фигурной скобкой то есть пробел? то нет (а должен быть).
.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)
- README.md
- устранить неполадки сборки HOT 2
- структура папок, подчистить проекты HOT 1
- Реализовать автоматический импорт стилей HOT 1
- Именование HOT 6
- БЭМ HOT 9
- Соответствие стандартам и общие вопросы HOT 1
- responsive HOT 4
- Readme HOT 2
- package.json
- Структура хранения данных
- px
- ограничение высоты блока
- Внешнее позиционирование HOT 1
- ES6 Class
- js- префикс
- Именования должны быть осмысленными
- Убрать в проекте дублирование кода
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from toxinhoteluikit.