mirror of
https://github.com/mediacms-io/mediacms.git
synced 2024-11-29 03:33:58 +01:00
aa6520daac
* Added frontend development files/environment * More items-categories related removals * Improvements in pages templates (inc. static pages) * Improvements in video player * Added empty home page message + cta * Updates in media, playlist and management pages * Improvements in material icons font loading * Replaced media & playlists links in frontend dev-env * frontend package version update * chnaged frontend dev url port * static files update * Changed default position of theme switcher * enabled frontend docker container
52 lines
1.5 KiB
Handlebars
Executable File
52 lines
1.5 KiB
Handlebars
Executable File
// https://github.com/sass/sass/issues/659#issuecomment-64819075
|
|
@function char($character-code) {
|
|
@if function-exists("selector-append") {
|
|
@return unquote("\"\\#{$character-code}\"");
|
|
}
|
|
|
|
@return str-slice("\x", 1, 1) + $character-code;
|
|
}
|
|
|
|
$icon-font-family: {{fontName}};
|
|
|
|
@font-face {
|
|
font-family: $icon-font-family;
|
|
src: url(data:application/font-woff;charset=utf-8;base64,BASE64_WOFF_FONT) format('woff');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
// http://sass-lang.com/documentation/file.SASS_REFERENCE.html#maps
|
|
$icons: (
|
|
{{#each codepoints}}
|
|
{{@key}}: '{{this}}',
|
|
{{/each}}
|
|
);
|
|
|
|
// NOTE: This is as complex as we want to get with SCSS functionality.
|
|
//
|
|
// Now that we have a map of icons above, we can iterate over that map and create an icon class
|
|
// for each icon in that list. The iterator below produces CSS classes like this:
|
|
//
|
|
// .vjs-icon-play {
|
|
// font-family: VideoJS;
|
|
// font-weight: normal;
|
|
// font-style: normal;
|
|
// }
|
|
// .vjs-icon-play:before { content: "\25b6"; }
|
|
//
|
|
// We can then use @extend in the codebase when we need to add an icon to a class. @extend builds up
|
|
// the selectors for you so you can avoid duplication. This is generally a bad idea, but since each
|
|
// icon should only be extended one or two other places, we'll roll with it.
|
|
@each $name, $content in $icons {
|
|
.vjs-icon-#{$name} {
|
|
font-family: $icon-font-family;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
|
|
&:before {
|
|
content: char($content);
|
|
}
|
|
}
|
|
}
|