mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-28 07:44:56 +00:00
JohnDoe6345789
58a94d0489
feat(styles): create global styles entry point and organize global styles feat(styles): implement base HTML element styles and utility classes for flexbox feat(styles): establish layout, position, spacing, and text utility classes feat(styles): introduce mixins for animations, cards, dialogs, flexbox, grid, and responsive design test(quick_guide): add component and metadata validation tests for quick_guide package test(ui_level6): implement metadata validation tests for ui_level6 package
58 lines
1.4 KiB
QML
58 lines
1.4 KiB
QML
import QtQuick
|
|
|
|
/**
|
|
* CAvatar.qml - Circular avatar (mirrors _avatar.scss)
|
|
* Displays image or initials in circular container
|
|
*/
|
|
Rectangle {
|
|
id: root
|
|
|
|
property string size: "md" // sm, md, lg
|
|
property string src: "" // Image source URL
|
|
property string initials: "" // Fallback initials (e.g. "JD")
|
|
property color bgColor: Theme.surfaceVariant
|
|
property color textColor: Theme.onSurfaceVariant
|
|
|
|
// Size mapping
|
|
readonly property int _size: {
|
|
switch (size) {
|
|
case "sm": return 32
|
|
case "lg": return 64
|
|
default: return 48
|
|
}
|
|
}
|
|
|
|
width: _size
|
|
height: _size
|
|
radius: _size / 2
|
|
color: src ? "transparent" : bgColor
|
|
clip: true
|
|
|
|
// Image (if src provided)
|
|
Image {
|
|
anchors.fill: parent
|
|
source: root.src
|
|
fillMode: Image.PreserveAspectCrop
|
|
visible: root.src !== ""
|
|
|
|
// Smooth circular clipping
|
|
layer.enabled: true
|
|
layer.effect: Item {
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
radius: width / 2
|
|
}
|
|
}
|
|
}
|
|
|
|
// Initials fallback
|
|
Text {
|
|
anchors.centerIn: parent
|
|
text: root.initials.toUpperCase()
|
|
color: root.textColor
|
|
font.pixelSize: root._size * 0.4
|
|
font.weight: Font.Medium
|
|
visible: root.src === "" && root.initials !== ""
|
|
}
|
|
}
|