diff --git a/awx/ui/static/img/CloudSync.svg b/awx/ui/static/img/CloudSync.svg index d9fac6d652..557e12e4a5 100644 --- a/awx/ui/static/img/CloudSync.svg +++ b/awx/ui/static/img/CloudSync.svg @@ -1,18 +1,18 @@ - + CloudSync Created with Sketch. - - - - - - + + + + + + - + \ No newline at end of file diff --git a/awx/ui/static/img/Credentials.svg b/awx/ui/static/img/Credentials.svg index d15344cd86..feb7c06b9f 100644 --- a/awx/ui/static/img/Credentials.svg +++ b/awx/ui/static/img/Credentials.svg @@ -1,12 +1,12 @@ - + Credentials Created with Sketch. - - + + - + \ No newline at end of file diff --git a/awx/ui/static/img/InventoryScripts.svg b/awx/ui/static/img/InventoryScripts.svg index 9efdad48a4..5035b9c5e8 100644 --- a/awx/ui/static/img/InventoryScripts.svg +++ b/awx/ui/static/img/InventoryScripts.svg @@ -1,15 +1,25 @@ - + InventoryScripts Created with Sketch. +<<<<<<< HEAD +======= + + + + + + + +>>>>>>> 470dc9b... Update icons on setup menu \ No newline at end of file diff --git a/awx/ui/static/img/JobTemplates.svg b/awx/ui/static/img/JobTemplates.svg index 720bf11493..b82a6b7099 100644 --- a/awx/ui/static/img/JobTemplates.svg +++ b/awx/ui/static/img/JobTemplates.svg @@ -1,16 +1,16 @@ - + JobTemplates Created with Sketch. - - - - + + + + - + \ No newline at end of file diff --git a/awx/ui/static/img/Jobs.svg b/awx/ui/static/img/Jobs.svg index ec37085ba3..4b497b79db 100644 --- a/awx/ui/static/img/Jobs.svg +++ b/awx/ui/static/img/Jobs.svg @@ -1,13 +1,13 @@ - + Jobs Created with Sketch. - - + + - + \ No newline at end of file diff --git a/awx/ui/static/img/ManagementJobs.svg b/awx/ui/static/img/ManagementJobs.svg index c3358b8d28..dc10b3725d 100644 --- a/awx/ui/static/img/ManagementJobs.svg +++ b/awx/ui/static/img/ManagementJobs.svg @@ -1,14 +1,21 @@ - + MaintenanceJobs Created with Sketch. +<<<<<<< HEAD +======= + + + + +>>>>>>> 470dc9b... Update icons on setup menu \ No newline at end of file diff --git a/awx/ui/static/img/Organizations.svg b/awx/ui/static/img/Organizations.svg index db43b3d250..ecc2ad3f1a 100644 --- a/awx/ui/static/img/Organizations.svg +++ b/awx/ui/static/img/Organizations.svg @@ -1,10 +1,11 @@ - + Organizations Created with Sketch. +<<<<<<< HEAD @@ -12,6 +13,11 @@ +======= + + + +>>>>>>> 470dc9b... Update icons on setup menu \ No newline at end of file diff --git a/awx/ui/static/img/PortalMode--exit.svg b/awx/ui/static/img/PortalMode--exit.svg index 747a7f741b..853a9acea5 100644 --- a/awx/ui/static/img/PortalMode--exit.svg +++ b/awx/ui/static/img/PortalMode--exit.svg @@ -1,16 +1,21 @@ - + - PortalMode--exit + PortalMode Created with Sketch. +<<<<<<< HEAD +======= + + +>>>>>>> 470dc9b... Update icons on setup menu \ No newline at end of file diff --git a/awx/ui/static/img/PortalMode.svg b/awx/ui/static/img/PortalMode.svg index d1a3cf102e..0e7656d146 100644 --- a/awx/ui/static/img/PortalMode.svg +++ b/awx/ui/static/img/PortalMode.svg @@ -1,12 +1,12 @@ - + PortalMode Created with Sketch. - + - + \ No newline at end of file diff --git a/awx/ui/static/js/main-menu/menu-default.partial.html b/awx/ui/static/js/main-menu/menu-default.partial.html index 75f41ea4c6..6d8a3c5d05 100644 --- a/awx/ui/static/js/main-menu/menu-default.partial.html +++ b/awx/ui/static/js/main-menu/menu-default.partial.html @@ -1,17 +1,17 @@ - - + + Projects - - + + Inventories - - + + Job Templates - - + + Jobs diff --git a/awx/ui/static/js/setup-menu/hover-icon.block.less b/awx/ui/static/js/setup-menu/hover-icon.block.less new file mode 100644 index 0000000000..a95cc73578 --- /dev/null +++ b/awx/ui/static/js/setup-menu/hover-icon.block.less @@ -0,0 +1,35 @@ +/** @define HoverIcon */ + +.HoverIcon { + @media screen and (max-width: 571px) { + &--onlyLarge { + .HoverIcon-icon--opacity { + opacity: 1; + } + .HoverIcon-icon--height { + height: 22px; + } + } + } + &-icon { + width: auto; + &--opacity { + transition: opacity 0.3s ease-out; + opacity: 0; + } + &--height { + transition: height 0.2s ease-out; + height: 0; + } + } + &:hover { + .HoverIcon-icon { + &--opacity { + opacity: 1; + } + &--height { + height: 22px; + } + } + } +} diff --git a/awx/ui/static/js/setup-menu/setup-item.block.less b/awx/ui/static/js/setup-menu/setup-item.block.less index ac55c31bb1..7ce98635ce 100644 --- a/awx/ui/static/js/setup-menu/setup-item.block.less +++ b/awx/ui/static/js/setup-menu/setup-item.block.less @@ -4,28 +4,46 @@ .SetupItem { - &--aside { - padding-bottom: @vertical-basis / 2; - } + @icon-small-size: 2.4rem; + @icon-large-size: 3.4rem; + + &--aside { + padding-bottom: @vertical-basis / 2; + } + @vertical-basis: 1.4rem; - padding: 0; - padding-bottom: @vertical-basis; + padding: (@vertical-basis / 2) 0; - color: black !important; + color: black; flex: 1 0 100%; - transition: background-color 0.25s ease-in-out; - background-color: white !important; + transition: background-color 0.15s ease-in-out; + background-color: white; + &:hover, &:focus, &:active { color: black; } - .SetupItem-icon { - max-width: 2.8rem; - align-self: center; - img { - width: 2.3rem; - } + &--hoverable { + &:hover { + background-color: lighten(@ansible-red, 28%); + } + } + + &-icon { + &--aside { + width: @icon-small-size; + } + + width: @icon-large-size; + align-self: center; + img { + width: 100%; + } + } + + &--noIcon { + margin-left: @icon-small-size + 1.4rem; // 1.4rem comes from Media-figure margin } &--button { diff --git a/awx/ui/static/js/setup-menu/setup-menu.block.less b/awx/ui/static/js/setup-menu/setup-menu.block.less index c67431db59..223f567fb0 100644 --- a/awx/ui/static/js/setup-menu/setup-menu.block.less +++ b/awx/ui/static/js/setup-menu/setup-menu.block.less @@ -37,7 +37,6 @@ @media screen and (max-width: 930px) { flex-flow: nowrap column; - align-items: center; &-block { width: 100%; max-width: inherit; diff --git a/awx/ui/static/js/setup-menu/setup-menu.partial.html b/awx/ui/static/js/setup-menu/setup-menu.partial.html index 921491a5e2..9c4230cffc 100644 --- a/awx/ui/static/js/setup-menu/setup-menu.partial.html +++ b/awx/ui/static/js/setup-menu/setup-menu.partial.html @@ -28,29 +28,43 @@