шпаргалка

Интеграция с Font Awesome

Конечно, вы можете рассматривать новый шрифт как отдельный набор иконок. Но разве не было бы круто расширить сам набор Font Awesome? Давайте сделаем это!

Единственная вещь, которую нужно понять, заключается в том, что мы будем наследовать CSS стили, определённые Font Awesome CSS файлом. Например, он будет содержать примерно такую запись:

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

Теперь давайте определим наш собственный CSS файл. Назовём файл .

Первой записью в этом файле должно идти объявление правила font-face. Может быть сделано как ниже. Это несложно. Лишь немного базового CSS.

Далее мы можем определить желаемые иконки:

Обратите внимание, что мы определяем иконки как псевдо-элементы, используя селектор. Таким образом, мы можем внедрить нужный нам контент внутрь элемента, который использует объявленные классы

В созданном нами шрифте FontMoreAwesome “A”, “B” и “C” обозначаются иконками для Troll, Lol и Like-a-boss соответственно. Хотя это не лучший способ сделать это.

Font Awesome использует области для частного использования (Unicode Private Use Area, PUA), чтобы застраховать экранные читалки от зачитывания случайных символов, которые и представляют собой иконки.

Но, для простоты рассказа, в нашем примере мы будем держаться букв английского алфавита.

Ещё один момент, достойный упоминания — в примере выше, при внедрении на страницу своего контента, мы перезаписываем правило font-family, определённое Font Awesome.

Как установить шрифт Awesome на сайт

Далее вам необходимо распаковать архив и скопировать к себе на сайт содержимое папок /css и /webfonts, например в директорию /css/awesome.

Теперь подключите в секции вашего сайта стили Awesome:

<link rel="stylesheet" href="/css/awesome/css/all.css" />

Альтернативный способ подключения шрифтов Awesome

Можно ничего не копировать к себе на сайт, а загружать все данные из CDN сети. Для этого нужно добавить следующий код в раздел :

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css">

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

Минус — это невозможность использования на автономных сайтах (без доступа к интернету) и зависимость от CDN сети Awesome. Поэтому я, как правило, использую первый способ.

Настройка

Основанный на языке программирования lua, файл настроек находится в .

Создание файла настроек

Во-первых, создайте новый каталог, необходимый в следующем шаге:

$ mkdir -p ~/.config/awesome/

Awesome попытается использовать настройки, которые содержится в файле ~/.config/awesome/rc.lua. Он не создается автоматически, поэтому скопируйте шаблон:

$ cp /etc/xdg/awesome/rc.lua ~/.config/awesome/

Синтаксис файла настроек часто изменяется при обновлении awesome. Поэтому повторите эту команду, если с awesome произошло что-то непонятное или же вы хотите изменить настройки.

Примеры

Примечание: Синтаксис конфигурации awesome регулярно меняется, поэтому Вам скорее всего придется изменить файл, который Вы скачаете.

Отличные примеры файлов rc.lua можно найти по следующим ссылкам:

Расширения

Несколько расширений доступных для awesome (3.5+):

Расширение	Функционал
	Поверхностный просмотр всех открытых клиентов
	Динамические тэги
	Всплывающие уведомления
	Запустит программу если она не запущена, иначе перейдёт на неё

Темы оформления

Тема по-умолчанию содержится в . Скопируйте её и измените в .

beautiful.init(awful.util.getdir("config") .. "/themes/default/theme.lua")

Обои рабочего стола

Beautiful может обрабатывать ваши обои, поэтому вам не нужно устанавливать их в ваших файлах или . Это позволяет иметь конкретные обои для каждой темы.

Начиная с версии Awesome 3.5 больше не поддерживает команду awsetbg, вместо этого он имеет модуль gears. Вы можете установить обои внутри при помощи

theme.wallpaper = "~/.config/awesome/themes/awesome-wallpaper.png" 

Чтобы загрузить обои, убедитесь, что ваш содержит

beautiful.init("~/.config/awesome/themes/default/theme.lua")
for s = 1, screen.count() do
	gears.wallpaper.maximized(beautiful.wallpaper, s, true)
end

Интеграция

Интегрировать Font Awesome очень просто в Twitter Bootstrap, а так же использовать отдельно на ваше усмотрение.

Bootstrap + Font Awesome

Используйте Font Awesome с Bootstrap CSS.

