土豆发的那个themes简单实现了一下

fineemb · 发表于 2019-7-21 14:01:48

本帖最后由 fineemb 于 2019-7-21 14:35 编辑

先上效果图

土豆的原帖
https://bbs.hassbian.com/thread-7668-1-1.html
东西是这位大神的,是个UI高手
https://github.com/isabellaalstrom
她这个是写了个卡片的插件, 实现起来应该要更轻松点(我还不会弄插件), 我这个纯手工CSS调整.
themes部分很简单, 直接拿来用

游客，如果您要查看本帖隐藏内容请回复

另外附上可以直接在themes定义的内容, 非官方文档(感觉这个比较坑, 官方为什么不出一个)
https://github.com/chipriley/lov ... r/known_css_refs.md

这个的难点就是要卡片做到对齐, 阴影部分需要调整卡片的间距.
这里用到这个插件
https://github.com/thomasloven/lovelace-card-mod
这个可以定义每个卡片的CSS
下面是我的配置, 注意并不能直接拿来用, 只是给出一个思路和方法

游客，如果您要查看本帖隐藏内容请回复

jozhi · 发表于 2019-7-21 15:04:46

本帖最后由 jozhi 于 2019-7-21 15:08 编辑

感謝分享來學習一下了
可否教一下右下角選擇音箱怎麼作呢?

fineemb · 发表于 2019-7-21 15:13:50

jozhi 发表于 2019-7-21 15:04
感謝分享來學習一下了
可否教一下右下角選擇音箱怎麼作呢?

小爱TTS

star_liu · 发表于 2019-7-21 15:32:20

学习学习

oosee · 发表于 2019-7-21 16:25:01

kankan..........

natic · 发表于 2019-7-21 17:39:32

感谢lz分享

nice2943 · 发表于 2019-7-21 18:44:06

感謝樓主分享

kleinsoul · 发表于 2019-7-21 18:53:52

效果怎么样？

holy745 · 发表于 2019-7-21 19:46:20

这个台号了，谢谢分享

咸味土豆 · 发表于 2019-7-21 19:57:14

本帖最后由咸味土豆于 2019-7-21 19:58 编辑

帅气，谢谢分享。
新的card-mod还没时间看，好像很强大。

		自动登录	找回密码
密码			立即注册

[基础教程] 土豆发的那个themes简单实现了一下

评分

教程狂人

活跃会员