mirror of
https://github.com/Ultimaker/Cura.git
synced 2025-08-05 13:03:59 -06:00
CURA-5537 improve styling of toolbox
This commit is contained in:
parent
9fa8498162
commit
bc05839940
5 changed files with 75 additions and 68 deletions
|
@ -1,37 +1,31 @@
|
|||
// Copyright (c) 2018 Ultimaker B.V.
|
||||
// Toolbox is released under the terms of the LGPLv3 or higher.
|
||||
|
||||
import QtQuick 2.3
|
||||
import QtQuick 2.7
|
||||
import QtQuick.Controls 1.4
|
||||
import QtQuick.Controls.Styles 1.4
|
||||
import QtGraphicalEffects 1.0
|
||||
import UM 1.1 as UM
|
||||
|
||||
Item
|
||||
Rectangle
|
||||
{
|
||||
width: UM.Theme.getSize("toolbox_thumbnail_large").width
|
||||
height: thumbnail.height + packageName.height
|
||||
Rectangle
|
||||
{
|
||||
id: highlight
|
||||
anchors.fill: parent
|
||||
opacity: 0.0
|
||||
color: UM.Theme.getColor("primary")
|
||||
}
|
||||
id: tileBase
|
||||
width: UM.Theme.getSize("toolbox_thumbnail_large").width + (2 * UM.Theme.getSize("default_lining").width)
|
||||
height: thumbnail.height + packageNameBackground.height + (2 * UM.Theme.getSize("default_lining").width)
|
||||
border.width: UM.Theme.getSize("default_lining").width
|
||||
border.color: UM.Theme.getColor("lining")
|
||||
color: "transparent"
|
||||
Rectangle
|
||||
{
|
||||
id: thumbnail
|
||||
color: "white"
|
||||
width: UM.Theme.getSize("toolbox_thumbnail_large").width
|
||||
height: UM.Theme.getSize("toolbox_thumbnail_large").height
|
||||
border
|
||||
{
|
||||
width: UM.Theme.getSize("default_lining").width
|
||||
color: UM.Theme.getColor("lining")
|
||||
}
|
||||
anchors
|
||||
{
|
||||
top: parent.top
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
topMargin: UM.Theme.getSize("default_lining").width
|
||||
}
|
||||
Image
|
||||
{
|
||||
|
@ -43,22 +37,33 @@ Item
|
|||
mipmap: true
|
||||
}
|
||||
}
|
||||
Label
|
||||
Rectangle
|
||||
{
|
||||
id: packageName
|
||||
text: model.name
|
||||
id: packageNameBackground
|
||||
color: UM.Theme.getColor("primary")
|
||||
anchors
|
||||
{
|
||||
top: thumbnail.bottom
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
height: UM.Theme.getSize("toolbox_heading_label").height
|
||||
width: parent.width
|
||||
wrapMode: Text.WordWrap
|
||||
color: UM.Theme.getColor("text")
|
||||
font: UM.Theme.getFont("medium_bold")
|
||||
Label
|
||||
{
|
||||
id: packageName
|
||||
text: model.name
|
||||
anchors
|
||||
{
|
||||
horizontalCenter: parent.horizontalCenter
|
||||
}
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
height: UM.Theme.getSize("toolbox_heading_label").height
|
||||
width: parent.width
|
||||
wrapMode: Text.WordWrap
|
||||
color: UM.Theme.getColor("button_text")
|
||||
font: UM.Theme.getFont("medium_bold")
|
||||
}
|
||||
}
|
||||
MouseArea
|
||||
{
|
||||
|
@ -66,13 +71,15 @@ Item
|
|||
hoverEnabled: true
|
||||
onEntered:
|
||||
{
|
||||
thumbnail.border.color = UM.Theme.getColor("primary")
|
||||
highlight.opacity = 0.1
|
||||
packageName.color = UM.Theme.getColor("button_text_hover")
|
||||
packageNameBackground.color = UM.Theme.getColor("primary_hover")
|
||||
tileBase.border.color = UM.Theme.getColor("primary_hover")
|
||||
}
|
||||
onExited:
|
||||
{
|
||||
thumbnail.border.color = UM.Theme.getColor("lining")
|
||||
highlight.opacity = 0.0
|
||||
packageName.color = UM.Theme.getColor("button_text")
|
||||
packageNameBackground.color = UM.Theme.getColor("primary")
|
||||
tileBase.border.color = UM.Theme.getColor("lining")
|
||||
}
|
||||
onClicked:
|
||||
{
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue