D3vugu-components/components/input/button.vugu
David Vogel 6fbc00655f Rework colors and theming
- Add example colors page
- Store all theme colors in CSS variables
- Add layer container component
- Use accent color for active pagination page
- Automatically use layer-1 color in sidebar, sidebar menu and code containers
- Adjust tag padding
- Add base color scheme/theme
2023-05-18 13:55:48 +02:00

53 lines
1.2 KiB
Plaintext

<button vg-attr='utils.AttributesAppend{AttrMap: c.AttrMap, Classes: "d3c-1633424238"}' @click="c.HandleClick(event)">
<vg-comp expr="c.SymbolSlot"></vg-comp><vg-comp expr="c.DefaultSlot"></vg-comp>
</button>
<style>
.d3c-1633424238 {
display: flex;
align-items: center;
gap: 0.5em;
text-decoration: none;
padding: 0.3em 0.5em;
margin: 0.5em 0;
border-radius: 4px;
border: 1px solid var(--d3c-color-border);
background-color: var(--d3c-color-background);
color: var(--d3c-color-text);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 1em;
font-family: "Segoe UI", sans-serif;
min-height: 2em;
user-select: none;
}
.d3c-1633424238.d3c-button-vertical {
flex-direction: column;
}
.d3c-1633357633-sidebar .d3c-1633424238, .d3c-1633357633-menu .d3c-1633424238 {
border: none;
background-color: transparent;
}
.d3c-1633424238:hover {
background-color: var(--d3c-color-hovered);
}
.d3c-1633424238:active {
background-color: var(--d3c-color-clicked);
}
.d3c-1633424238-selected {
background-color: var(--d3c-color-selected) !important;
}
</style>
<script type="application/x-go">
import (
"git.d3nexus.de/Dadido3/D3vugu-components/utils"
)
</script>