You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@brooklyn.apache.org by he...@apache.org on 2015/01/20 00:00:24 UTC
[04/13] incubator-brooklyn git commit: css fixes to support safari
css fixes to support safari
Project: http://git-wip-us.apache.org/repos/asf/incubator-brooklyn/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-brooklyn/commit/4c6d4b71
Tree: http://git-wip-us.apache.org/repos/asf/incubator-brooklyn/tree/4c6d4b71
Diff: http://git-wip-us.apache.org/repos/asf/incubator-brooklyn/diff/4c6d4b71
Branch: refs/heads/master
Commit: 4c6d4b71738f7b76987afae1f990927116f0c169
Parents: 783e638
Author: Alex Heneveld <al...@cloudsoftcorp.com>
Authored: Thu Jan 15 16:24:42 2015 +0000
Committer: Alex Heneveld <al...@cloudsoftcorp.com>
Committed: Thu Jan 15 16:33:00 2015 +0000
----------------------------------------------------------------------
docs/style/css/base.scss | 49 +++++++++++++++++++++++++++++++------------
1 file changed, 36 insertions(+), 13 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-brooklyn/blob/4c6d4b71/docs/style/css/base.scss
----------------------------------------------------------------------
diff --git a/docs/style/css/base.scss b/docs/style/css/base.scss
index 6d2b9fa..663d596 100644
--- a/docs/style/css/base.scss
+++ b/docs/style/css/base.scss
@@ -66,13 +66,25 @@ a[id]:empty, a[name]:empty {
}
/* GENERAL UTILS
----------------------------------------------------------------------- */
+
+@mixin flex() {
+ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
+ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
+ display: -ms-flexbox; /* TWEENER - IE 10 */
+ display: -webkit-flex; /* NEW - Chrome */
+ display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
+}
+
+@mixin transform($tfn) {
+ -webkit-transform: #{$tfn};
+ -moz-transform: #{$tfn};
+ -o-transform: #{$tfn};
+ transform: #{$tfn};
+}
@mixin flip() {
- transform: scaleX(-1);
filter: FlipH;
- -webkit-transform: scaleX(-1);
- -moz-transform: scaleX(-1);
- -o-transform: scaleX(-1);
+ @include transform('scaleX(-1)');
-ms-filter: "FlipH";
}
@@ -206,9 +218,13 @@ a.header-literal-anchor { display: inline !important; }
squashing the main container instead */
.container-and-sidebars {
width: 100%;
- display: flex;
+ @include flex();
}
.container-between-sidebars {
+ -webkit-box-flex: 1 100%;
+ -webkit-flex: 1 100%;
+ -webkit-flex-flex: 1 100%;
+ flex: 1 100%;
flex: 10 1 100%;
display: inline-block;
width: auto;
@@ -216,6 +232,10 @@ a.header-literal-anchor { display: inline !important; }
margin-right: auto;
}
.container-sidebar {
+ -webkit-box-flex: 0 auto;
+ -webkit-flex: 0 auto;
+ -webkit-flex-flex: 0 auto;
+ flex: 0 auto;
flex: 0 0 auto;
}
.container-sidebar-right {
@@ -456,8 +476,8 @@ code {
}
.clipboard_button {
font-size: 18px;
- transform: translateY(-2px);
color: $vibrant_fg_green;
+ @include transform('translateY(-2px)');
}
.clipboard_button:hover, .clipboard_button.zeroclipboard-is-hover {
color: $a_hover_color;
@@ -487,7 +507,7 @@ code {
display: inline-block;
@include nowrap();
padding: 3px 7px;
- transform: translateX(-50%);
+ @include transform('translateX(-50%)');
}
@@ -495,8 +515,8 @@ code {
----------------------------------------------------------------------- */
div.search_right {
- float: right;
- transform: translateY(-12px);
+ float: right;
+ @include transform('translateY(-12px)');
padding-right: 5%;
padding-bottom: 18px;
font-size: 75%;
@@ -628,7 +648,8 @@ div.annotated_blueprint {
width: auto;
height: 100%;
div.block {
- display: flex;
+ @include flex();
+ -webkit-align-items: center;
align-items: center;
z-index: -10;
}
@@ -649,10 +670,11 @@ div.annotated_blueprint {
// seems we have to use abs positioning because other techniques
// (translation, negative margins, etc) don't show up outside the scroll-x
position: absolute;
- transform: translateX(-100%) translateY(-50%);
+ @include transform('translateX(-100%) translateY(-50%)');
width: $annotation_width;
- display: flex;
+ @include flex();
+ -webkit-align-items: center;
align-items: center;
div.annotations {
// positioning and sizing
@@ -740,7 +762,8 @@ div.annotated_blueprint {
position: relative;
width: 0;
height: 0;
- display: flex;
+ @include flex();
+ -webkit-align-items: top;
align-items: top;
}
div.initial_notice > div > div {