Скопируйте папку со шрифтами Font Awesome в Ваш проект.
Затем скопируйте font-awesome.min.css в Ваш проект.

Откройте файл font-awesome.min.css и отредактируйте путь к файлам со шрифтами, если это необходимо.
Папка со шрифтами находится относительно (выше) директории с CSS-файлами.

Внутри тега Вашей html-страницы, поместите ссылку на font-awesome.min.css.

Обратите внимание на примеры использования Font Awesome перед началом работы над своим проектом!

Кастомная интеграция Bootstrap + Font Awesome с использованием LESS

Используйте этот метод для интеграции Font Awesome в Twitter Bootstrap используя LESS.

Скопируйте папку со шрифтами Font Awesome в Ваш проект.
Затем скопируйте font-awesome.less в директорию bootstrap/less.
Откройте bootstrap.less и замените на

Откройте файл font-awesome.less и отредактируйте переменную так что бы она указывала на директорию со шрифтами.

@FontAwesomePath: «../font»;

Папка со шрифтами находится относительно (выше) директории с скомпилированными CSS-файлами.

Перекомпилируйте Ваш LESS в случае использования статичного компилятора

В другом случае все готово к работе.
Обратите внимание на примеры использования Font Awesome перед началом работы над своим проектом!

Кастомная интеграция Bootstrap + Font Awesome Integration используя SASS или SCSS

Не используете Bootstrap?

Font Awesome — работает и без использования Twitter Bootstrap.

Скопируйте папку со шрифтами Font Awesome в Ваш проект.
Затем скопируйте font-awesome.less или font-awesome.min.css в папку Вашего проекта.
Откройте font-awesome.less либо font-awesome.min.css и отредактируйте пути к шрифтам (см

пример выше).
Обратите внимание на примеры использования Font Awesome перед началом работы над своим проектом!

Miscellaneous

• — Text based data interchange format.
• — A text file format that stores tabular data and uses a comma to separate values.
• — Recursion illustrated.
• — Stack Overflow, Quora, etc.
• — Design app for macOS.
• — Task runner.
• — Ask Me Anything.
• — Cross-platform API for rendering 2D and 3D graphics.
• — Unicode standards, quirks, packages and resources.
• — For community-based and non-institutional scientists.
• — «Internet of Things» connectivity protocol.
• — Node.js CLI framework.
• — Low-overhead, cross-platform 3D graphics and compute API.
• — Typesetting language.
• — An economist’s starter kit.
• — Informatics techniques applied to problems in chemistry.
• — Choose your next color scheme.
• — Digital distribution platform.
• — Building bots.
• — Building and promoting more compassionate engineering cultures.
• — Dynamic tracing framework.
• — Enhance your browsing experience.
• — Pokémon and Pokémon GO.
• — Managing technical and business operations through a chat.
• — Falsehoods programmers believe in.
• — Software development approach for complex needs by connecting the implementation to an evolving model.
• — Self-tracking through technology.
• — Python-based config management system.
• — For digital designers.
• — Programming something expressive instead of something functional.
• — Web apps that work without login.
• — Free as in freedom.
• — Prototyping interactive UI designs.
• — Markup language.
• — Funny developer projects.
• — Open source healthcare software for facilities, providers, developers, policy experts, and researchers.
• — Open Source eCommerce built with PHP.
• — Graph drawing packages for TeX/LaTeX/ConTeXt.
• — Study of the nervous system and brain.
• — Ad-free alternatives.
• — Programming languages designed for experimentation or as jokes rather than actual use.
• — Open-source monitoring system.
• — Smart home devices.
• — Double-entry accounting on the command-line.
• — Public domain works.
• — Digital currency where encryption is used to regulate the generation of units and verify transfers.
• — Creating a more inclusive and diverse tech community.
• — Companies that offer their tools and services for free to open source projects.
• — Create better and more consistent designs and experiences.
• — Teachings from the Theravada Buddhist tradition.
• — Open source Java app performance management tool.
• — The experience of being an open source maintainer.
• — Calculators for every platform.
• — A type of challenge–response test used in computing to determine whether or not the user is human.
• — Create and share documents that contain code, equations, visualizations and narrative text.
• — International high school robotics championship.
• — Open source projects that help improve society.
• — Conference and meetup speakers in the programming and design community.
• — Table-top gaming fun for all.
• — Fund individual programmers or the development of open source projects.
• — Parasites and host-pathogen interactions.
• — Food-related projects on GitHub.
• — Mental health awareness and self-care in the software industry.
• — Start accepting Bitcoin.
• — Solving complex scientific problems using computers.
• — Open source technology for farming and gardening.
• — Design a product from the initial concept to production.
• — Turn your database into a GraphQL API.
• — The discipline of designing and building software.
• — Better understand who has access to telecommunication and internet infrastructure and on what terms.
• — Tech stacks for building different apps and features.
• — Image-based profiling of biological phenotypes for computational biologists.
• — Open source messaging protocol.
• — Advertising and programmatic media for websites.
• — Find ways to resolve the climate crisis.
• — Naming things in computer science done right.
• — How to extract information from unstructured biomedical data and text.
• — An effort to preserve the Web for future generations.
• — Command-line interface for WordPress.

Советы и рекомендации

Сама идея использования различных шрифтов на веб страницах начала бурно развиваться последние два года. О таких темпах развития можно только мечтать. Однако до сих пор разработчикам приходится сталкивать с множеством проблем кроссбраузерного отображения. Все эти проблемы решатся, когда Web Open Font Format (WOFF) будет признан сообществом разработчиков как стандарт.

Другим препятствием, которое уже упоминалось ранее, является распространенность операционной системы Windows, в которой субпиксельный рендеринг отключен (либо по умолчанию в Windows XP или по предпочтению со стороны пользователя). По сравнению с системными шрифтами, большинство веб-шрифтов отображаются в низком качестве, из-за отсутствия субпиксельного рендеринга. Конечно же, со временем данная проблема будет решена, так как пользователи заменят старое оборудование и операционные системы. В то же время, Internet Explorer 9 работает с текстом процессором DirectWrite, что обеспечивает значительно более совершенную обработку.

Использование веб-шрифтов в вашем дизайне требует тщательного тестирования, так как на различных браузерах и платформах результат может быть прямо противоположный. Если экран имеет низкое разрешение, и отсутствует поддержка субпиксельного рендеринга, то отображение будет искажено или будет вовсе отсутствовать. Самый простой способ решения данной проблемы — это чтобы все сменили железо и операционки! Но этого же не будет) Конечно, вы можете использовать JavaScript, для того чтобы узнать о поддержке субпиксельного рендеринга.

Отображение текста

Даже если некоторые веб макеты приближаются по сложности к макетам из печати (благодаря богатым наборам вложенных шрифтов), есть еще большая проблема: браузеры автоматически не расставляют переносы. Особенно в языках, где существует много длинных слов (например, немецкий), что плохо сказывается на читаемости текста.

Но это дело можно подправить при помощи JavaScript client-side hyphenation, который был разработан phpHyphenator. Но и с этим инструментом могут возникнуть проблемы интеграции в браузере, но в будущем, думаю, и это будет решено.

Фишки OpenType

Тут есть и обратная сторона медали. Дело в том, что такие программы как InDesign и QuarkXPress 7+, не поддерживают типографических стандартов OpenType.

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

Некоторые шрифты могут быть использованы только при наличии поддержки OpenType. Всеобъемлющей OpenType может содержать глифы и другие элементы. С помощью функции OpenType, базовая версия будет заменена версией с соответствующими элементам, которые поддерживаются в софтине. Пример на рисунке:

Недавно вышедший Firefox 4 поддерживает все вышеперечисленные фишки OpenType. Теперь вы можете пользоваться данными преимуществами следующим образом:

h1 {
    -moz-font-feature-settings: 'smcp=1';   
}

Microsoft предоставила список возможностей OpenType, которые поддерживает. Будем надеяться, что все остальные браузеры последуют их примеру.

Надеемся, эта статья была для вас познавательна! В скором времени все эти проблемы навряд ли решатся. Нам остаётся только ждать.

Как подключить Font Awesome

В этой главе мы подробно разберемся как подключить Font Awesome 5 всеми возможными способами.
И какой из них лучше выбрать.

Подключение с помощью CDN

Чтобы подключить иконочный шрифт Font Awesome 5 с помощью CDN необходимо перейти на
страницу: Font Awesome
Start и выставить необходимые параметры.
Полученный код вставляем в тег вашего сайта, на тех
страницах где вы собираетесь использовать иконки.

Скриншот №1

