EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Inline font styles, remove obsolete icon font

Browse Source
This commit is contained in:
Björn Fromme
2022-02-13 17:36:29 +01:00
parent 47ea384cf2
commit 259e3863ec
10 changed files with 101 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/typo3conf/ext/ep_theme/Classes/ViewHelpers/IconViewHelper.php
+56
View File
@@ -0,0 +1,56 @@
<?php
namespace EP\EpTheme\ViewHelpers;
use TYPO3\CMS\Core\Utility\GeneralUtility;
use TYPO3\CMS\Extbase\Service\ImageService;
use TYPO3Fluid\Fluid\Core\Rendering\RenderingContextInterface;
use TYPO3Fluid\Fluid\Core\ViewHelper\AbstractViewHelper;
use TYPO3Fluid\Fluid\Core\ViewHelper\Traits\CompileWithRenderStatic;
class IconViewHelper extends AbstractViewHelper
{
use CompileWithRenderStatic;
/**
* @var bool
*/
protected $escapeOutput = false;
public function initializeArguments()
{
parent::initializeArguments();
$this->registerArgument('icon', 'string', 'Icon name');
$this->registerArgument('class', 'string', 'CSS classes');
}
/**
* @param array $arguments
* @param \Closure $renderChildrenClosure
* @param RenderingContextInterface $renderingContext
* @return mixed
*/
public static function renderStatic(
array $arguments,
\Closure $renderChildrenClosure,
RenderingContextInterface $renderingContext
)
{
$imageService = self::getImageService();
$sprite = $imageService->getImage('EXT:ep_theme/Resources/Public/images/icons_sprite.svg', null, false);
$imageUrl = $sprite->getPublicUrl();
return sprintf(
'<svg class="%s"><use href="%s#icon-%s"></use></svg>',
$arguments['class'],
$imageUrl,
$arguments['icon']
);
}
protected static function getImageService()
{
return GeneralUtility::makeInstance(ImageService::class);
}
}
public/typo3conf/ext/ep_theme/Configuration/TypoScript/Page/Main.typoscript
+39
View File
@@ -144,6 +144,45 @@ page {
settings < plugin.tx_eptheme.settings
}
CSS_inlineStyle (
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 300;
font-display: swap;
src: local(''),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-300.woff2') format('woff2'),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-300.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local(''),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-regular.woff2') format('woff2'),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-regular.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local(''),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-700.woff2') format('woff2'),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-700.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local(''),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-900.woff2') format('woff2'),
url('/typo3conf/ext/ep_theme/Resources/Public/fonts/lato-v17-latin-900.woff') format('woff');
}
)
headerData.998 = TEXT
headerData.998.value (
<!-- Google Tag Manager -->
public/typo3conf/ext/ep_theme/Configuration/TypoScript/setup.typoscript
+1
View File
@@ -100,4 +100,5 @@ config {
typolinkEnableLinksAcrossDomains = 1
sendCacheHeaders = 1
content_from_pid_allowOutsideDomain = 1
inlineStyle2TempFile = 0
}
public/typo3conf/ext/ep_theme/Resources/Private/Assets/fonts/config.json
-34
View File
@@ -1,34 +0,0 @@
{
"name": "",
"css_prefix_text": "icon-",
"css_use_suffix": false,
"hinting": true,
"units_per_em": 1000,
"ascent": 850,
"glyphs": [
{
"uid": "12f4ece88e46abd864e40b35e05b11cd",
"css": "ok",
"code": 59392,
"src": "fontawesome"
},
{
"uid": "9f7e588c66cfd6891f6f507cf6f6596b",
"css": "phone",
"code": 59393,
"src": "fontawesome"
},
{
"uid": "ccc2329632396dc096bb638d4b46fb98",
"css": "mail-alt",
"code": 61664,
"src": "fontawesome"
},
{
"uid": "43ab845088317bd348dee1d975700c48",
"css": "ok-circled",
"code": 59394,
"src": "fontawesome"
}
]
}
public/typo3conf/ext/ep_theme/Resources/Private/Assets/fonts/fontello.woff
BIN
View File
Binary file not shown.
public/typo3conf/ext/ep_theme/Resources/Private/Assets/fonts/fontello.woff2
BIN
View File
Binary file not shown.
public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/base/_fonts.scss
-82
View File
@@ -1,82 +0,0 @@
/* lato-300 - latin */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 300;
font-display: swap;
src: local(''),
url('../../fonts/lato-v17-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('../../fonts/lato-v17-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* lato-regular - latin */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local(''),
url('../../fonts/lato-v17-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('../../fonts/lato-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* lato-700 - latin */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
font-display: swap;
src: local(''),
url('../../fonts/lato-v17-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('../../fonts/lato-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* lato-900 - latin */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 900;
font-display: swap;
src: local(''),
url('../../fonts/lato-v17-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('../../fonts/lato-v17-latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* Fontello icons */
@font-face {
font-family: 'fontello';
font-weight: normal;
font-style: normal;
font-display: swap;
src: local(''),
url('../../fonts/fontello.woff2') format('woff2'),
url('../../fonts/fontello.woff') format('woff');
}
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: never;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
font-variant: normal;
text-transform: none;
line-height: 1em;
margin-left: .2em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-check:before { content: '\e800'; }
.icon-phone:before { content: '\e801'; }
.icon-check-circle:before { content: '\e802'; }
.icon-mail:before { content: '\f0e0'; }
public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss
-1
View File
@@ -6,7 +6,6 @@
body {
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
@import "base/fonts";
@import "base/typography";
@import "base/images";
public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/Teaser.html
+4 -6
View File
@@ -24,9 +24,7 @@
<div class="absolute top-0 left-0 z-10 inset-x-0 p-2 flex justify-between items-center {f:if(condition: concept, then: 'bg-concept-{concept.code}-overlay', else: 'bg-ep-primary-80')}">
<div class="flex items-center space-x-2">
<f:if condition="{country.code}">
<svg class="product-teaser__flag">
<use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-flag-{country.code -> f:format.case(mode: 'lower')}"></use>
</svg>
{ep:icon(class: 'product-teaser__flag', icon: 'flag-{country.code -> f:format.case(mode: \'lower\')}')}
</f:if>
<span class="product-teaser__label-concept">
{concept.name}
@@ -61,14 +59,14 @@
</div>
<ul class="product-teaser__list-included flex-1 list-none m-0 text-gray-800 divide-y divide-gray-400">
<li class="flex items-center space-x-1 py-1">
<i class="icon-check text-ep-primary-light"></i>
{ep:icon(class: 'w-6 h-6 text-ep-primary-light', icon: 'check')}
<span class="block flex-1 leading-none">
{f:if(condition: '{season} == "s"', then: 'Bergbahnticket', else: 'Skipass')}
</span>
</li>
<f:if condition="{product.feature}">
<li class="flex items-center space-x-1 py-1">
<i class="icon-check text-ep-primary-light"></i>
{ep:icon(class: 'w-6 h-6 text-ep-primary-light', icon: 'check')}
<span class="block flex-1 leading-none">
{product.feature}
</span>
@@ -76,7 +74,7 @@
</f:if>
<f:if condition="{board}">
<li class="flex items-center space-x-1 py-1">
<i class="icon-check text-ep-primary-light"></i>
{ep:icon(class: 'w-6 h-6 text-ep-primary-light', icon: 'check')}
<span class="block flex-1 leading-none">
{board}
</span>
webpack.config.js
+1
View File
@@ -31,6 +31,7 @@ Encore
}
})
.copyFiles([
{ from: './public/typo3conf/ext/ep_theme/Resources/Private/Assets/fonts', to: 'fonts/[name].[ext]' },
{ from: './public/typo3conf/ext/ep_theme/Resources/Private/Assets/images', to: 'images/[name].[ext]' },
{ from: './public/typo3conf/ext/ep_theme/Resources/Private/Assets/images/icons', to: 'images/icons/[name].[ext]' },
{ from: './node_modules/leaflet/dist/images', to: 'images/[name].[ext]' },