mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-03-20 22:05:57 +00:00
Fix sidenav toolbar (logo and buttons)
This commit is contained in:
committed by
Francis Lachapelle
parent
90cd79a21b
commit
fdb4cd71eb
@@ -147,11 +147,13 @@
|
||||
-->
|
||||
<!-- Sidenav -->
|
||||
<md-sidenav class="md-sidenav-left" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')" layout="column">
|
||||
<md-toolbar class="md-tall" layout-align="end start">
|
||||
<md-toolbar class="md-tall" layout-align="start start">
|
||||
<span class="sg-logo"> </span>
|
||||
<h2 class="md-toolbar-tools md-toolbar-tools-bottom">
|
||||
<span class="sg-md-title md-flex">{{activeUser.identification}}</span>
|
||||
</h2>
|
||||
<div class="md-toolbar-tools md-toolbar-tools-bottom">
|
||||
<p class="sg-md-title md-flex">{{activeUser.identification}}</p>
|
||||
<!--fixme: correct this data-binding -->
|
||||
<p class="md-sg-subhead-1">{{account.name}}</p>
|
||||
</div>
|
||||
</md-toolbar>
|
||||
<md-content md-scroll-y="md-scroll-y" class="md-flex" ng-controller="LeftCtrl">
|
||||
<md-list>
|
||||
@@ -192,7 +194,7 @@
|
||||
<md-toolbar layout="column" layout-align="space-between start" class="md-tall toolbar-main">
|
||||
<div class="md-toolbar-tools" layout="row" layout-align="space-between start" ng-controller="toggleCtrl">
|
||||
<div class="sg-toolbar-group-1" layout="row">
|
||||
<md-button ng-click="toggleLeft()" class="md-hide-gt-md sg-button-navicon" aria-label="Toggle Menu">
|
||||
<md-button ng-click="toggleLeft()" class="md-hide-gt-md sg-button-navicon iconButton" aria-label="Toggle Menu">
|
||||
<span class="md-icon-menu"></span>
|
||||
</md-button>
|
||||
<div class="sg-date-group" layout="column" layout-align="center end">
|
||||
|
||||
@@ -21,8 +21,7 @@
|
||||
<!--avatar-->
|
||||
</div>
|
||||
<div class="sg-tile-content">
|
||||
<a ui-sref="mail.account.mailbox.message({accountId: account.id, mailboxId: (mailbox.path | encodeUri), messageId: currentMessage.uid})"
|
||||
>
|
||||
<a ui-sref="mail.account.mailbox.message({accountId: account.id, mailboxId: (mailbox.path | encodeUri), messageId: currentMessage.uid})">
|
||||
<div class="sg-md-subhead-multi subject">
|
||||
{{currentMessage.subject}}
|
||||
</div>
|
||||
|
||||
@@ -264,11 +264,13 @@
|
||||
|
||||
<!-- Sidenav -->
|
||||
<md-sidenav class="md-sidenav-left" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')" layout="column">
|
||||
<md-toolbar class="md-tall" layout-align="end start">
|
||||
<md-toolbar class="md-tall" layout-align="start start">
|
||||
<span class="sg-logo"> </span>
|
||||
<h2 class="md-toolbar-tools md-toolbar-tools-bottom">
|
||||
<span class="sg-md-title md-flex">{{activeUser.identification}}</span>
|
||||
</h2>
|
||||
<div class="md-toolbar-tools md-toolbar-tools-bottom">
|
||||
<p class="sg-md-title md-flex">{{activeUser.identification}}</p>
|
||||
<!--fixme: correct this data-binding -->
|
||||
<p class="md-sg-subhead-1">{{account.name}}</p>
|
||||
</div>
|
||||
</md-toolbar>
|
||||
<md-content md-scroll-y="md-scroll-y" class="md-flex" ng-controller="LeftCtrl">
|
||||
<md-list ng-repeat="account in accounts track by account.id">
|
||||
@@ -291,7 +293,7 @@
|
||||
<md-toolbar layout="column" layout-align="space-between start" class="md-tall toolbar-main">
|
||||
<div class="md-toolbar-tools" layout="row" layout-align="space-between start" ng-controller="toggleCtrl">
|
||||
<div class="sg-toolbar-group-1" layout="row">
|
||||
<md-button ng-click="toggleLeft()" class="md-hide-gt-md sg-button-navicon" aria-label="Toggle Menu">
|
||||
<md-button ng-click="toggleLeft()" class="md-hide-gt-md sg-button-navicon iconButton" aria-label="Toggle Menu">
|
||||
<span class="md-icon-menu"></span>
|
||||
</md-button>
|
||||
<div class="sg-date-group" layout="column" layout-align="center end">
|
||||
|
||||
@@ -35,6 +35,7 @@ sg-folder-tree .md-button {
|
||||
// Variables
|
||||
$iconButton-size: $touch-zone-width;
|
||||
$iconButton-icon-size: sg-size(title);
|
||||
$iconButton-menu-size: sg-size(headline);
|
||||
$iconButton-icon-padding: 2px;
|
||||
$iconButton-size-cursor-coarse: $iconButton-size;
|
||||
// Could be use to scale-down buttons if desktop layout suffers too much from touch-size
|
||||
@@ -44,6 +45,7 @@ $iconButton-padding: ($iconButton-size - ($iconButton-icon-size + ($iconButton-i
|
||||
$iconButton-hover-scale: 1.25;
|
||||
$iconButton-transition: transform $swift-ease-in-duration $swift-ease-in-timing-function;
|
||||
|
||||
|
||||
// Classes
|
||||
.iconButton {
|
||||
padding: $iconButton-padding;
|
||||
@@ -94,4 +96,8 @@ $iconButton-transition: transform $swift-ease-in-duration $swift-ease-in-timing-
|
||||
width: $touch-zone;
|
||||
height: $touch-zone;
|
||||
margin-left: ($mg * -1);
|
||||
}
|
||||
// angular-material is overspecifying so we are and so we have to continue
|
||||
.sg-button-navicon.iconButton span.md-icon-menu {
|
||||
font-size: $iconButton-menu-size;
|
||||
}
|
||||
@@ -1,8 +1,10 @@
|
||||
@import 'extends';
|
||||
|
||||
md-toolbar {
|
||||
// todo: create variables scaled z-index
|
||||
z-index: 20;
|
||||
box-shadow: none;
|
||||
font-size: initial;
|
||||
}
|
||||
.md-toolbar-tools.md-toolbar-tools-bottom {
|
||||
height: (5 * $line);
|
||||
|
||||
@@ -19,7 +19,7 @@ main {
|
||||
background-image: url("../img/sogo-full.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
margin-left: 16px;
|
||||
margin: $bl 0 0 $mg;
|
||||
height: 7 * $bl;
|
||||
min-width: 18 * $bl;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user