На скриншоте №1 изображены настройки, которые я использую.

1. Выбираем версию, которая нам нужна. Free — бесплатная
   версия. Pro — платная и имеет дополнительные стили и наборы
   иконок.
2. Начертание шрифта, которое мы будем использовать в своем проекте.
3. Что мы будем использовать. Webfont — иконочный
   шрифт. SVG — иконки в формате .svg
4. Сгенерированный код для подключения Font Awesome с помощью CDN.

Чтобы не переходить на сайт, я размещу код со стандартными настройками здесь.

Подключить Font Awesome с помощью CDN очень просто. Ведь вам нужно разместить всего лишь одну
строчку кода в свой проект и все будет работать. Файлы будут храниться на сервере
разработчиков. Но я предпочитаю хранить все на своем хостинге, так как я точно могу быть
уверен, что все будет работать корректно и никакие изменения и обновления со стороны
разработчика шрифта не затронут мой проект.

Подключение Font Awesome 5 с хранением файлов на своем хостинге (CSS)

Для начала нужно скачать файлы Font Awesome и разместить их на свой хостинг. Для этого
переходим по этой ссылке https://fontawesome.com/how-to-use/on-the-web/setup/hosting-font-awesome-yourself
или
скачиваем по прямой ссылке.

После скачивания получаем архив с файлами, как на скриншоте №2:

Скриншот №2

Для работы иконочного шрифта необходимы только папки выделенные красным. И то в
паке /CSS нам нужен только один
файл css/all.min.css (Смотрите скриншот №3)

Скриншот №3

Файл all.min.css хранит все стили шрифта Font Awesome, я использую именно
этот файл. На это есть много причин связанные с моим личным удобством. Вы же можете
использовать тот файл, стили которого вы будете использовать. Например, если вы хотите
использовать только бесплатный иконочный шрифт, достаточно подключить файл
fontawesome.min.css.

.min в названии файла показывает, что файл сжат, то есть
убраны лишние пробелы и переносы. Это увеличивает скорость обработки этого файла, но если вы
собираетесь его редактировать, что я вам делать не рекомендую, то удобней использовать файл
без .min

Переносим папку webfont и
файл all.min.css на свой хостинг.

Очень важно! Папка webfont нужно располагать на директорию
выше
чем файл all.min.css, иначе шрифт Font Awesome не подключится, так как в
стилях прописан именно такой путь для файлов со шрифтами. Если такой способ противоречит
структуре вашего проекта, тогда просто пропишите в файле all.min.css новый
путь до папки webfont

У меня это выглядит так:

Скриншот №4

В папке fontawesome хранится один
файл all.min.css

Как подключить иконки Font Awesome к сайту

Существует 2 способа подключения:

1. Подключить библиотеку иконок с самого сервиса, т.е. прописать путь к файлу иконок на стороне облачного хранилища, где сервис его хранит. В этом случае каждый раз при загрузке страницы будет грузиться и данный файл. Изначально у меня стоял такой вариант, но потом я заметил, что он достаточно сильно замедляет загрузку страниц. Именно поэтому я перешел на второй вариант.
2. Скачать файл иконок Font Awesome с официального сайта и подключить его в шаблон, как и обычный файл стилей. Работа сайта становится заметно быстрее.

Рассмотрим оба варианта более подробно.

Вариант 1

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

Вставляем ее на свой сайт между областямитут вставляем. Если у вас сайт на WordPress, то данная область находится в файле Header.php.

На этом подключение закончено. Остается только зайти на эту страницу и выбрать подходящую иконку. Жмем на понравившуюся иконку и попадаем на страницу с вариантами различных размеров иконок, чтобы вы понимали, как она будет выглядеть при разных размерах шрифта. Также там будет и код, который будет выводить иконку.

Этот код вставляем в любое место, где хотим отобразить иконку.

Замечу, что такой метод вставки не работает в названии виджетов WordPress. Если просто вставить перед фразой код иконки, то он будет пропадать оттуда. Поэтому нужно использовать другой метод с помощью Jquery, о котором я сделаю следующую статью Там тоже все очень просто.

Необходимо размещать код в файлах шаблона или в каких-то текстовых элементах. Например, в текстовом виджете в самом поле ввода содержимого, иконки работают. Таким образом у меня работает виджет популярных и обсуждаемых записей. Остальные же иконки прописаны в верстке, как самого шаблона, так и плагинов.

