Fix videos on mobile screens

This commit is contained in:
samaradel
2021-04-15 15:42:16 +02:00
parent 74341c2afc
commit 2430ceb0a4
7 changed files with 360 additions and 359 deletions

View File

@@ -5,95 +5,97 @@ var flattenColorPalette = require('tailwindcss/lib/util/flattenColorPalette').de
module.exports = {
purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"],
theme: {
borderWidth: {
default: '1px',
'0': '0',
'2': '2px',
'3': '3px',
'4': '4px',
'6': '6px',
'8': '8px'
},
flex: {
'1': '1 1 0%',
auto: '1 1 auto',
initial: '0 1 auto',
none: 'none',
'post': '1 1 300px',
'100': '1 1 100%',
'post-large-content': '0 1 361px',
},
zIndex: {
'-10': '-10',
'0': 0,
'10': 10,
'20': 20,
'30': 30,
'40': 40,
'50': 50,
'25': 25,
'50': 50,
'75': 75,
'100': 100,
'1000': 1000,
'auto': 'auto',
},
corePlugins: {
container: false
},
extend: {},
radialGradients: {
shapes: { // defaults to this value
'default': 'ellipse',
},
sizes: { // defaults to this value
'default': '',
},
positions: { // defaults to these values
'default': 'center',
't': 'top'
},
colors: { // defaults to {}
'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)']
},
},
},
variants: {},
plugins: [
function({
addComponents
}) {
addComponents({
'.container': {
maxWidth: '100%',
'@screen sm': {
maxWidth: '640px',
},
'@screen md': {
maxWidth: '768px',
},
'@screen lg': {
maxWidth: '1024px',
},
'@screen xl': {
maxWidth: '1040px',
},
}
})
},
function({
addUtilities,
e,
theme,
variants
}) {
const colors = flattenColorPalette(theme('borderColor'))
purge: ["./src/**/*.html", "./src/**/*.vue", "./src/**/*.jsx"],
theme: {
borderWidth: {
default: '1px',
'0': '0',
'2': '2px',
'3': '3px',
'4': '4px',
'6': '6px',
'8': '8px'
},
flex: {
'1': '1 1 0%',
auto: '1 1 auto',
initial: '0 1 auto',
none: 'none',
'post': '1 1 300px',
'100': '1 1 100%',
'post-large-content': '0 1 361px',
},
zIndex: {
'-10': '-10',
'0': 0,
'10': 10,
'20': 20,
'30': 30,
'40': 40,
'50': 50,
'25': 25,
'50': 50,
'75': 75,
'100': 100,
'1000': 1000,
'auto': 'auto',
},
corePlugins: {
container: false
},
extend: {},
radialGradients: {
shapes: { // defaults to this value
'default': 'ellipse',
},
sizes: { // defaults to this value
'default': '',
},
positions: { // defaults to these values
'default': 'center',
't': 'top'
},
colors: { // defaults to {}
'gray-to-black': ['rgba(25, 25, 25, 1)', 'rgba(8, 8, 8, 1)', 'rgba(0, 0, 0, 1)']
},
},
},
variants: {},
plugins: [
require('@tailwindcss/aspect-ratio'),
const utilities = _.flatMap(_.omit(colors, 'default'), (value, modifier) => ({
function ({
addComponents
}) {
addComponents({
'.container': {
maxWidth: '100%',
'@screen sm': {
maxWidth: '640px',
},
'@screen md': {
maxWidth: '768px',
},
'@screen lg': {
maxWidth: '1024px',
},
'@screen xl': {
maxWidth: '1040px',
},
}
})
},
function ({
addUtilities,
e,
theme,
variants
}) {
const colors = flattenColorPalette(theme('borderColor'))
[`.${e(`border-t-${modifier}`)}`]: {
const utilities = _.flatMap(_.omit(colors, 'default'), (value, modifier) => ({
[`.${e(`border-t-${modifier}`)}`]: {
borderTopColor: `${value}`
},
[`.${e(`border-r-${modifier}`)}`]: {