用户登录

在这个文章编辑界面上有个 dropbutton ,这种元素除了一个主要的动作以外,我们还可以点一下旁边的下拉按钮,这样会看到更多的可以执行的动作 ..

类似的还有这个文章列表页面上的这个按钮 ... 现在这个按钮的样式是默认的 seven 主题提供的 .. 我们可以单独去创建这个 dropbutton 元素的模板,添加自己需要的样式 ..

这里我直接去添加一些自己的样式 .. 这些样式我借鉴了 semanitc ui 的 button 元素的样式 ..

打开的我的自定义模块 ... semanitc .. src .. site .. elements .. button.overrides .. 把我准备的样式放到这个文件里面 ..

项目的 gulp 任务会自动编译需要的 button.css 这个样式表 ..

然后打开自定义模块的 module 文件 .. 找到 element_info ... 在这里先看看有没有 dropbutton 元素,有的话,就给它附加一个资源库,名字是 ui.button ... 在这个资源库里,有 dropbutton 需要的那些样式 ..

再找到我的自定义主题 ... 在这个 info 文件的libraries-override 里面,禁用一下 seven 主题的 dropbutton.component.css ..

重建一下缓存 ..

再去预览一下 ...

现在这个 dropbutton 就会使用我为它准备的样式了 ..

回到命令行 ... 新建一个标签 ... 然后进入到我的自定义模块的目录下面 ...

查看一下状态 ... 会提示有一些修改的文件 ..

再去提交一下这些修改 ...

然后把修改 push 到我的远程仓库里 .

再找到我的远程仓库 ... ninghao_ui ..

找到这个新 push 上来的 commit ... 在这里会显示这个 commit 相关的文件 ..

找到 button.overrides ... 你可以查看一下这个文件里的内容 ..

如果你需要我给 dropbutton 添加的样式 ... 可以在这个文件里找到 ..

0:00
0:00
0:00
1:30
0:00
0:00
1:14
0:00
0:00

下拉按钮:dropbutton《 Drupal:自定义界面 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点