← Back to branch summary

~ci-train-bot/ubuntu-settings-components/ubuntu-settings-components-ubuntu-zesty-2202

« back to all changes in this revision

Viewing changes to plugins/Ubuntu/Settings/Components/MessageHeader.qml

  • Committer: Bileto Bot
  • Date: 2016-11-16 18:52:43 UTC
  • mfrom: (146.4.57 touch+pointer-styles)
  • Revision ID: ci-train-bot@canonical.com-20161116185243-o399ryjh002umz1a
* Menus: add Pointer and Touch styles to be used depending on the user
  interaction with components
  Menu items now have a new Style property that defines some common properties
  such as shared colors and sizes that change depending on the UX journey. I'm
  only defining Pointer and TouchStyles for now, but they can be easily
  overridden in case.
  Removed some deprecated properties and adapted colors and sizes to new
  style.
* Bump package version as there's a new API for various components

Show diffs side-by-side

added added

removed removed

Lines of Context:
plugins/Ubuntu/Settings/Components/MessageHeader.qml
30
30
    property alias time: timeText.text
31
31
    property alias title: itemLayout.title
32
32
    property alias body: itemLayout.summary
 
33
    property QtObject menuStyle
33
34
 
34
35
    signal iconClicked()
35
36
 
43
44
    ListItemLayout {
44
45
        id: itemLayout
45
46
 
 
47
        padding {
 
48
            top: menuStyle.padding.top
 
49
            bottom: menuStyle.padding.bottom
 
50
            leading: menuStyle.padding.leading
 
51
            trailing: menuStyle.padding.trailing
 
52
        }
 
53
 
46
54
        UbuntuShape {
47
 
            width: units.gu(6)
 
55
            width: menuStyle.avatarSize
48
56
            height: width
49
57
 
50
58
            SlotsLayout.position: SlotsLayout.Leading
60
68
 
61
69
                Binding on color {
62
70
                    when: String(avatarImage.source).match(/^image:\/\/theme/)
63
 
                    value: theme.palette.normal.backgroundText
 
71
                    value: menuStyle.iconColor
64
72
                }
65
73
            }
66
74
        }
67
75
 
 
76
        padding {
 
77
            top: menuStyle.padding.top
 
78
            bottom: menuStyle.padding.bottom
 
79
            leading: menuStyle.padding.leading
 
80
            trailing: menuStyle.padding.trailing
 
81
        }
 
82
 
68
83
        title.objectName: "title"
 
84
        title.color: menuStyle.foregroundColor
69
85
        title.font.weight: Font.DemiBold
 
86
        title.font.pixelSize: menuStyle.fontSize
70
87
        title.anchors.rightMargin: timeText.width > iconImage.width ? timeText.width - iconImage.width : 0
71
88
 
72
89
        summary.objectName: "body"
73
90
        summary.maximumLineCount: 3
74
91
        summary.wrapMode: Text.WordWrap
75
92
        summary.elide: Text.ElideRight
 
93
        summary.font.pixelSize: menuStyle.subtitleFontSize
76
94
 
77
95
        Icon {
78
96
            id: iconImage
79
97
            objectName: "icon"
80
 
            color: theme.palette.normal.backgroundText
 
98
            color: menuStyle.iconColor
81
99
            width: units.gu(3)
82
100
            height: width
83
101
            SlotsLayout.position: SlotsLayout.Trailing
116
134
            rightMargin: itemLayout.padding.trailing
117
135
        }
118
136
 
119
 
        fontSize: "x-small"
 
137
        color: menuStyle.foregroundColor
 
138
        textSize: Label.XSmall
120
139
        maximumLineCount: 1
121
140
    }
122
141
}