Вариант 2

Скачиваем папку с файлами .

Далее заходим в скачанный архив и углубляемся внутрь пока не будут видны все папки библиотеки.

Загружаем все файлы в корень темы ко всем папкам и файлам. Я не углублялся, нужно ли загружать только один конкретный файл или все папки, поэтому загрухил все, что было внутри архива.

Далее нужно подключить файл font-awesome.min.css, лежащий в папке CSS. Используем следующую строку, в ней только пропишите свой путь (домен и название темы). Размещаем ее по аналогии, как и с первым вариантом — в шапку сайта.

<link rel="stylesheet" href="http://ваш домен/wp-content/themes/название папки с темой/css/font-awesome.min.css">

Далее аналогичным образом ищем понравившуюся иконку и вставляем ее в нужные места шаблона.

Вот такой простой, но крайне полезный материал ля тех, кто любит что-то поделать с дизайном своего сайта. Незачем теперь использовать изображения, уменьшать их в фотошопе, обрезать и так далее. Достаточно подключить шрифт Font Awesome и использовать его возможности.

Изменение цвета иконок

Если же вам необходимо изменить цвет иконок, то это также вполне реально и не составит труда. У каждой иконки имеет общий класс (.fa) и индивидуальный класс с названием иконки. На примере выше с иконкой карандаша индивидуальный класс следующий:

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

.fa-pencil-square-o:before{
color: #111; /*черный цвет*/
font-size:12px /*размер иконки 12 пикселей в ширину и высоту*/
}

Аналогично можно прописать оформление и для всех иконок Font Awesome, если нет нужды делать каждую индивидуально. Например, получится:

.fa:before{
color: #111; /*черный цвет*/
font-size:12px /*размер иконки 12 пикселей в ширину и высоту*/
}

Иногда имеет смысл делать такое оформление, чтобы иконки выглядели как-то по своему и делали общий дизайн сайта более разнообразным и качественным. Сразу будет видно, что оформление сделано не на коленке.

На этом сей материал я заканчиваю. Надеюсь, что он вам будет полезен. Тема актуальная. Лично я теперь использую такие иконки на всех сайтах. Стараюсь избавляться от всех картинок, и делать все максимально чисто и просто.

Пока.

Versioning

Font Awesome will be maintained under the Semantic Versioning guidelines as much as possible. Releases will be numbered
with the following format:

The major version «5» is part of an umbrella release. It includes many different types of files and technologies. Therefore
we deviate from normal SemVer in the following ways:

• Any release may update the design, look-and-feel, or branding of an existing
  icon
• We will never intentionally release a version update that breaks
  backward compatibility
• A release may include backward-incompatible changes but we will
  write clear upgrading instructions in UPGRADING.md
• A or release will never remove icons
• Bug fixes will be addressed as releases unless they include backward
  incompatibility then they will be releases

Platforms

• — Async non-blocking event-driven JavaScript runtime built on Chrome’s V8 JavaScript engine.
• — Mobile operating system for Apple phones and tablets.
• — Mobile operating system developed by Google.
• — Cross-platform native desktop apps using JavaScript/HTML/CSS.
• — JavaScript API for hybrid apps.
• — JavaScript framework for writing natively rendering mobile apps for iOS and Android.
• — Mobile app development IDE, testing, and distribution.
• • — Virtual machine that allows you to write more efficient and powerful tracing and monitoring for Linux systems.
  • — Linux distributions and projects based on Arch Linux.
• — Operating system for Apple’s Mac computers.
• — Operating system for the Apple Watch.
• — P2P hypermedia protocol.
• — Mobile development tools.
• — Cloud platform as a service.
• — Credit card-sized computer aimed at teaching kids programming, but capable of a lot more.
• — Cross-platform GUI app framework.
• — Cross-browser extension system.
• — Write cross-platform native apps for iOS, Android, macOS, tvOS, and watchOS in Ruby.
• — Create apps for different TV platforms.
• — Simple and distraction-free desktop environment for Linux.
• — A free software community dedicated to creating an open and user-friendly computing experience.
• • — Open-source compilers and code analysis APIs for C# and VB.NET languages.
• — Virtual home assistant.
• — Cloud computing platform designed for developers.
• — Google’s mobile SDK for building native iOS and Android apps from a single codebase written in Dart.
• — Open source home automation that puts local control and privacy first.
• — Cloud platform for developers and companies.
• — App development platform built on Google Cloud Platform.
• — Set of software libraries and tools that help you build robot apps.
• — Visualize and store data from any device.
• — CDN, DNS, DDoS protection, and security for your site.
• — Developer platform for Google Assistant.
• — Low-cost microcontrollers with WiFi and broad IoT applications.
• — A secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust.

