mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-07-21 16:27:19 +00:00
Replace icons by iconify (#33918)
This commit is contained in:
parent
6bac271e5f
commit
3e273751e1
@ -14,15 +14,19 @@
|
||||
&.easiest {
|
||||
color: #04b154;
|
||||
}
|
||||
|
||||
&.easy {
|
||||
color: #02b0ff;
|
||||
}
|
||||
|
||||
&.intermediate {
|
||||
color: #eb873f;
|
||||
}
|
||||
|
||||
&.hard {
|
||||
color: #ff5454;
|
||||
}
|
||||
|
||||
&.expert {
|
||||
color: #ff02b8;
|
||||
}
|
||||
@ -77,7 +81,8 @@
|
||||
align-items: center;
|
||||
border-radius: 4px;
|
||||
background-color: #c4c4c4;
|
||||
> * {
|
||||
|
||||
>* {
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
@ -89,10 +94,12 @@
|
||||
.content {
|
||||
flex: 1;
|
||||
padding: 8px 0;
|
||||
|
||||
p {
|
||||
font-size: 0.8em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
b {
|
||||
font-size: 0.7em;
|
||||
}
|
||||
@ -103,7 +110,7 @@
|
||||
margin-top: 8px;
|
||||
gap: 8px;
|
||||
|
||||
& > * {
|
||||
&>* {
|
||||
flex-basis: min-content;
|
||||
flex-grow: 1;
|
||||
}
|
||||
@ -118,6 +125,7 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.buttons {
|
||||
margin-top: 16px;
|
||||
display: flex;
|
||||
@ -190,28 +198,36 @@
|
||||
tr:nth-child(even) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
iconify-icon {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.link-card {
|
||||
text-decoration: none !important;
|
||||
color: black !important;
|
||||
|
||||
div {
|
||||
margin: 32px 0;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
svg {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
max-width: 32px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
align-self: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.next-step {
|
||||
p {
|
||||
text-transform: uppercase;
|
||||
@ -225,6 +241,7 @@
|
||||
.material-card {
|
||||
.content-container {
|
||||
flex-direction: column;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -237,9 +254,11 @@
|
||||
height: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
|
||||
* {
|
||||
height: 100%;
|
||||
width: auto;
|
||||
|
@ -16,12 +16,12 @@ Once you have more devices, you may want to target entire groups of devices in a
|
||||
|
||||
There are a few tools to group your assets: [Areas](#areas), [floors](#floors), [labels](#labels), and [categories](#categories).
|
||||
|
||||
| Taxonomy | Automation target | Entity can have multiple |
|
||||
| -------- | ----------------- | ------------------------ |
|
||||
| Area | ✅ | ❌ |
|
||||
| Floor | ✅ | ❌ |
|
||||
| Label | ✅ | ✅ |
|
||||
| Category | ❌ | ❌ |
|
||||
| Taxonomy | Automation target | Entity can have multiple |
|
||||
| -------- | -------------------------------- | -------------------------------- |
|
||||
| Area | {% icon "openmoji:check-mark" %} | {% icon "openmoji:cross-mark" %} |
|
||||
| Floor | {% icon "openmoji:check-mark" %} | {% icon "openmoji:cross-mark" %} |
|
||||
| Label | {% icon "openmoji:check-mark" %} | {% icon "openmoji:check-mark" %} |
|
||||
| Category | {% icon "openmoji:cross-mark" %} | {% icon "openmoji:cross-mark" %} |
|
||||
|
||||
## Area
|
||||
|
||||
|
@ -289,54 +289,54 @@ toc: true
|
||||
<th>Supervised<sup>1</sup></th>
|
||||
<tr>
|
||||
<td><a href="/docs/automation" target="_blank">Automations</a></td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="/dashboards" target="_blank">Dashboards</a></td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="/integrations" target="_blank">Integrations</a></td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="/addons" target="_blank">Add-ons</a></td>
|
||||
<td>✅</td>
|
||||
<td>❌</td>
|
||||
<td>❌</td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:cross-mark" %}</td>
|
||||
<td>{% icon "openmoji:cross-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="/docs/blueprint" target="_blank">Blueprints</a></td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
One-click updates
|
||||
</td>
|
||||
<td>✅</td>
|
||||
<td>❌</td>
|
||||
<td>❌</td>
|
||||
<td>☑️<sup>2</sup></td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "openmoji:cross-mark" %}</td>
|
||||
<td>{% icon "openmoji:cross-mark" %}</td>
|
||||
<td>{% icon "noto-v1:check-mark" %}<sup>2</sup></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="/common-tasks/os/#backups" target="_blank">Backups</a></td>
|
||||
<td>✅</td>
|
||||
<td>☑️<sup>3</sup></td>
|
||||
<td>☑️<sup>3</sup></td>
|
||||
<td>✅</td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
<td>{% icon "noto-v1:check-mark" %}<sup>3</sup></td>
|
||||
<td>{% icon "noto-v1:check-mark" %}<sup>3</sup></td>
|
||||
<td>{% icon "openmoji:check-mark" %}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user