diff --git a/html.qrc b/html.qrc index ca0241a..9e79905 100644 --- a/html.qrc +++ b/html.qrc @@ -11,5 +11,7 @@ html/newmessage.mp3 html/svg/arrows.svg html/svg/notification.svg + html/svg/a-left.svg + html/svg/a-right.svg diff --git a/html/style.css b/html/style.css index 45b3494..866f6fa 100644 --- a/html/style.css +++ b/html/style.css @@ -104,8 +104,9 @@ body { } .main_header__title_airplaine { - background: url(/svg/airplane.svg); + background-image: url(/svg/airplane.svg); background-repeat: no-repeat; + background-position: center; width: 6%; height: 50%; border: none; @@ -118,8 +119,9 @@ body { } .main_header__title_arrows { - background: url(/svg/arrows.svg); + background-image: url(/svg/arrows.svg); background-repeat: no-repeat; + background-position: center; width: 6%; height: 50%; border: none; @@ -132,8 +134,9 @@ body { } .main_header__title_notify { - background: url(/svg/notification.svg); + background-image: url(/svg/notification.svg); background-repeat: no-repeat; + background-position: center; width: 6%; height: 50%; border: none; @@ -177,7 +180,7 @@ body { } .main_header__search_button__img { - background: url(/svg/magnifier.svg); + background-image: url(/svg/magnifier.svg); background-repeat: no-repeat; background-position: center; background-size: contain; @@ -209,10 +212,37 @@ body { } .main_middle__path { + display: flex; color: #6493bc; flex: 77.5%; } +.main_middle__path_aright { + background-image: url(/svg/a-right.svg); + background-repeat: no-repeat; + background-position: center; + width: 3%; + opacity: .5; + margin: 0 1% 0 1%; +} + +.main_middle__path_aright:hover { + opacity: 1; +} + +.main_middle__path_aleft { + background-image: url(/svg/a-left.svg); + background-repeat: no-repeat; + background-position: center; + width: 3%; + opacity: .5; + margin: 0 1% 0 1%; +} + +.main_middle__path_aleft:hover { + opacity: 1; +} + .main_middle__online { color: #b6c7d6; flex: 21.5%; @@ -271,7 +301,7 @@ body { .main_payload__block_folder { flex: 5%; - background: url(/svg/folder.svg); + background-image: url(/svg/folder.svg); background-repeat: no-repeat; background-position: center; background-size: contain; @@ -279,7 +309,7 @@ body { .main_payload__block_message { flex: 5%; - background: url(/svg/message.svg); + background-image: url(/svg/message.svg); background-repeat: no-repeat; background-position: center; background-size: contain; @@ -351,6 +381,14 @@ body { .left_menu__footer { font-size: 12px; } + + .main_middle__path_aright { + width: 5%; + } + + .main_middle__path_aleft { + width: 5%; + } } @media screen and (max-width: 1200px) { diff --git a/html/svg/a-left.svg b/html/svg/a-left.svg new file mode 100755 index 0000000..0bb9207 --- /dev/null +++ b/html/svg/a-left.svg @@ -0,0 +1,8 @@ + + + + + diff --git a/html/svg/a-right.svg b/html/svg/a-right.svg new file mode 100755 index 0000000..3f7eaca --- /dev/null +++ b/html/svg/a-right.svg @@ -0,0 +1,8 @@ + + + + +