style presets.js file
This commit is contained in:
parent
c9e244712b
commit
2e5f562c4f
98
presets.js
vendored
98
presets.js
vendored
@ -1,6 +1,7 @@
|
|||||||
const defaultTheme = require('tailwindcss/defaultTheme')
|
const defaultTheme = require('tailwindcss/defaultTheme')
|
||||||
|
|
||||||
const fontFamily = defaultTheme.fontFamily;
|
const fontFamily = defaultTheme.fontFamily;
|
||||||
|
|
||||||
fontFamily['sans'] = [
|
fontFamily['sans'] = [
|
||||||
'Quicksand', // <-- Quicksand is default sans font now
|
'Quicksand', // <-- Quicksand is default sans font now
|
||||||
'system-ui',
|
'system-ui',
|
||||||
@ -8,6 +9,7 @@ fontFamily['sans'] = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
|
|
||||||
content: [
|
content: [
|
||||||
'./resources/views/**/*.blade.php',
|
'./resources/views/**/*.blade.php',
|
||||||
'./resources/assets/js/**/*.vue',
|
'./resources/assets/js/**/*.vue',
|
||||||
@ -19,43 +21,54 @@ module.exports = {
|
|||||||
{
|
{
|
||||||
pattern: /^[^/&]*$/,
|
pattern: /^[^/&]*$/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^p-/,
|
pattern: /^p-/,
|
||||||
variants: ['ltr', 'rtl'],
|
variants: ['ltr', 'rtl'],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^m-/,
|
pattern: /^m-/,
|
||||||
variants: ['ltr', 'rtl'],
|
variants: ['ltr', 'rtl'],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^left-/,
|
pattern: /^left-/,
|
||||||
variants: ['ltr', 'rtl'],
|
variants: ['ltr', 'rtl'],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^right-/,
|
pattern: /^right-/,
|
||||||
variants: ['ltr', 'rtl'],
|
variants: ['ltr', 'rtl'],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^w/,
|
pattern: /^w/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^h/,
|
pattern: /^h/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^inset/,
|
pattern: /^inset/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^top/,
|
pattern: /^top/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^bottom/,
|
pattern: /^bottom/,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
pattern: /^translate/,
|
pattern: /^translate/,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
||||||
darkMode: 'class', // or 'media' or 'class',
|
darkMode: 'class', // or 'media' or 'class',
|
||||||
|
|
||||||
theme: {
|
theme: {
|
||||||
fontFamily: fontFamily,
|
fontFamily: fontFamily,
|
||||||
|
|
||||||
@ -84,6 +97,7 @@ module.exports = {
|
|||||||
'800': '#426131',
|
'800': '#426131',
|
||||||
'900': '#364f28'
|
'900': '#364f28'
|
||||||
},
|
},
|
||||||
|
|
||||||
'purple': {
|
'purple': {
|
||||||
DEFAULT: '#55588b',
|
DEFAULT: '#55588b',
|
||||||
'50': '#f7f7f9',
|
'50': '#f7f7f9',
|
||||||
@ -97,6 +111,7 @@ module.exports = {
|
|||||||
'800': '#333553',
|
'800': '#333553',
|
||||||
'900': '#2a2b44'
|
'900': '#2a2b44'
|
||||||
},
|
},
|
||||||
|
|
||||||
'red': {
|
'red': {
|
||||||
DEFAULT: '#cc0000',
|
DEFAULT: '#cc0000',
|
||||||
'50': '#fcf2f2',
|
'50': '#fcf2f2',
|
||||||
@ -110,6 +125,7 @@ module.exports = {
|
|||||||
'800': '#7a0000',
|
'800': '#7a0000',
|
||||||
'900': '#640000'
|
'900': '#640000'
|
||||||
},
|
},
|
||||||
|
|
||||||
'orange': {
|
'orange': {
|
||||||
DEFAULT: '#f59e0b',
|
DEFAULT: '#f59e0b',
|
||||||
'50': '#fffaf3',
|
'50': '#fffaf3',
|
||||||
@ -123,6 +139,7 @@ module.exports = {
|
|||||||
'800': '#935f07',
|
'800': '#935f07',
|
||||||
'900': '#784d05'
|
'900': '#784d05'
|
||||||
},
|
},
|
||||||
|
|
||||||
'blue': {
|
'blue': {
|
||||||
DEFAULT: '#006ea6',
|
DEFAULT: '#006ea6',
|
||||||
'50': '#f2f8fb',
|
'50': '#f2f8fb',
|
||||||
@ -136,6 +153,7 @@ module.exports = {
|
|||||||
'800': '#004264',
|
'800': '#004264',
|
||||||
'900': '#003651'
|
'900': '#003651'
|
||||||
},
|
},
|
||||||
|
|
||||||
'black': {
|
'black': {
|
||||||
DEFAULT: '#424242',
|
DEFAULT: '#424242',
|
||||||
'50': '#f6f6f6',
|
'50': '#f6f6f6',
|
||||||
@ -149,16 +167,19 @@ module.exports = {
|
|||||||
'800': '#282828',
|
'800': '#282828',
|
||||||
'900': '#202020'
|
'900': '#202020'
|
||||||
},
|
},
|
||||||
|
|
||||||
'lilac': {
|
'lilac': {
|
||||||
DEFAULT: '#F8F9FE',
|
DEFAULT: '#F8F9FE',
|
||||||
'100': '#F5F7FA',
|
'100': '#F5F7FA',
|
||||||
'300': '#EDF0FC',
|
'300': '#EDF0FC',
|
||||||
'900': '#DCE2F9'
|
'900': '#DCE2F9'
|
||||||
},
|
},
|
||||||
|
|
||||||
'golden': {
|
'golden': {
|
||||||
DEFAULT: '#D1C989',
|
DEFAULT: '#D1C989',
|
||||||
'900': '#BFB882',
|
'900': '#BFB882',
|
||||||
},
|
},
|
||||||
|
|
||||||
'rose': {
|
'rose': {
|
||||||
DEFAULT: '#f43f5e',
|
DEFAULT: '#f43f5e',
|
||||||
'50' : '#fff1f2',
|
'50' : '#fff1f2',
|
||||||
@ -172,6 +193,7 @@ module.exports = {
|
|||||||
'800': '#9f1239',
|
'800': '#9f1239',
|
||||||
'900': '#881337'
|
'900': '#881337'
|
||||||
},
|
},
|
||||||
|
|
||||||
'silver': {
|
'silver': {
|
||||||
DEFAULT: '#7F8997',
|
DEFAULT: '#7F8997',
|
||||||
'50': '#F0F1F3',
|
'50': '#F0F1F3',
|
||||||
@ -185,6 +207,7 @@ module.exports = {
|
|||||||
'800': '#3A4555',
|
'800': '#3A4555',
|
||||||
'900': '#323B49'
|
'900': '#323B49'
|
||||||
},
|
},
|
||||||
|
|
||||||
'pastel_green': {
|
'pastel_green': {
|
||||||
DEFAULT: '#E0F1E3',
|
DEFAULT: '#E0F1E3',
|
||||||
'50': '#E0F1E3',
|
'50': '#E0F1E3',
|
||||||
@ -198,6 +221,7 @@ module.exports = {
|
|||||||
'800': '#56765F',
|
'800': '#56765F',
|
||||||
'900': '#4D6A55'
|
'900': '#4D6A55'
|
||||||
},
|
},
|
||||||
|
|
||||||
'peach_orange': {
|
'peach_orange': {
|
||||||
DEFAULT: '#FCF2D9',
|
DEFAULT: '#FCF2D9',
|
||||||
'50': '#FCF2D9',
|
'50': '#FCF2D9',
|
||||||
@ -211,6 +235,7 @@ module.exports = {
|
|||||||
'800': '#9C7430',
|
'800': '#9C7430',
|
||||||
'900': '#8C692B'
|
'900': '#8C692B'
|
||||||
},
|
},
|
||||||
|
|
||||||
'wisteria': {
|
'wisteria': {
|
||||||
DEFAULT: '#E5E4FA',
|
DEFAULT: '#E5E4FA',
|
||||||
'50': '#E5E4FA',
|
'50': '#E5E4FA',
|
||||||
@ -224,6 +249,7 @@ module.exports = {
|
|||||||
'800': '#565577',
|
'800': '#565577',
|
||||||
'900': '#4D4C6B'
|
'900': '#4D4C6B'
|
||||||
},
|
},
|
||||||
|
|
||||||
'status': {
|
'status': {
|
||||||
'success': '#F1F6EE',
|
'success': '#F1F6EE',
|
||||||
'danger': '#fae6e6',
|
'danger': '#fae6e6',
|
||||||
@ -234,6 +260,7 @@ module.exports = {
|
|||||||
'canceled': '#282828',
|
'canceled': '#282828',
|
||||||
'warning': '#FEF5E7'
|
'warning': '#FEF5E7'
|
||||||
},
|
},
|
||||||
|
|
||||||
'text-status': {
|
'text-status': {
|
||||||
'success': '#63914A',
|
'success': '#63914A',
|
||||||
'danger': '#B80000',
|
'danger': '#B80000',
|
||||||
@ -244,16 +271,25 @@ module.exports = {
|
|||||||
'canceled': '#ffffff',
|
'canceled': '#ffffff',
|
||||||
'warning': '#b87708'
|
'warning': '#b87708'
|
||||||
},
|
},
|
||||||
|
|
||||||
'body': {
|
'body': {
|
||||||
DEFAULT: '#fcfcfc'
|
DEFAULT: '#fcfcfc'
|
||||||
},
|
},
|
||||||
|
|
||||||
'light-gray': '#C7C9D9',
|
'light-gray': '#C7C9D9',
|
||||||
|
|
||||||
'dark-blue': '#15284B',
|
'dark-blue': '#15284B',
|
||||||
|
|
||||||
'lighter-gray': '#F2F2F5',
|
'lighter-gray': '#F2F2F5',
|
||||||
|
|
||||||
'purple-lighter': '#F2F4FC',
|
'purple-lighter': '#F2F4FC',
|
||||||
|
|
||||||
'modal-background': 'rgba(0, 0, 0, 0.3)',
|
'modal-background': 'rgba(0, 0, 0, 0.3)',
|
||||||
|
|
||||||
'black-medium': '#424242',
|
'black-medium': '#424242',
|
||||||
|
|
||||||
'red-light': '#FF6B6B',
|
'red-light': '#FF6B6B',
|
||||||
|
|
||||||
'default': '#6ea152',
|
'default': '#6ea152',
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -282,32 +318,39 @@ module.exports = {
|
|||||||
'5%, 15%, 25%, 35%, 45%': { transform: 'translate3d(-0.5px, 0, 0)' },
|
'5%, 15%, 25%, 35%, 45%': { transform: 'translate3d(-0.5px, 0, 0)' },
|
||||||
'100%': { transform: 'translate3d(0.5px, 0, 0)' },
|
'100%': { transform: 'translate3d(0.5px, 0, 0)' },
|
||||||
},
|
},
|
||||||
|
|
||||||
pulsate_transparent: {
|
pulsate_transparent: {
|
||||||
'0%': { transform: 'scale(0.9, 0.9)' },
|
'0%': { transform: 'scale(0.9, 0.9)' },
|
||||||
'50%': { transform: 'scale(1.14, 1.14)' },
|
'50%': { transform: 'scale(1.14, 1.14)' },
|
||||||
'100%': { transform: 'scale(0.9, 0.9)' },
|
'100%': { transform: 'scale(0.9, 0.9)' },
|
||||||
},
|
},
|
||||||
|
|
||||||
pulsate: {
|
pulsate: {
|
||||||
'0%': { transform: 'transform: scale(1, 1)', opacity: '0.05' },
|
'0%': { transform: 'transform: scale(1, 1)', opacity: '0.05' },
|
||||||
'50%': { opacity: '0.25' },
|
'50%': { opacity: '0.25' },
|
||||||
'100%': { transform: 'scale(1.5, 1.5)', opacity: '0' },
|
'100%': { transform: 'scale(1.5, 1.5)', opacity: '0' },
|
||||||
},
|
},
|
||||||
|
|
||||||
spin: {
|
spin: {
|
||||||
'0%': { transform: 'rotate(0deg)' },
|
'0%': { transform: 'rotate(0deg)' },
|
||||||
'100%': { transform: 'rotate(360deg)' },
|
'100%': { transform: 'rotate(360deg)' },
|
||||||
},
|
},
|
||||||
|
|
||||||
submit: {
|
submit: {
|
||||||
'0%': { boxShadow: '0 28px 0 -28px #ffffff' },
|
'0%': { boxShadow: '0 28px 0 -28px #ffffff' },
|
||||||
'100%': { boxShadow: '0 28px 0 #ffffff' },
|
'100%': { boxShadow: '0 28px 0 #ffffff' },
|
||||||
},
|
},
|
||||||
|
|
||||||
submit_second: {
|
submit_second: {
|
||||||
'0%': { boxShadow: '0 28px 0 -28px #55588b' },
|
'0%': { boxShadow: '0 28px 0 -28px #55588b' },
|
||||||
'100%': { boxShadow: '0 28px 0 #55588b' },
|
'100%': { boxShadow: '0 28px 0 #55588b' },
|
||||||
},
|
},
|
||||||
|
|
||||||
marquee: {
|
marquee: {
|
||||||
'0%': { transform: 'translateX(0%)' },
|
'0%': { transform: 'translateX(0%)' },
|
||||||
'100%': { transform: 'translateX(-100%)' },
|
'100%': { transform: 'translateX(-100%)' },
|
||||||
},
|
},
|
||||||
|
|
||||||
marquee_long: {
|
marquee_long: {
|
||||||
'0%': { transform: 'translateX(0%)' },
|
'0%': { transform: 'translateX(0%)' },
|
||||||
'100%': { transform: 'translateX(-350%)' },
|
'100%': { transform: 'translateX(-350%)' },
|
||||||
@ -347,20 +390,53 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
appearance: ['hover', 'focus'],
|
appearance: ['hover', 'focus'],
|
||||||
|
|
||||||
container: {
|
container: {
|
||||||
center: true,
|
center: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
variants: {
|
variants: {
|
||||||
transitionProperty: ['responsive', 'motion-safe', 'motion-reduce'],
|
transitionProperty: [
|
||||||
float: ['responsive', 'direction'],
|
'responsive',
|
||||||
margin: ['responsive', 'direction'],
|
'motion-safe',
|
||||||
padding: ['responsive', 'direction'],
|
'motion-reduce'
|
||||||
inset: ['responsive', 'direction'],
|
],
|
||||||
textAlign: ['responsive', 'direction'],
|
|
||||||
space: ['responsive', 'direction'],
|
float: [
|
||||||
rotate: ['responsive', 'direction'],
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
margin: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
padding: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
inset: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
textAlign: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
space: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
|
rotate: [
|
||||||
|
'responsive',
|
||||||
|
'direction'
|
||||||
|
],
|
||||||
|
|
||||||
extend: {
|
extend: {
|
||||||
display: ['group-hover'],
|
display: ['group-hover'],
|
||||||
@ -377,22 +453,28 @@ module.exports = {
|
|||||||
require('@tailwindcss/forms'),
|
require('@tailwindcss/forms'),
|
||||||
require('@themesberg/flowbite/plugin'),
|
require('@themesberg/flowbite/plugin'),
|
||||||
require('tailwindcss-dir')(),
|
require('tailwindcss-dir')(),
|
||||||
|
|
||||||
function ({ addComponents }) {
|
function ({ addComponents }) {
|
||||||
addComponents({
|
addComponents({
|
||||||
'.container': {
|
'.container': {
|
||||||
maxWidth: '100%',
|
maxWidth: '100%',
|
||||||
|
|
||||||
'@screen sm': {
|
'@screen sm': {
|
||||||
maxWidth: '100%',
|
maxWidth: '100%',
|
||||||
},
|
},
|
||||||
|
|
||||||
'@screen md': {
|
'@screen md': {
|
||||||
maxWidth: '100%',
|
maxWidth: '100%',
|
||||||
},
|
},
|
||||||
|
|
||||||
'@screen lg': {
|
'@screen lg': {
|
||||||
maxWidth: '1000px',
|
maxWidth: '1000px',
|
||||||
},
|
},
|
||||||
|
|
||||||
'@screen xl': {
|
'@screen xl': {
|
||||||
maxWidth: '895px',
|
maxWidth: '895px',
|
||||||
},
|
},
|
||||||
|
|
||||||
'@screen 2xl': {
|
'@screen 2xl': {
|
||||||
maxWidth: '1145px',
|
maxWidth: '1145px',
|
||||||
},
|
},
|
||||||
|
Loading…
x
Reference in New Issue
Block a user