Решение проблем

Нахождение и устранение ошибок rc.lua

$ Xephyr :1 -ac -br -noreset -screen 1152x720 &
$ DISPLAY=:1.0 awesome -c ~/.config/awesome/rc.lua.new

Преимущество такого способа заключается в том, что вы не нарушите работу текущего рабочего стола awesome, избежите потенциальный сбой приложений X и потерю работоспособности. После того, как вы удовлетворены новыми настройками, скопируйте rc.lua.new в rc.lua и перезапустите awesome.

awmtt

AUR (Awesome WM Testing Tool — Утилита тестирования Awesome WM) представляет собой простую оболочку скрипта Xephyr. По умолчанию, он будет использовать ~/.config/awesome/rc.lua.test. Если он не может найти тестовый файл,он будет использовать ваш фактический rc.lua. Вы также можете указать местоположение файла настроек, который вы хотите проверить:

$ awmtt start -C ~/.config/awesome/rc.lua.new

Когда вы закончите тестирование, закройте окно:

$ awmtt stop

Или сразу смотрите изменения, которые вы делаете в файл настроек с помощью следующей команды:

$ awmtt restart

Клавиша Mod4

Awesome рекомендует переназначить , которой по умолчанию является Win key. Если по какой-то причине она не распознаётся как , используйте xmodmap чтобы узнать её. Для того чтобы изменить назначение, воспользуйтесь , чтобы найти код клавиши и имя клавиши для сопоставления. Затем добавьте нечто похожее в

xmodmap -e "keycode 115 = Super_L" -e "add mod4 = Super_L"
exec awesome

В этом случае проблемой является то, что иногда xorg распознаёт код клавиши 115 неправильно, как клавишу ‘Select’. Приведенная выше команда явно перераспределяет код ключа 115 на корректную клавишу ‘Super_L’.

Для того, чтобы переназначить с помощью (конфликтует с ) смотрите:

tail -50 /usr/share/X11/xkb/rules/evdev

Для установки клавиши caps lock как добавьте следующую строку в :

setxkbmap -option caps:hyper

Клавиша Mod4 против пользователей IBM ThinkPad

IBM ThinkPad не поставлялись с кнопкой Win (хотя компания Lenovo уже изменила этой традиции). Кнопка Alt по-умолчанию не используется в комбинациях, описанных в rc.lua. Это позволит Вам заменить ею кнопку Win. Чтобы сделать это, необходимо отредактировать rc.lua, заменив:

modkey = "Mod4"

на:

modkey = "Mod1"

Примечание: В awesome используются несколько сочетаний клавиш типа Mod4 + буква на клавиатуре. Изменив Mod4 на Alt, Вы можете получить наложение некоторых сочетаний. Эти сочетания придется также перебросить на другие кнопки.

Если Вы не хотите менять стандартные сочетания для awesome, Вы можете использовать другую кнопку. Например, Caps Lock используется нечасто, поэтому можно использовать ее в качестве Mod4. Измените ~/.Xmodmap:

clear lock 
add mod4 = Caps_Lock

и (пере)загрузите файл.
Это действие изменит Caps Lock на кнопку Mod4 и Вы сможете воспользоваться стандартными настройками awesome. Вдобавок, это позволит использовать Caps Lock как Mod4 и в других X-приложениях.

Recent updates of xorg related packages break mentioned remapping the second line can be replaced by (tested on a DasKeyboard and IBM Model M and xorg-server 1.14.5-2):

keysym Caps_Lock = Super_L Caps_Lock

Eclipse: невозможно изменить размер/переместить главное окно

Если главное окно «прилипло» и вы не можете переместить его или изменить размер (используя mod4 + левую/правую клавишу мыши) отредактируйте и установите fullscreen/maximized в значение false (если оно установлено), уменьшите цифру ширины и высоты на меньшую, чем размер одного вашего экрана рабочего стола.

можно найти в . Отредактируйте строку:

