bsakhanov

Flippin' burgers

A set of hamburger menu open/close animations

A Pen by Mikael Ainalem on CodePen.

License.

bsakhanov

Проблема поддержки русских букв в joomla возникает при использовании галереи, когда разрешаем пользователям добавлять файлы.
Есть решение в базе знаний joomla с отключением функции JFile::makeSafe($file), которая считает русские буквы чем-то некорректным и с изменением кодировки в win-1251. Данное решение может отличаться для разных версии используемых галерей, я уже молчу, что необходимо предусмотреть перекодирование имени файла для отображения его пользователю в кодировку сайта. Преимущество только одно: по ftp вы увидите файлы русскими буквами и Вы сможете закачивать файлы с русскими названиями по ftp. Но, как показала практика, совсем не просто тогда заставить вэбсервер показывать эти файлы. Потом инструкция есть только для phocagallery.

Я предлагаю более простое решение, и, на мой взгляд более, верное, да и заработает сразу для всех.
Обычно сайт уже работает в кодировке UTF-8 и я рекомендую использовать только эту кодировку, потому как только с ней почти не будет проблем.
Ищем файлик "/libraries/joomla/

bsakhanov

Filter Uikit 3

A Pen by Beibit Sakhanov on CodePen.

License.

bsakhanov

<div class="uk-section">
<div class="uk-container">
<div class="uk-grid uk-child-width-1-4@m uk-child-width-1-2@s uk-grid-match uk-grid-small" uk-grid>
		<div class="card-flip">
			<div class="uk-card uk-card-default uk-card-small uk-card-hover card">
      <a href="#" class="uk-position-cover"></a>
				<div class="front uk-background-cover uk-height-medium uk-panel uk-flex uk-flex-center uk-flex-middle" style="background-image: url(https://getuikit.com/docs/images/light.jpg);">
            <p class="uk-h4">Front</p>
        </div>
        <div class="back card-face uk-background-cover uk-height-medium uk-panel uk-flex uk-flex-center uk-flex-middle" style="background-image: url(https://getuikit.com/docs/images/dark.jpg);">

bsakhanov

<div class="uk-section">
  <div class="uk-container">
    <div class="uk-grid uk-grid-medium" uk-height-match="target: > div > .uk-card; row: false" uk-grid>
    <div class="uk-width-1-2@m">
        <div class="uk-card uk-card-default uk-grid-collapse uk-child-width-1-2@s uk-margin featured uk-background-cover" uk-grid>
    <div class="uk-card-media-left uk-cover-container">
        <img src="https://getuikit.com/docs/images/light.jpg" alt="" hidden uk-cover>
        <canvas width="600" height="400"></canvas>
    </div>
    <div>

bsakhanov

CSS and SVG Masks

I made this page to collect different types of masks and to test how browsers support them. The winner is SVG : )

Demos were made without fallbacks, so you can open this page in different browsers to check how they support collected features.

A Pen by yoksel on CodePen.

License.

bsakhanov

Cloudy SVG-filter

Filter was made in https://yoksel.github.io/svg-filters/

A Pen by yoksel on CodePen.

License.

bsakhanov

Drop-down table / CSS

A Pen by Beibit Sakhanov on CodePen.

License.

bsakhanov

<div class="raz"><a href="#">Красота</a><span><a href="#">Волосы</a><a href="#">Лицо</a><a href="#">Макияж</a><a href="#">Тело</a><a href="#">Косметология</a><a href="#">Диеты</a><a href="#">Фитнес</a></span></div>

bsakhanov

<div class="raz">
  <a href="#">Красота</a>
    <span>
      <a href="#">Волосы</a>
      <a href="#">Лицо</a>
      <a href="#">Макияж</a>
      <a href="#">Тело</a>
      <a href="#">Косметология</a>
      <a href="#">Диеты</a>
      <a href="#">Фитнес</a>