Комментарии пользователя Genri_Rus

Ankhena, добрый день

Я погуглил про доступное скрытие, а именно там говорилось об visibility: hidden, но про font-size: 0 я так ничего и не нашел

Из ваших предложений, я сделал одну кнопку

<button class="menu-mobile__icon menu-mobile__icon--open">
  <span class="menu-mobile__icon-line">Menu</span>
</button>

и добавил анимацию открытия/закрытия

Но все таки мне пришлось с помощью js сделать клонирование меню в мобильной версии сайта, т.к. акции из каталога перенести стандартными способами не получится

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, ну тогда объясните мне, почему надпись menu нельзя использовать ?)

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, так валидатор ругается на пустоту и почему вы считаете, что

собираетесь его скрыть через font-size 0,то не лучше.

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena,

Я и за пустые теги ругаю, а уж за левые нули просто уволила бы к черту.

Понял, принял, лучше тогда так ?
Menu

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Зачем вам ноль внутри спана я не знаю.

Говорят, что валидатор ругается на пустоту в верстке

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, а почему у триграм svg, а не 0 ?
Насколько я знаю бургер меню делают по-разному:

<button>
	<span>0</span>
	<span>0</span>
	<span>0</span>
</button>

Либо с псевдоэлементами:
0 ?

Написано более трёх лет назад

Как можно реализовать более правильное поведение кнопки с типом submit?

Genri_Rus @Genri_Rus Автор вопроса

its2easyy, я платить никому не собираюсь )

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, это:

<button class="menu-mobile__icon menu-mobile__icon--open">
	<span class="menu-mobile__icon-line">0</span>
</button>

И это:

<button class="menu-mobile__icon menu-mobile__header-close menu-mobile__icon--close">
   <svg class="icon-close icon-close--menu-mobile" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M9.76221 8.00009L15.7444 2.01765C15.9089 1.85297 15.9997 1.63326 16 1.39898C16 1.16458 15.9092 0.94461 15.7444 0.780188L15.2202 0.25609C15.0553 0.0910169 14.8356 0.000610352 14.6011 0.000610352C14.367 0.000610352 14.1473 0.0910169 13.9824 0.25609L8.00026 6.23814L2.01782 0.25609C1.85327 0.0910169 1.63343 0.000610352 1.39902 0.000610352C1.16488 0.000610352 0.945041 0.0910169 0.780488 0.25609L0.256 0.780188C-0.0853333 1.12152 -0.0853333 1.67671 0.256 2.01765L6.23831 8.00009L0.256 13.9823C0.0913171 14.1472 0.000650406 14.3669 0.000650406 14.6012C0.000650406 14.8355 0.0913171 15.0552 0.256 15.22L0.780358 15.7441C0.944911 15.909 1.16488 15.9996 1.39889 15.9996C1.6333 15.9996 1.85314 15.909 2.01769 15.7441L8.00013 9.76191L13.9823 15.7441C14.1471 15.909 14.3668 15.9996 14.601 15.9996H14.6012C14.8355 15.9996 15.0552 15.909 15.22 15.7441L15.7443 15.22C15.9088 15.0553 15.9996 14.8355 15.9996 14.6012C15.9996 14.3669 15.9088 14.1472 15.7443 13.9824L9.76221 8.00009Z"/></svg>
</button>

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, как это Стрелок011 предложил )

Я его код под ваш модернизировал:

<div class="navbar">
	<div class="navbar-top">
		<div class="menu-top"></div>
	</div>
	<div class="navbar-center">
		<div class="menu-mobile">
			<button class="menu-toggle menu-toggle--open">
				<span class="icon-open">0</span>
			</button>
			<div class="menu-mobile__container">
				<div class="menu-mobile__header">
					<div class="menu-mobile__title">Меню</div>
					<button class="menu-toggle menu-toggle--close"><svg class="icon-close"></svg></button>
				</div>
				<nav class="menu-mobile__nav">
					<ul class="menu-mobile__nav-list">
						<li class="menu-mobile__item"><a href="" class="menu-mobile__link">link</a></li>
						<li class="menu-mobile__item"><a href="" class="menu-mobile__link">link</a></li>
						<li class="menu-mobile__item"><a href="" class="menu-mobile__link">link</a></li>
						<li class="menu-mobile__item"><a href="" class="menu-mobile__link">link</a></li>
					</ul>
				</nav>
			</div>
		</div>
		<a href="#" class="navbar-center__logo logo">Лого</a>
		<div class="navbar-center__search search">
			
		</div>
		<div class="navbar-bottom">
			<div class="menu-bottom"></div>
		</div>
	</div>
</div>

Проблема в том, что у меня линии menu-toggle--open сделаны с помощью стилей, а меню с классом menu-toggle--close с помощью svg
И я не представляю как можно с помощью одной кнопки сделать сразу и бургер, и close меню

Написано более трёх лет назад

Можно ли так называть классы по БЭМ?

Genri_Rus @Genri_Rus Автор вопроса

Ankhena, ну мой вариант имеет право жить ?)

<div class="navbar">
  <div class="navbar-top">
    <div class="menu-top"></div>
  </div>
  <div class="navbar-center">
    <div class="menu-mobile">
      тут в мобильной версии menu-top и menu-bottom
    </div>
    <a href="#" class="navbar-center__logo logo">Лого</a>
    <div class="navbar-center__search search">
    
    </div>
  <div class="navbar-bottom">
    <div class="menu-bottom"></div>
  </div>
</div>

Написано более трёх лет назад

Войдите на сайт