Change dialpad button design.

Lighter borders in conference creation.
Timepicker : highlight button with circle and same color, add 5 minutes.
Fix gray mask/mouse area on recent contacts in chat creation when already selected.
This commit is contained in:
Julien Wadel 2022-06-29 17:31:48 +02:00
parent d015ffbf14
commit 940ef644e3
6 changed files with 89 additions and 101 deletions

View file

@ -5,7 +5,7 @@
viewBox="0 0 80 80"
fill="none"
version="1.1"
id="svg14"
id="svg20"
sodipodi:docname="dialpad_custom.svg"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
@ -13,9 +13,9 @@
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs18" />
id="defs24" />
<sodipodi:namedview
id="namedview16"
id="namedview22"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
@ -23,94 +23,80 @@
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
showgrid="false"
inkscape:zoom="6.6693026"
inkscape:cx="19.567263"
inkscape:cy="46.031799"
inkscape:zoom="5.20625"
inkscape:cx="32.460984"
inkscape:cy="26.506603"
inkscape:window-width="1920"
inkscape:window-height="1043"
inkscape:window-x="1920"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg14" />
<rect
x="49.821117"
y="48.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect2"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="15.702009"
y="32.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect4"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="49.821117"
y="32.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect6"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="15.702009"
y="48.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect8"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="32.761562"
y="48.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect10"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="32.761562"
y="32.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect12"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="15.702009"
y="16.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect4-3"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="49.821117"
y="16.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect6-6"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
<rect
x="32.761562"
y="16.702011"
width="11.595978"
height="11.592258"
rx="0.62748796"
stroke="#4b5964"
id="rect12-7"
style="stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none" />
inkscape:current-layer="svg20" />
<g
id="g850"
transform="matrix(2.0408164,0,0,2.0408164,20,20)">
<circle
cx="16.799999"
cy="2.8"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle2" />
<circle
cx="16.799999"
cy="9.8000002"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle4" />
<circle
cx="16.799999"
cy="16.799999"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle6" />
<circle
cx="2.8"
cy="2.8"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle8" />
<circle
cx="2.8"
cy="9.8000002"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle10" />
<circle
cx="2.8"
cy="16.799999"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle12" />
<circle
cx="9.8000002"
cy="2.8"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle14" />
<circle
cx="9.8000002"
cy="9.8000002"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle16" />
<circle
cx="9.8000002"
cy="16.799999"
r="2.05"
stroke="#000000"
stroke-width="1.5"
id="circle18" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 2.3 KiB

View file

@ -307,6 +307,7 @@ class ColorListModel : public ProxyListModel {
*/
ADD_COLOR("border", "black", "Borders")
ADD_COLOR("border_light", "#A8A8A8", "Lighter borders")

View file

@ -39,8 +39,8 @@ Item{
width: 30 * 1.5
height: width
radius: width / 2
border.color: "darkgray"
color: TimePickerStyle.hoursColor
border.color: TimePickerStyle.hoursColor
border.width: 3
}
delegate: Item {
@ -85,7 +85,7 @@ Item{
PathView {
id: inner
model: 6
model: 12
interactive: false
highlightRangeMode: PathView.NoHighlightRange
@ -93,8 +93,8 @@ Item{
width: 30 * 1.5
height: width
radius: width / 2
border.color: "darkgray"
color: TimePickerStyle.minutesColor
border.color: TimePickerStyle.minutesColor
border.width: 3
}
delegate: Item {
@ -107,7 +107,7 @@ Item{
anchors.centerIn: parent
font.pointSize: Units.dp * 11
font.bold: currentItem
text: index * 10
text: index * 5
color: currentItem ? TimePickerStyle.selectedItemColor : TimePickerStyle.unselectedItemColor
}
@ -119,7 +119,7 @@ Item{
path: Path {
id: innerPath
property int yStep: middleMinSize * Math.cos(2 * Math.PI / inner.count)
property int yStep: (middleMinSize - 30 ) * Math.cos(2 * Math.PI / inner.count)
startX: mainItem.centerPosition; startY: mainItem.centerPosition - innerPath.yStep
PathArc {
x: mainItem.centerPosition; y: mainItem.centerPosition + innerPath.yStep

View file

@ -9,7 +9,7 @@ import ColorsList 1.0
QtObject {
property string sectionName : 'TimePicker'
property color hoursColor: ColorsList.add(sectionName+'_hours', 'i').color
property color minutesColor: ColorsList.add(sectionName+'_minutes', 's').color
property color minutesColor: ColorsList.add(sectionName+'_minutes', 'i').color
property color selectedItemColor: ColorsList.add(sectionName+'_selected', 'l').color
property color unselectedItemColor: ColorsList.add(sectionName+'_unselected', 'g').color

View file

@ -198,7 +198,7 @@ DialogPlus {
RowLayout{
Layout.fillWidth: true
Layout.fillHeight : true
spacing:10
spacing:0
Repeater{
id:lastContacts
@ -206,8 +206,9 @@ DialogPlus {
model:TimelineListModel.getLastChatRooms(5)
delegate :
Item{
Layout.fillHeight: true
Layout.preferredWidth: 60
//Layout.fillHeight: true
Layout.preferredHeight: 60
Layout.preferredWidth: 50 + avatar2.height/2
ColumnLayout{
anchors.fill:parent
Avatar{
@ -247,7 +248,7 @@ DialogPlus {
Rectangle{
id:mask
anchors.fill:parent
anchors.topMargin: -5
//anchors.topMargin: -5
color:'white'
opacity: 0.5
visible: smartSearchBar.isIgnored(modelData.sipAddress)

View file

@ -13,7 +13,7 @@ QtObject {
property color subjectTitleColor: ColorsList.add(sectionName+'_subject_title', 'g').color
property color recentContactTitleColor: ColorsList.add(sectionName+'_recent_contact_title', 'g').color
property color recentContactUsernameColor: ColorsList.add(sectionName+'_recent_contact_username', 'g').color
property color addressesBorderColor: ColorsList.add(sectionName+'_addresses_border', 'l').color
property color addressesBorderColor: ColorsList.add(sectionName+'_addresses_border', 'border_light').color
property color addressesAdminColor: ColorsList.add(sectionName+'_addresses_admin', 'g').color
property color requiredColor: ColorsList.add(sectionName+'_required_text', 'g').color