30/30 100% Испытание круглая стрелка. 1 вопрос!!!

А Вопрос такой: Вот мы все эти с Less уроки прошли, а я так и не понял где его прописывать!!!
Прописываю в CSS файле - мне всё подчёркивает красным цветом и ничего не работает.
Как подключить сам препроцессор то ??? Господа разработчики курсов.

@color: #618ad2;

.zero-centered() {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}

.size(@width: 0px; @heigth: 0px) {
    width: @width;
    height: @heigth;
}

.round-border-line(@border-width: 0px) {
    border: @border-width solid @color;
    border-right-color: transparent;
    border-radius: 50%;
}

.absolute-pseudo-element() {
    content: "";
    position: absolute;
}

.position(@top: 0px; @left: 0px) {
    top: @top;
    left: @left;
}

.triangle-bottom-right(@border-width: 0px) {
    border-width: @border-width;
    border-style: solid;
    border-bottom-color: @color;
    border-right-width: 0;
    border-top-width: 0;
    border-left-color: transparent;
}

.arrow-round {
    .zero-centered();
    .size(150px; 150px);
    .round-border-line(25px);
}

.arrow-round::after {
    .absolute-pseudo-element();
    .triangle-bottom-right(50px);
    .position(-15px; 110px);
}
1 лайк

Есть несколько вариантов. Изучите мануал http://lesscss.org/#using-less.

Я читал этот пост и смеялся) На работе вдруг что, ты скажешь PMу - я не знаю как дальше делать, меня этому на “htmlacademy” не научили.

Берешь открываешь поиск и смотришь, как где устанавливать LESS.

Непонятно, где у людей девается самостоятельность и про-активность? Почему все так сложно?

3 лайка

История, которая случилась недавно:

Был на IT конференции, докладчик рассказывал про VueJs. Весь доклад (где-то на час) состоял из объяснения как его подключить. Ни слова о том что это, как и где использовать. Ни одного примера)

Полностью противоположная ситуация. Так, что с less и курсом “htmlacademy” все в порядке

3 лайка

Непонятно, где у людей девается самостоятельность и про-активность? Почему все так сложно?

Ну вообще, справедливый вопрос задал человек. Ты прошел курс как управляться с помощью лесс, а как его подключить тебе не показали. Это бред. Ваши курсы это сервис … за который человек заплатил деньги. Вы ему сразу напишите, что после прохождения курсов ему придется гуглить на сторонних ресурсах дополнительную информацию, и не просто дополнительную, а считай самую важную. Вам сразу расскажут куда вам идти с вашими платными курсами. Человек просто уйдет и выберет себе более продуманный сервис. Я бы на вашем месте поправил этот момент.
P.S. у меня этот вопрос тоже встал, и тоже пришлось гуглить

4 лайка

дружище, быстро “вайти в айти” не получится, придется постоянно что-то гуглить и самообразовываться. курсы дают информацию как управляться с технологией, а уж как вы её использовать будете - вопрос другой. вы же не сетуете на то, что создатели курса Кексби не рассказывают где скачать купить фотошоп, как установить его дистрибутив, как в нем читать макет и пр. (хотя потом и видеоразбор для тугих добавили все равно). Хотите свалить с академии - свалите, если найдете такой же уровень подачи материала за такие деньги.

2 лайка

Ты что обиделся? Да мы забыли тебя спросить, что нам делать :slight_smile:
Ну смотри, если по аналогии.
В разборе курсов СSS сразу первым делом доводят до ученика как сделать что бы он работал с HTML
Почему в Less не сделать так же? Почему методология обучения меняется в худшую сторону?

4 лайка

@color: #618ad2;

.zero-centered() {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}

.size(@width: 0px; @height: 0px) {
width: @width;
height: @height;
}

.round-border-line(@border-width: 0px) {
border: @border-width solid @color;
border-right-color: transparent;
border-radius: 50%;
}

.absolute-pseudo-element() {
content: “”;
position: absolute;
}

.position(@top: 0px; @left: 0px) {
top: @top;
left: @left;
}

.triangle-bottom-right(@border-width: 0px) {
border-width: @border-width;
border-style: solid;
border-top-width: 0;
border-right-width: 0;
border-bottom-color: @color;
border-left-color: transparent;
}

.arrow-round {
.zero-centered();
.size(150px; 150px);
.round-border-line(25px);
}

.arrow-round::after {
.absolute-pseudo-element();
.position (-15px; 110px);
.triangle-bottom-right(50px);
}

100%

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

2 лайка

Чеел, если тебе не рассказывают как подключить то это не повод бунтовать, просто поищи решения в интернете или установи многофункциональные программы типо Brackets

Посмотрите длину кода LESS и длину кода CSS.
LESS точно не к этому заданию применять надо.