parent
8e76c699dd
commit
f4f53ec21e
|
@ -40,8 +40,7 @@
|
|||
</var:if-ie>
|
||||
</head>
|
||||
|
||||
<!--FIXME : repport in-line styling in style definitions -->
|
||||
<body style="overflow: hidden; padding-bottom:64px;" var:data-ng-app="angularModule" var:class="bodyClasses"
|
||||
<body var:data-ng-app="angularModule" var:class="bodyClasses"
|
||||
><var:if condition="isCompatibleBrowser"
|
||||
><var:if condition="singleWindowModeEnabled"
|
||||
><div id="popupFrame" style="display: none;"><iframe width="100%" height="100%" src="/SOGo/loading"><!-- space --></iframe></div></var:if
|
||||
|
@ -65,7 +64,7 @@
|
|||
<var:component-content/>
|
||||
<!--FIXME : make sure the .md-button.md-default-theme[disabled] is "contrast aware" disabled labels are actualy almost invisible -->
|
||||
<!--FIXME : repport in-line styling in style definitions -->
|
||||
<md-toolbar layout="row" layout-align="center center" style="background-color:#212121; position: fixed; bottom: 0px; left: 0px; width: 100%; z-index: 100">
|
||||
<md-toolbar class="sg-bottombar" layout="row" layout-align="center center">
|
||||
<var:if condition="userHasCalendarAccess">
|
||||
<var:if condition="isCalendar">
|
||||
<md-button ng-disabled="true"><var:string label:value="Calendar" /></md-button>
|
||||
|
|
|
@ -2336,6 +2336,80 @@ md-toolbar {
|
|||
.md-toolbar-tools .md-button {
|
||||
font-size: 14px; }
|
||||
|
||||
md-toolbar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
font-size: 1.3em;
|
||||
min-height: 64px;
|
||||
width: 100%; }
|
||||
md-toolbar.md-tall {
|
||||
height: 128px;
|
||||
min-height: 128px;
|
||||
max-height: 128px; }
|
||||
md-toolbar.md-medium-tall {
|
||||
height: 88px;
|
||||
min-height: 88px;
|
||||
max-height: 88px; }
|
||||
md-toolbar.md-medium-tall .md-toolbar-tools {
|
||||
height: 48px;
|
||||
min-height: 48px;
|
||||
max-height: 48px; }
|
||||
md-toolbar.md-toolbar-small {
|
||||
min-height: 48px; }
|
||||
md-toolbar .md-indent {
|
||||
margin-left: 64px; }
|
||||
|
||||
.md-toolbar-tools {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
min-height: 100%;
|
||||
max-height: 64px;
|
||||
font-size: inherit;
|
||||
font-weight: normal;
|
||||
padding: 0 16px;
|
||||
margin: 0; }
|
||||
.md-toolbar-tools > * {
|
||||
font-size: inherit; }
|
||||
.md-toolbar-tools h2, .md-toolbar-tools h3 {
|
||||
font-weight: normal; }
|
||||
.md-toolbar-tools a {
|
||||
color: inherit;
|
||||
text-decoration: none; }
|
||||
.md-toolbar-tools .fill-height {
|
||||
display: flex;
|
||||
align-items: center; }
|
||||
.md-toolbar-tools .md-tools {
|
||||
margin-left: auto; }
|
||||
.md-toolbar-tools .md-button {
|
||||
font-size: 14px; }
|
||||
|
||||
.sg-bottombar {
|
||||
@extends md-toolbar;
|
||||
background-color: #212121;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: 100; }
|
||||
|
||||
/**
|
||||
*
|
||||
* @filename _base_styles.scss
|
||||
* @project SOGo
|
||||
* @version 3.alpha
|
||||
*
|
||||
* Define basic general styles for base elements
|
||||
*
|
||||
*
|
||||
*/
|
||||
body,
|
||||
.main {
|
||||
padding-bottom: 64px; }
|
||||
|
||||
/**
|
||||
*
|
||||
* This is the shame file (http://csswizardry.com/2013/04/shame-css/)
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,22 @@
|
|||
///
|
||||
///
|
||||
/// @filename _extends.scss
|
||||
/// @project SOGo
|
||||
/// @version 3.alpha
|
||||
/// @module bottombar
|
||||
///
|
||||
/// botttombar extends
|
||||
///
|
||||
///
|
||||
|
||||
.sg-bottombar {
|
||||
@extends md-toolbar;
|
||||
|
||||
background-color:#212121; // fixme : use a variable
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
// todo : implement a setting map and a getter for every z-index
|
||||
// NiceToHave : implement init map and function
|
||||
z-index: 100;
|
||||
}
|
|
@ -0,0 +1,17 @@
|
|||
md-toolbar.md-THEME_NAME-theme {
|
||||
background-color: '{{primary-color}}';
|
||||
color: '{{primary-contrast}}';
|
||||
|
||||
.md-button {
|
||||
color: '{{primary-contrast}}';
|
||||
}
|
||||
|
||||
&.md-accent {
|
||||
background-color: '{{accent-color}}';
|
||||
color: '{{accent-contrast}}';
|
||||
}
|
||||
&.md-warn {
|
||||
background-color: '{{warn-color}}';
|
||||
color: '{{warn-contrast}}';
|
||||
}
|
||||
}
|
|
@ -0,0 +1,14 @@
|
|||
///
|
||||
///
|
||||
/// @filename _bottombar.scss
|
||||
/// @project SOGo
|
||||
/// @version 3.alpha
|
||||
///
|
||||
/// Main botttombar module file define style for component bottombar, manly an extension of bottombar
|
||||
///
|
||||
///
|
||||
|
||||
@import 'components/toolbar/toolbar.scss'; // todo : remove when settings are done
|
||||
@import "mixins";
|
||||
@import "extends";
|
||||
// -----------------------------------------
|
|
@ -1,3 +1,4 @@
|
|||
// fixme : place all variables in settings
|
||||
$toolbar-tools-height: 64px !default;
|
||||
$toolbar-height: 64px !default;
|
||||
$toolbar-medium-tall-height: 88px !default;
|
||||
|
|
|
@ -0,0 +1,16 @@
|
|||
/**
|
||||
*
|
||||
* @filename _base_styles.scss
|
||||
* @project SOGo
|
||||
* @version 3.alpha
|
||||
*
|
||||
* Define basic general styles for base elements
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
body,
|
||||
.main { // see if '.main' fit the purposes
|
||||
padding-bottom: $toolbar-height; // padding to compensate for the bottom bar
|
||||
}
|
|
@ -0,0 +1,14 @@
|
|||
/**
|
||||
*
|
||||
* @filename _grid.scss
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
*/
|
|
@ -28,11 +28,13 @@
|
|||
/* Local overrides from angular-material src */
|
||||
// fixme : refactor all this to meet our practices
|
||||
// ------------------------------------------------------------------------------
|
||||
@import 'core/variables';
|
||||
@import 'core/mixins';
|
||||
@import 'core/structure';
|
||||
@import 'core/layout';
|
||||
|
||||
|
||||
|
||||
// Icons -
|
||||
// ------------------------------------------------------------------------------
|
||||
// fixme : implement icon-font module
|
||||
|
@ -48,7 +50,11 @@
|
|||
@import 'components/list/list.scss';
|
||||
@import 'components/divider/divider.scss';
|
||||
@import 'components/toolbar/toolbar.scss';
|
||||
@import 'components/bottombar/bottombar.scss';
|
||||
|
||||
// core styles - need to be after components till settings are correctly implemented
|
||||
// ------------------------------------------------------------------------------
|
||||
@import 'core/base_styles/base_style';
|
||||
|
||||
// Make sure this is last to override anything else
|
||||
@import 'shame';
|
||||
|
|
Loading…
Reference in New Issue