Comments (12)
Hi there!
Which bit of YAML are you looking at in particular?
I must admit that I haven't updated most of GitHub in a while.
Saying that the structure would be the same. I've been creating my cards/dashboards the lazy way via the Web UI instead of using YAML mode so some code format/structure might be a tad bit different.
from swakes_hassio.
Thanks for the reply. I’m just looking at the dashboards. Yours have the structure in the first block above. Mine have the second. I was wondering what this achieves, and also how you manage to keep things in nice, structured columns.
from swakes_hassio.
It is because you are seeing the structure of the entire dashboard.
For example in this :
cards:
- cards:
.
.
-cards:
The first cards, is of type vertical-stack, and list all the cards in the vertical stack. The second is a horizontal stack inside the vertical one, and the last should be the card itself.
The cards all have a type attribute, define in the same indentation as the array declaration. If this confuses you, take a break and read more about YAML structure and the Lovelace documentation.
from swakes_hassio.
Mine looks like this:
title: Pool
views:
- path: default_view
title: Home
badges: []
cards:
- type: custom:stack-in-card
cards:
- type: grid
title: Metrics
cards:
- type: gauge
entity: sensor.orp_no_unit
needle: true
severity:
green: 650
yellow: 750
red: 770
name: ORP
max: 800
min: 600
Just couldn’t figure out why yours has - cards:
. but no big deal!
from swakes_hassio.
Mine looks like this:
title: Pool views: - path: default_view title: Home badges: [] cards: - type: custom:stack-in-card cards: - type: grid title: Metrics cards: - type: gauge entity: sensor.orp_no_unit needle: true severity: green: 650 yellow: 750 red: 770 name: ORP max: 800 min: 600
Just couldn’t figure out why yours has
- cards:
. but no big deal!
Yeh apologies I've not included the 'entire' YAML code via 'Raw configuration editor' which would of included the
title: xxx
views:
...
These YAML snippets are just the 'vertical-card's as I build each 'column' under 1 single 'vertical-card' card on each dashboard
I've gone the lazy route and do all my building/creating via the Web UI
from swakes_hassio.
Thanks. So each column is a vertical card, maybe with horizontal cards within them. Do you just let the vertical cards “flow” across the screen however they’d like? What happens when these layouts are shown on a small iPhone screen?
from swakes_hassio.
Thanks. So each column is a vertical card, maybe with horizontal cards within them. Do you just let the vertical cards “flow” across the screen however they’d like? What happens when these layouts are shown on a small iPhone screen?
Indeed!
I use a single 'vertical-stack' to make the column (on a blank dashboard, setup via UI mode) and then use 'horizontal-stack' cards within for each row.
I've got one or two other dashboards where I have 3-4 columns which sit side by side on Desktop view and underneath each other via Mobile view.
At the moment I've focusing on redesigning my dashboards purely for mobile view so there a some formatting odities here and there when viewing via Desktop but nothing major.
from swakes_hassio.
Thank you very much for the pointers. Getting the layouts right can be challenging at times! Is there a way to have different layouts for mobile vs desktop? If not, I think that would be handy - automatically use one layout for desktop, and another for mobile.
from swakes_hassio.
I love the dashboard!! Kudos for the work. Some questions if you dont mind :
- In the header you uses input_select.light_menu_select but in the menu input_select.chr_light_menu_select, why is that ?
- Would you mind sharing the input_select for the dashboard so i can better wrap my head around the concept and what belongs to which input_select ?
- Beer on the way if i get this working !! 👍
from swakes_hassio.
Hi there,
I really really love your dashboard but I don't know where to start, can you point me into the right direction? How do I create the mobile dashboard inside HA? I will edit the files for my needs thats not a problem I just need a start
from swakes_hassio.
I love the dashboard!! Kudos for the work. Some questions if you dont mind :
* In the header you uses input_select.light_menu_select but in the menu input_select.chr_light_menu_select, why is that ? * Would you mind sharing the input_select for the dashboard so i can better wrap my head around the concept and what belongs to which input_select ? * Beer on the way if i get this working !! 👍
Hi there!
So input_select.light_menu_select and input_select.chr_light_menu_select are the same. The ".chr_" part is simply the name (codename) I intially gave the the input_select when building the dashboard.
Here is an example of the input_select:
input_select:
chr_light_menu_select:
name: 'Light Menu Select'
options:
- Overview
- Ground
- First
- Second
initial: Overview
icon: mdi:lamp
from swakes_hassio.
Hi there,
I really really love your dashboard but I don't know where to start, can you point me into the right direction? How do I create the mobile dashboard inside HA? I will edit the files for my needs thats not a problem I just need a start
Hi there!
I've simply created an new Lovelace dashboard soley to view on a mobile device which means everything is tailored for a mobile viewing when it comes to styling, formatting etc.
from swakes_hassio.
Related Issues (13)
- Home Assistant SWAKES HOT 1
- Hi, i love your theme HOT 3
- difficoulty to install HOT 4
- Problem with Sensor counters (System Dashboard)
- full_card.yaml uses 2 png files
- mobile lights dashboad very slow (on iPhone)
- Error setting up the radio selector HOT 1
- Missing Home view HOT 1
- Blog (https://blog.swakes.co.uk) is no longer available HOT 1
- Radio
- Missing secret file
- Theme used HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from swakes_hassio.