WIP Migrate to stimulus.js and tailwind

This commit is contained in:
Björn Fromme
2021-08-17 19:31:42 +02:00
parent 39f1c72972
commit 0d01f4212b
17 changed files with 1023 additions and 617 deletions
+39 -41
View File
@@ -3,8 +3,6 @@ const tinycolor = require('tinycolor2')
module.exports = {
purge: {
mode: 'layers',
layers: ['components', 'utilities'],
content: [
'./public/typo3conf/ext/ep_theme/Configuration/TypoScript/**/*.typoscript',
'./public/typo3conf/ext/ep_theme/Resources/Private/Layouts/**/*.html',
@@ -34,27 +32,27 @@ module.exports = {
},
extend: {
colors: {
'overlay': {
'black': tinycolor('#000000').setAlpha(0.85).toRgbString(),
'white': tinycolor('#ffffff').setAlpha(0.85).toRgbString(),
overlay: {
black: tinycolor('#000000').setAlpha(0.85).toRgbString(),
white: tinycolor('#ffffff').setAlpha(0.85).toRgbString(),
},
'concept': {
'default': '#005ca9',
'bdg': '#005ca9',
'skr': '#005ca9',
'evt': '#ed5454',
'fam': '#7ca7d5',
'grp': '#ffa300',
'prg': '#005ca9',
'ind': '#009fe3',
'wkd': '#44d04e',
'spz': '#436a8a',
'epe': '#436a8a',
'sfl': '#999',
concept: {
default: '#005ca9',
bdg: '#005ca9',
skr: '#005ca9',
evt: '#ed5454',
fam: '#7ca7d5',
grp: '#ffa300',
prg: '#005ca9',
ind: '#009fe3',
wkd: '#44d04e',
spz: '#436a8a',
epe: '#436a8a',
sfl: '#999',
},
'ep': {
'primary': '#3d8ccb',
'secondary': '#f9c700',
ep: {
primary: '#3d8ccb',
secondary: '#f9c700',
'primary-light': '#009fff',
'primary-medium': '#165883',
'primary-dark': '#18527B',
@@ -64,25 +62,25 @@ module.exports = {
'secondary-10': tinycolor('#f0bc44').setAlpha(0.1).toRgbString(),
'secondary-80': tinycolor('#f0bc44').setAlpha(0.8).toRgbString(),
},
'sbw': {
'primary': '#f0bc44',
'secondary': '#ee525a',
sbw: {
primary: '#f0bc44',
secondary: '#ee525a',
'primary-dark': '#c7a20c',
'primary-10': tinycolor('#f0bc44').setAlpha(0.1).toRgbString(),
'primary-50': tinycolor('#f0bc44').setAlpha(0.5).toRgbString(),
'primary-80': tinycolor('#f0bc44').setAlpha(0.8).toRgbString(),
'overlay-secondary': tinycolor('#c20000').setAlpha(0.55).toRgbString(),
},
'snz': {
'primary': '#82C3C6',
'secondary': '#f9c33d',
snz: {
primary: '#82C3C6',
secondary: '#f9c33d',
'primary-10': tinycolor('#82C3C6').setAlpha(0.1).toRgbString(),
'primary-50': tinycolor('#82C3C6').setAlpha(0.5).toRgbString(),
'primary-80': tinycolor('#82C3C6').setAlpha(0.8).toRgbString(),
},
'uch': {
'primary': '#b5e400',
'secondary': '#19a3dc',
uch: {
primary: '#b5e400',
secondary: '#19a3dc',
'primary-dark': '#b5e400',
'primary-10': tinycolor('#b5e400').setAlpha(0.1).toRgbString(),
'primary-50': tinycolor('#b5e400').setAlpha(0.5).toRgbString(),
@@ -110,23 +108,23 @@ module.exports = {
textColor: [ 'sbw', 'sbw-hover', 'snz', 'snz-hover', 'uch', 'uch-hover' ],
borderColor: [ 'sbw','snz', 'uch' ],
display: ['group-hover', 'sticky'],
visibility: ['group-hover'],
opacity: ['group-hover'],
rotate: ['group-hover'],
flex: ['sticky'],
flexDirection: ['even', 'odd', 'sticky'],
alignItems: ['sticky'],
padding: ['even', 'odd', 'first', 'last', 'sticky'],
margin: ['even', 'odd', 'first', 'last', 'sticky'],
maxWidth: ['sticky'],
visibility: [ 'group-hover' ],
opacity: [ 'group-hover' ],
rotate: [ 'group-hover' ],
flex: [ 'sticky' ],
flexDirection: [ 'even', 'odd', 'sticky' ],
alignItems: [ 'sticky' ],
padding: [ 'even', 'odd', 'first', 'last', 'sticky' ],
margin: [ 'even', 'odd', 'first', 'last', 'sticky' ],
maxWidth: [ 'sticky' ],
},
},
plugins: [
require('@tailwindcss/aspect-ratio'),
require('@tailwindcss/forms'),
require('tailwindcss-alt')({
variants: ['sbw', 'snz', 'uch'],
}),
require('@tailwindcss/aspect-ratio'),
require('@tailwindcss/forms'),
plugin(function ({addVariant, e}) {
addVariant('first-type', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {