diff --git a/packages/base/Resources/Private/Extensions/News/Partials/List/Item.html b/packages/base/Resources/Private/Extensions/News/Partials/List/Item.html index b8df56a..091f3aa 100644 --- a/packages/base/Resources/Private/Extensions/News/Partials/List/Item.html +++ b/packages/base/Resources/Private/Extensions/News/Partials/List/Item.html @@ -1,5 +1,5 @@
- + diff --git a/packages/base/Resources/Private/Extensions/News/Templates/News/List.html b/packages/base/Resources/Private/Extensions/News/Templates/News/List.html index cf09fbc..50b86b3 100644 --- a/packages/base/Resources/Private/Extensions/News/Templates/News/List.html +++ b/packages/base/Resources/Private/Extensions/News/Templates/News/List.html @@ -1,6 +1,6 @@ + xmlns:n="http://typo3.org/ns/GeorgRinger/News/ViewHelpers" + data-namespace-typo3-fluid="true"> - Alle Artikel - + Alle Artikel
@@ -55,13 +52,7 @@ - - - - - Alle Artikel - - +
diff --git a/packages/base/Resources/Public/Icons/angle-left.svg b/packages/base/Resources/Public/Icons/angle-left.svg deleted file mode 100644 index 4e24f33..0000000 --- a/packages/base/Resources/Public/Icons/angle-left.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/angle-right.svg b/packages/base/Resources/Public/Icons/angle-right.svg deleted file mode 100644 index b0b8cbb..0000000 --- a/packages/base/Resources/Public/Icons/angle-right.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/skip-back.svg b/packages/base/Resources/Public/Icons/skip-back.svg deleted file mode 100644 index 30a1631..0000000 --- a/packages/base/Resources/Public/Icons/skip-back.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Icons/skip-forward.svg b/packages/base/Resources/Public/Icons/skip-forward.svg deleted file mode 100644 index f2b4ac2..0000000 --- a/packages/base/Resources/Public/Icons/skip-forward.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/packages/base/Resources/Public/Scss/abstracts/_icons.scss b/packages/base/Resources/Public/Scss/abstracts/_icons.scss index 0b14134..b5d12ce 100644 --- a/packages/base/Resources/Public/Scss/abstracts/_icons.scss +++ b/packages/base/Resources/Public/Scss/abstracts/_icons.scss @@ -1,41 +1,26 @@ -.ci, -a[href*="instagram.com"], -a[href*="tiktok.com"], -a[href*="linkedin.com"], -a[href*="twitter.com"], -a[href*="x.com"] { - display: inline-block; - vertical-align: middle; - line-height: 1; +.ci { position: relative; } -.ci::before, -a[href*="instagram.com*"]::before, -a[href*="tiktok.com"]::before, -a[href*="linkedin.com"]::before, -a[href*="x.com"]::before { +.ci::before { + position: relative; + top: 3px; display: inline-block; content: ' '; width: 1em; height: 1em; - mask-size: contain; + mask-size: 1em; mask-repeat: no-repeat; - mask-position: center; background-color: currentColor; - vertical-align: middle; + mask-position: center; } .ci-instagram::before { mask-image: url(../Icons/instagram.svg); } - .ci-tiktok::before { mask-image: url(../Icons/tiktok.svg); - width: 0.9em; - height: 0.9em; } - .ci-linkedin::before { mask-image: url(../Icons/linkedin.svg); } @@ -49,13 +34,25 @@ a[href*="x.com"]::before { mask-image: url(../Icons/phone.svg); } + +a[href*="instagram.com"], a[href*="tiktok.com"], a[href*="linkedin.com"], a[href*="twitter.com"], a[href*="x.com"] { + position: relative; + top: 3px; + display: inline-block; + content: ' '; + width: 1em; + height: 1em; + mask-size: 1em; + mask-repeat: no-repeat; + background-color: currentColor; + mask-position: center; +} + a[href*="instagram.com*"]::before { mask-image: url(../Icons/instagram.svg); } a[href*="tiktok.com"]::before { mask-image: url(../Icons/tiktok.svg); - width: 0.9em; - height: 0.9em; } a[href*="linkedin.com"]::before { mask-image: url(../Icons/linkedin.svg); @@ -63,19 +60,3 @@ a[href*="linkedin.com"]::before { a[href*="x.com"]::before { mask-image: url(../Icons/x.svg); } - -.ci-angle-right::before { - mask-image: url(../Icons/angle-right.svg); -} - -.ci-angle-left::before { - mask-image: url(../Icons/angle-left.svg); -} - -.ci-skip-forward::before { - mask-image: url(../Icons/skip-forward.svg); -} - -.ci-skip-back::before { - mask-image: url(../Icons/skip-back.svg); -} diff --git a/packages/base/Resources/Public/Scss/components/_news.scss b/packages/base/Resources/Public/Scss/components/_news.scss index f12a085..fecccf1 100644 --- a/packages/base/Resources/Public/Scss/components/_news.scss +++ b/packages/base/Resources/Public/Scss/components/_news.scss @@ -9,6 +9,12 @@ max-width: 100%; } + // @media (min-width: $breakpoint-md) { + // .news-list-item { + // grid-column: span 2; + // } + // } + @media (min-width: $breakpoint-lg) { .news-list-item { grid-column: span 2; @@ -69,6 +75,10 @@ } } } + + .previous a, .next a, .first a, .last a { + // these are also styled as circles + } } } @@ -118,26 +128,3 @@ } } } - -.header { - display: flex; - align-items: center; - justify-content: space-between; -} - -/* Show header button only on desktop */ -.header-btn { - display: none; - @media (min-width: $breakpoint-lg) { - display: inline-block; - } -} - -/* Show mobile button only below desktop breakpoint */ -.mobile-btn { - display: block; - margin-top: 1rem; - @media (min-width: $breakpoint-lg) { - display: none; - } -}