From c58d9fb9f1d4bcf36e3bc5be8c86918fed1d9675 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adrian=20Wo=C5=BAniak?= Date: Mon, 30 Mar 2020 16:26:24 +0200 Subject: [PATCH] Add aside --- jirs-client/dev/feedback.png | Bin 0 -> 16825 bytes jirs-client/js/css/aside.css | 106 ++++++++++++++++++++++++++ jirs-client/js/css/variables.css | 6 +- jirs-client/js/styles.css | 1 + jirs-client/src/shared.rs | 55 +++++++++++-- jirs-client/static/logo.svg | 45 +++++++++++ jirs-client/static/project-avatar.svg | 95 +++++++++++++++++++++++ 7 files changed, 298 insertions(+), 10 deletions(-) create mode 100644 jirs-client/dev/feedback.png create mode 100644 jirs-client/js/css/aside.css create mode 100644 jirs-client/static/logo.svg create mode 100644 jirs-client/static/project-avatar.svg diff --git a/jirs-client/dev/feedback.png b/jirs-client/dev/feedback.png new file mode 100644 index 0000000000000000000000000000000000000000..dbaf66eba9a1f674195d0a524b6817471c38bf62 GIT binary patch literal 16825 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 R@KgW*002ovPDHLkV1gD&r2PN@ literal 0 HcmV?d00001 diff --git a/jirs-client/js/css/aside.css b/jirs-client/js/css/aside.css new file mode 100644 index 00000000..9ef9609d --- /dev/null +++ b/jirs-client/js/css/aside.css @@ -0,0 +1,106 @@ +aside#navbar-left { + z-index: var(--navLeft); + position: fixed; + top: 0; + left: 0; + overflow-x: hidden; + height: 100vh; + width: var(--appNavBarLeftWidth); + background: var(--backgroundDarkPrimary); + transition: all 0.1s; + transform: translateZ(0); +} + +aside#navbar-left:hover { + width: 200px; + box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.6); +} + +aside#navbar-left > .logoLink { + display: block; + position: relative; + left: 0; + margin: 20px 0 10px; + transition: left 0.1s; +} + +aside#navbar-left > .logoLink > .styledLogo { + display: inline-block; + margin-left: 8px; + padding: 10px; + cursor: pointer; + user-select: none; +} + +aside#navbar-left .item { + position: relative; + width: 100%; + height: 42px; + line-height: 42px; + padding-left: 64px; + color: #deebff; + transition: color 0.1s; + cursor: pointer; + user-select: none; +} + +aside#navbar-left .item:hover { + background: rgba(255, 255, 255, 0.1); +} + +aside#navbar-left .item > .styledIcon { + position: absolute; + left: 18px; +} + +aside#navbar-left > .item > .styledIcon.search { + font-size: 22px; + color: #DEEBFE; +} + +aside#navbar-left > .item > .styledIcon.plus { + font-size: 27px; + color: #DEEBFE; +} + +aside#navbar-left .item > .styledIcon.help { + font-size: 27px; + color: #DEEBFE; +} + +aside#navbar-left .item > .itemText { + position: relative; + right: 12px; + visibility: hidden; + opacity: 0; + text-transform: uppercase; + transition: all 0.1s; + font-family: var(--font-bold); + font-size: 12px; + transition-property: right, visibility, opacity; +} + +aside#navbar-left > .bottom { + position: absolute; + bottom: 20px; + left: 0; + width: 100%; +} + +aside#navbar-left > .bottom > .aboutTooltip {} + +aside#navbar-left:hover .item > .itemText { + right: 0; + visibility: visible; + opacity: 1; +} + +aside#navbar-left .styledTooltip { + z-index: calc(var(--modal) + 1); + position: fixed; + width: 300px; + border-radius: 3px; + background: #fff; + transform: translateZ(0); + box-shadow: rgba(9, 30, 66, 0.25) 0 4px 8px -2px, rgba(9, 30, 66, 0.31) 0 0 1px; +} diff --git a/jirs-client/js/css/variables.css b/jirs-client/js/css/variables.css index a60d8ccb..9cd1577e 100644 --- a/jirs-client/js/css/variables.css +++ b/jirs-client/js/css/variables.css @@ -46,9 +46,9 @@ } :root /* sizes */ { - --appNavBarLeftWidth: 64; - --secondarySideBarWidth: 230; - --minViewportWidth: 1000; + --appNavBarLeftWidth: 64px; + --secondarySideBarWidth: 230px; + --minViewportWidth: 1000px; } :root /* z-index */ { diff --git a/jirs-client/js/styles.css b/jirs-client/js/styles.css index c0e9cc43..c5cf28e6 100644 --- a/jirs-client/js/styles.css +++ b/jirs-client/js/styles.css @@ -3,6 +3,7 @@ @import "css/variables.css"; @import "css/global.css"; @import "css/sidebar.css"; +@import "css/aside.css"; @import "css/icon.css"; @import "css/shared.css"; @import "css/app.css"; diff --git a/jirs-client/src/shared.rs b/jirs-client/src/shared.rs index 313f4824..24581b1d 100644 --- a/jirs-client/src/shared.rs +++ b/jirs-client/src/shared.rs @@ -7,22 +7,58 @@ use jirs_data::FullProjectResponse; use crate::model::{Icon, Model, Page}; use crate::Msg; +pub fn navbar_left(model: &Model) -> Node { + let mut logo_svg = Node::from_html(include_str!("../static/logo.svg")); + + aside![ + id!["navbar-left"], + a![ + attrs![At::Class => "logoLink", At::Href => "/"], + div![attrs![At::Class => "styledLogo"], logo_svg] + ], + navbar_left_item(model, "Search issues", Icon::Search), + navbar_left_item(model, "Create Issue", Icon::Plus), + div![ + attrs![At::Class => "bottom"], + about_tooltip(model, navbar_left_item(model, "About", Icon::Help)) + ] + ] +} + +fn navbar_left_item(_model: &Model, text: &str, logo: Icon) -> Node { + div![ + attrs![At::Class => "item"], + i![attrs![At::Class => format!("styledIcon {}", logo)]], + span![attrs![At::Class => "itemText"], text] + ] +} + +pub fn about_tooltip(_model: &Model, children: Node) -> Node { + div![attrs![At::Class => "aboutTooltip"], children] +} + +pub fn styled_tooltip() -> Node { + div![attrs![At::Class => "styledTooltip"]] +} + pub fn sidebar(model: &Model) -> Node { + let project_icon = Node::from_html(include_str!("../static/project-avatar.svg")); let project_info = match model.project.as_ref() { Some(project) => li![ id!["projectInfo"], + project_icon, div![ - attrs![At::Class => ".projectTexts";], - div![attrs![At::Class => ".projectName";], project.name], - div![attrs![At::Class => ".projectCategory";], project.category] + attrs![At::Class => "projectTexts";], + div![attrs![At::Class => "projectName";], project.name], + div![attrs![At::Class => "projectCategory";], project.category] ], ], _ => li![ id!["projectInfo"], div![ - attrs![At::Class => ".projectTexts";], - div![attrs![At::Class => ".projectName";], ""], - div![attrs![At::Class => ".projectCategory";], ""] + attrs![At::Class => "projectTexts";], + div![attrs![At::Class => "projectName";], ""], + div![attrs![At::Class => "projectCategory";], ""] ], ], }; @@ -71,7 +107,12 @@ pub fn divider() -> Node { } pub fn inner_layout(model: &Model, children: Node) -> Node { - article![id!["inner-layout"], sidebar(model), children,] + article![ + id!["inner-layout"], + navbar_left(model), + sidebar(model), + children, + ] } pub fn host_client(host_url: String, path: &str) -> Result { diff --git a/jirs-client/static/logo.svg b/jirs-client/static/logo.svg new file mode 100644 index 00000000..b6646d0e --- /dev/null +++ b/jirs-client/static/logo.svg @@ -0,0 +1,45 @@ + + + + + + + + + Jira Software-blue + + + + + + + + diff --git a/jirs-client/static/project-avatar.svg b/jirs-client/static/project-avatar.svg new file mode 100644 index 00000000..6263be5e --- /dev/null +++ b/jirs-client/static/project-avatar.svg @@ -0,0 +1,95 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + +