首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >顺风某些自定义颜色在laravel 8欢迎页面中不生效

顺风某些自定义颜色在laravel 8欢迎页面中不生效
EN

Stack Overflow用户
提问于 2021-03-19 00:23:45
回答 1查看 974关注 0票数 1

我正在尝试向tailwind.config.js添加自定义颜色,并将其用作背景颜色或文本颜色,但未生效。奇怪的是,我之前在顺风配置中添加了其他自定义颜色,这些颜色工作得很好,只有我尝试添加的任何新颜色都不起作用。这是我的tailwind.config.js

代码语言:javascript
代码运行次数:0
运行
复制
const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {

theme: {
   extend: {
        colors:{
            salmon: {
                th1: '#B03060',    
            },
            tuna: {
                th1: '#393B3E',    
            },
            wildblueyonder: {
                th1: '#768DAE',
            },
            xanadu: {
                th1: '#798578',
            },
            napa: {
                th1: '#AC9F8F',
            },    
            cararra: {
                th1: '#F6F7F4',    
            },
            kimberly: {
                th2: '#7A81A8',
            },
            shakespeare: {
                th2: '#53A7CE',
            },
            jordyblue: {
                th2: '#8CCBF3',
            },
            softpeach: {
                th2: '#FAF7F6',
            },
            softr: {
                th2: '#FAF7F6',    
            },
        },
        fontFamily: {
            sans: ['Nunito', ...defaultTheme.fontFamily.sans],
        },
    },
},
variants: {
    extend: {
        opacity: ['disabled'],
    },
},

plugins: [require('@tailwindcss/forms')],
};

这是我的视图刀片文件代码,其中我在登录的href标签中使用了文本的颜色( text -salmon-th1)。

代码语言:javascript
代码运行次数:0
运行
复制
 <div class="flex lg:justify-center">
                <label class="bg-tuna-th1">test</label>
                <a href="{{ route('login') }}"
                    class="inline-flex px-6 py-2 text-2xl font-semibold text-salmon-th1 transition duration-500 ease-in-out transform rounded-lg hover:bg-red-700 hover:to-red focus:shadow-outline focus:outline-none focus:ring-2 ring-offset-current ring-offset-2">@lang("Login")</a>
                <a href="{{ route('register') }}"
                    class="inline-flex items-center text-2xl px-6 py-2 ml-4 font-semibold text-white transition duration-500 ease-in-out transform bg-red-800 rounded-lg shadow-xl hover:to-red hover:bg-red-700 hover:text-white focus:shadow-outline focus:outline-none focus:ring-2 ring-offset-current ring-offset-2">@lang("Register")</a>
            </div>

我已经尝试清除浏览器的缓存,清除laravel视图缓存。每次我更改顺风配置文件中的内容时,我都会尝试"npm run watch“或"npm run dev”。我知道tailwindcss是包含在页面中的,因为其他颜色的金枪鱼,wildblueyonder e.t.c只适用于我添加的新颜色,包括“鲑鱼”不起作用。

我已经找不到原因了..我们将非常感谢.Any的帮助。

EN

回答 1

Stack Overflow用户

发布于 2021-03-19 22:42:18

好吧,我觉得自己很愚蠢,但我知道为什么它不工作了。这是因为公用文件夹比当前框架文件夹高出一级。当我运行"npm run dev“时,它创建了一个公共文件夹,将app.css文件放在错误的文件夹中。

要解决此问题,我必须更改webpack.mix.js中的代码并添加以下行。

我的道路

代码语言:javascript
代码运行次数:0
运行
复制
/public_folder_name/
/framework_folder_name/

已将此行添加到webpack.mix.js文件

代码语言:javascript
代码运行次数:0
运行
复制
 mix.setPublicPath('../public_folder_name/');
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/66695072

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档