timka123
77b26757bf
- Refactored TimerPage component to improve layout and user experience. - Updated theme configuration to utilize design tokens for better maintainability. - Introduced new tokens for colors and typography to align with design principles. - Simplified state management and improved timer functionality. - Enhanced accessibility and responsiveness of UI elements.
45 lines
1.1 KiB
QML
45 lines
1.1 KiB
QML
// A number and its name. The figure is set in the display serif, which is what
|
|
// makes a screen of statistics read like a page rather than a readout.
|
|
import QtQuick
|
|
import QtQuick.Controls
|
|
import QtQuick.Layouts
|
|
|
|
import ".."
|
|
|
|
ColumnLayout {
|
|
property string label: ""
|
|
property string value: "—"
|
|
property string caption: ""
|
|
property color accent: Theme.ink
|
|
property int size: 30
|
|
|
|
spacing: 2
|
|
Layout.fillWidth: true
|
|
|
|
Label {
|
|
text: label.toUpperCase()
|
|
color: Theme.muted
|
|
font.pixelSize: 10
|
|
font.letterSpacing: 1.2
|
|
font.weight: Font.DemiBold
|
|
font.family: Theme.sansFamily
|
|
}
|
|
Label {
|
|
text: value
|
|
color: accent
|
|
font.pixelSize: size
|
|
font.family: Theme.displayFamily
|
|
font.letterSpacing: -0.5
|
|
}
|
|
Label {
|
|
visible: caption !== ""
|
|
text: caption
|
|
color: Theme.faint
|
|
font.pixelSize: 11
|
|
font.family: Theme.sansFamily
|
|
Layout.fillWidth: true
|
|
elide: Text.ElideRight
|
|
wrapMode: Text.WordWrap
|
|
}
|
|
}
|