amorfo77/sogo
1
0
Fork 0
mirror of https://github.com/inverse-inc/sogo.git synced 2026-07-17 14:24:52 +00:00
Code Issues Projects Releases Wiki Activity

Preparation for build of a unique CSS

Browse Source
This commit is contained in:
Francis Lachapelle
2015-06-11 15:57:16 -04:00
parent 6040838396
commit 36c931b596
42 changed files with 65 additions and 1794 deletions
Download Patch File Download Diff File Expand all files Collapse all files
UI/WebServerResources/scss/components/tabs/_extends.scss
+2
View File
@@ -0,0 +1,2 @@
/*! tabs/_extends.scss - */
@import '../../../angular-material/src/components/tabs/tabs.scss';
UI/WebServerResources/scss/components/tabs/tabs.scss
+1 -175
View File
@@ -1,175 +1 @@
// Tabs
$tabs-paginator-width: $baseline-grid * 4 !default;
$tabs-tab-width: $baseline-grid * 12 !default;
$tabs-header-height: 48px !default;
md-tabs {
display: block;
width: 100%;
font-weight: 500;
}
.md-header {
width: 100%;
height: $tabs-header-height;
box-sizing: border-box;
position: relative;
}
.md-paginator {
z-index: 1;
margin-right: -2px;
display: flex;
justify-content: center;
align-items: center;
width: $tabs-paginator-width;
min-height: 100%;
cursor: pointer;
border: none;
background-color: transparent;
background-repeat: no-repeat;
background-position: center center;
position: absolute;
&.md-prev {
left: 0;
}
&.md-next {
right: 0;
}
/* TODO Once we have a better way to inline svg images, change this
to use svgs correctly */
&.md-prev {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMjA4IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyIAkJIiBzdHlsZT0iZmlsbDp3aGl0ZTsiLz4gPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+IDwvZz4gPC9nPiA8ZyBpZD0iR3JpZCIgZGlzcGxheT0ibm9uZSI+IDxnIGRpc3BsYXk9ImlubGluZSI+IDwvZz4gPC9nPiA8L3N2Zz4NCg==');
}
&.md-next {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMzM2IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTAsNiA4LjYsNy40IDEzLjIsMTIgOC42LDE2LjYgMTAsMTggMTYsMTIgCQkiIHN0eWxlPSJmaWxsOndoaXRlOyIvPiA8cmVjdCBmaWxsPSJub25lIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiLz4gPC9nPiA8L2c+IDxnIGlkPSJHcmlkIiBkaXNwbGF5PSJub25lIj4gPGcgZGlzcGxheT0iaW5saW5lIj4gPC9nPiA8L2c+IDwvc3ZnPg0K');
}
}
/* If `center` justified, change to left-justify if paginating */
md-tabs[center] .md-header:not(.md-paginating) .md-header-items {
justify-content: center;
}
.md-paginating .md-header-items-container {
left: $tabs-paginator-width;
right: $tabs-paginator-width;
}
.md-header-items-container {
overflow: hidden;
position: absolute;
left: 0;
right: 0;
height: 100%;
white-space: nowrap;
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
margin: auto;
.md-header-items {
display: flex;
box-sizing: border-box;
transition: transform $swift-ease-in-out-duration $swift-ease-in-out-timing-function;
transform: translate3d(0, 0, 0);
height: 100%;
width: 99999px;
}
}
.md-tabs-content {
overflow: hidden;
width: 100%;
position: relative;
.md-tab-content {
height: 100%;
&.ng-hide {
&.ng-animate {
display: block !important;
}
}
&.ng-animate {
transition: transform $swift-ease-in-out-duration $swift-ease-in-out-timing-function;
transform: translateX(0);
&.ng-hide-add {
transform: translateX(-100%);
&.md-transition-rtl {
transform: translateX(100%);
}
}
&.ng-hide-remove {
position: absolute;
transform: translateX(100%);
top: 0;
left: 0;
right: 0;
bottom: 0;
&.md-transition-rtl {
transform: translateX(-100%);
}
&.ng-hide-remove-active {
transform: translateX(0);
}
}
}
}
}
md-tabs-ink-bar {
$time: 0.25s;
$delay: $time * 0.3;
$shortTime: $time;
z-index: 1;
display: none;
position: absolute;
left: 0;
bottom: 0;
box-sizing: border-box;
height: 2px;
margin-top: -2px;
transform: scaleX(1);
transform-origin: 0 0;
&.md-transition-right {
transition: right $time $swift-ease-in-out-timing-function,
left $shortTime $swift-ease-in-out-timing-function $delay;
}
&.md-transition-left {
transition: right $shortTime $swift-ease-in-out-timing-function $delay,
left $time $swift-ease-in-out-timing-function;
}
}
md-tab {
display: flex;
align-items: center;
justify-content: center;
position: relative;
z-index: 0;
overflow: hidden;
height: 100%;
text-align: center;
cursor: pointer;
padding: 20px 24px;
box-sizing: border-box;
transition: background 0.35s $swift-ease-in-out-timing-function,
color 0.35s $swift-ease-in-out-timing-function;
&[disabled] {
pointer-events: none;
cursor: default;
}
@include not-selectable();
&:focus {
outline: none;
}
md-tab-label {
flex: 1 1 auto;
z-index: 100;
opacity: 1;
overflow: hidden;
}
}
@import 'extends';