<window height="xx" maximized="true" width="xx" x="xx" y="xx"

YouTube: полноэкранный режим показывает как в фоновом режиме

Если видео с YouTube появляется под вашим браузером в полноэкранном режиме, или скрывается под панелью управления, то добавьте в

{ rule = { instance = "plugin-container" },
  properties = { floating = true } },

Для Chromium

{ rule = { instance = "exe" },
  properties = { floating = true } },

или:

{ rule = { role = "_NET_WM_STATE_FULLSCREEN" },
  properties = { floating = true } },

Запретить колесу прокрутки мыши менять теги

В вашем rc.lua, измените раздел Mouse Bindings на следующий;

-- {{{ Mouse bindings
root.buttons(awful.util.table.join(
    awful.button({ }, 3, function () mymainmenu:toggle() end)))
-- }}}

Запуск консольных клиентов на определённом теге

Это не работает, когда консольное приложение запускается из терминала GTK (например LXTerminal). URxvt как известно работает.

//group 2 = AltGr;
//group 3 = AltGr;
//group 4 = AltGr;

Computer Science

• • — Learning, implementing, and applying Machine Learning using Ruby.
  • — Models for Apple’s machine learning framework.
  • — Open source distributed machine learning platform written in Java with APIs in R, Python, and Scala.
  • — From experiment to production-level machine learning.
  • — Solving problems in finance with machine learning.
• • — The science of asking and answering in natural language with a machine.
  • — Generation of text used in data to text, conversational agents, and narrative generation applications.
• — Neural networks.
  • — Library for machine intelligence.
  • — WebGL-accelerated machine learning JavaScript library for training and deploying models.
  • — The most cited deep learning papers.
• — Evidence-based research on software systems.
• — Learn to develop your own search engine.
• — Computing which utilizes quantum mechanics and qubits on quantum computers.

Programming Languages

• • — Style guide and linter.
  • — Impossible sounding projects that exist.
  • — For npm packages.
  • — Package manager.
  • — Test runner.
  • — Linter.
  • — Task runner.
  • — Code snippets you can understand in 30 seconds.
  • — Like polyfills but without overriding native APIs.
• — Apple’s compiled programming language that is secure, modern, programmer-friendly, and fast.
• — General-purpose programming language designed for readability.
  • — Asynchronous I/O in Python 3.
  • — Scientific research in audio/music.
  • — A version of Python for microcontrollers.
  • — Data analysis and machine learning.
  • — Optional static typing for Python.
  • — A lean and efficient implementation of Python 3 for microcontrollers.
• — High-level dynamic programming language designed to address the needs of high-performance numerical analysis and computational science.
• — General-purpose language with a bias toward system programming and embedded, resource-constrained software.
• — Powerful dynamic multiparadigm language that facilitates iterative and interactive development.
• — Popular secure object-oriented language designed for flexibility to «write once, run anywhere».
• — Server-side scripting language.
• — Haskell for the JVM.
• — Build, test, and package software.
• — Object-oriented language targeting Adobe AIR.
• — Functional programming language for the JVM.
• — General purpose pure functional programming language with dependent types influenced by Haskell and ML.
• — Modern programming language designed for large, long-lived apps where reliability and efficiency are essential.
• — Domain-specific programming language used for expressing quantum algorithms.
• — Programming language inspired by Ruby and Python and compiles to performant JavaScript.
• — Programming language designed to take full advantage of the GLib and GNOME ecosystems, while preserving the speed of C code.
• — Formal language and environment for programming and specification which facilitates interactive development of machine-checked proofs.
• — Simple, fast, safe, compiled language for developing maintainable software.

Создание шрифта

Первый этап в нашем приключении заключается в создании шрифта Font More Awesome, что можно сделать используя инструкцию на их веб-сайте. Сперва нужна скачать шаблон. Вот пример:

Теперь мы должны заполнить секции желаемыми изображениями. Вы можете распечатать шаблон и нарисовать в нём иконки от руки, или использовать инструмент вроде Adobe Photoshop, GIMP с изображениями, которые вы скачаете из интернета.

После заполнения шаблона, он будет выглядить примерно так:

Следующая вещь, которую вы должны сделать, достаточно проста. Загрузите заполненный шаблон на calligraphr, и нажмите на кнопку “build font” — и БУМ! Вы можете скачать ваш персональный шрифт. Давайте назовём его .

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