From c850beb64083c730301188ade4cbba0f2a329a92 Mon Sep 17 00:00:00 2001 From: Morgan Richomme Date: Wed, 16 Nov 2016 18:16:43 +0100 Subject: Refactor reporting dir - dockerization - create util function for all the test projects - create a common config files - add unit tests - pep8 JIRA: RELENG-162 Change-Id: Ib209be4233084100ff238a7aeb2843ccc24a6f1e Signed-off-by: Morgan Richomme --- .../reporting/3rd_party/sass/layout/_footer.scss | 139 +++++++++++++++++ .../reporting/3rd_party/sass/layout/_header.scss | 136 +++++++++++++++++ .../reporting/3rd_party/sass/layout/_main.scss | 15 ++ .../reporting/3rd_party/sass/layout/_menu.scss | 164 +++++++++++++++++++++ .../reporting/3rd_party/sass/layout/_wrapper.scss | 26 ++++ 5 files changed, 480 insertions(+) create mode 100644 utils/test/reporting/3rd_party/sass/layout/_footer.scss create mode 100644 utils/test/reporting/3rd_party/sass/layout/_header.scss create mode 100644 utils/test/reporting/3rd_party/sass/layout/_main.scss create mode 100644 utils/test/reporting/3rd_party/sass/layout/_menu.scss create mode 100644 utils/test/reporting/3rd_party/sass/layout/_wrapper.scss (limited to 'utils/test/reporting/3rd_party/sass/layout') diff --git a/utils/test/reporting/3rd_party/sass/layout/_footer.scss b/utils/test/reporting/3rd_party/sass/layout/_footer.scss new file mode 100644 index 000000000..ce0ccbc99 --- /dev/null +++ b/utils/test/reporting/3rd_party/sass/layout/_footer.scss @@ -0,0 +1,139 @@ +/// +/// Phantom by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Footer */ + + #footer { + $gutter: _size(gutter); + + @include padding(5em, 0, (0, 0, 3em, 0)); + background-color: _palette(bg-alt); + + > .inner { + @include vendor('display', 'flex'); + @include vendor('flex-wrap', 'wrap'); + @include vendor('flex-direction', 'row'); + + > * > :last-child { + margin-bottom: 0; + } + + section:nth-child(1) { + width: calc(66% - #{$gutter}); + margin-right: $gutter; + } + + section:nth-child(2) { + width: calc(33% - #{$gutter}); + margin-left: $gutter; + } + + .copyright { + width: 100%; + padding: 0; + margin-top: 5em; + list-style: none; + font-size: 0.8em; + color: transparentize(_palette(fg), 0.5); + + a { + color: inherit; + } + + li { + display: inline-block; + border-left: solid 1px transparentize(_palette(fg), 0.85); + line-height: 1; + padding: 0 0 0 1em; + margin: 0 0 0 1em; + + &:first-child { + border-left: 0; + padding-left: 0; + margin-left: 0; + } + } + } + } + + @include breakpoint(large) { + $gutter: _size(gutter) * 0.5; + + @include padding(5em, 0); + + > .inner { + section:nth-child(1) { + width: calc(66% - #{$gutter}); + margin-right: $gutter; + } + + section:nth-child(2) { + width: calc(33% - #{$gutter}); + margin-left: $gutter; + } + } + } + + @include breakpoint(medium) { + $gutter: _size(gutter); + + > .inner { + section:nth-child(1) { + width: 66%; + margin-right: 0; + } + + section:nth-child(2) { + width: calc(33% - #{$gutter}); + margin-left: $gutter; + } + } + } + + @include breakpoint(small) { + @include padding(3em, 0); + + > .inner { + @include vendor('flex-direction', 'column'); + + section:nth-child(1) { + width: 100%; + margin-right: 0; + margin: 3em 0 0 0; + } + + section:nth-child(2) { + @include vendor('order', '-1'); + width: 100%; + margin-left: 0; + } + + .copyright { + margin-top: 3em; + } + } + } + + @include breakpoint(xsmall) { + > .inner { + .copyright { + margin-top: 3em; + + li { + border-left: 0; + padding-left: 0; + margin: 0.75em 0 0 0; + display: block; + line-height: inherit; + + &:first-child { + margin-top: 0; + } + } + } + } + } + } \ No newline at end of file diff --git a/utils/test/reporting/3rd_party/sass/layout/_header.scss b/utils/test/reporting/3rd_party/sass/layout/_header.scss new file mode 100644 index 000000000..70a5fbaae --- /dev/null +++ b/utils/test/reporting/3rd_party/sass/layout/_header.scss @@ -0,0 +1,136 @@ +/// +/// Phantom by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Header */ + + #header { + @include padding(5em, 0, (3em, 0, -5em, 0)); + + .logo { + display: block; + border-bottom: 0; + color: inherit; + font-weight: _font(weight-bold); + letter-spacing: _font(letter-spacing); + margin: 0 0 (_size(element-margin) * 1.25) 0; + text-decoration: none; + text-transform: uppercase; + display: inline-block; + + > * { + display: inline-block; + vertical-align: middle; + } + + .symbol { + margin-right: 0.65em; + + img { + display: block; + width: 2em; + height: 2em; + } + } + } + + nav { + position: fixed; + right: 2em; + top: 2em; + z-index: _misc(z-index-base); + + ul { + @include vendor('display', 'flex'); + @include vendor('align-items', 'center'); + list-style: none; + margin: 0; + padding: 0; + + li { + display: block; + padding: 0; + + a { + display: block; + position: relative; + height: 3em; + line-height: 3em; + padding: 0 1.5em; + background-color: transparentize(_palette(bg), 0.5); + border-radius: _size(border-radius); + border: 0; + font-size: 0.8em; + font-weight: _font(weight-bold); + letter-spacing: _font(letter-spacing); + text-transform: uppercase; + } + + a[href="#menu"] { + -webkit-tap-highlight-color: transparent; + width: 4em; + text-indent: 4em; + font-size: 1em; + overflow: hidden; + padding: 0; + white-space: nowrap; + + &:before, &:after { + @include vendor('transition', 'opacity #{_duration(transition)} ease'); + content: ''; + display: block; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-position: center; + background-repeat: no-repeat; + background-size: 2em 2em; + } + + &:before { + background-image: svg-url(''); + opacity: 0; + } + + &:after { + background-image: svg-url(''); + opacity: 1; + } + + &:hover { + &:before { + opacity: 1; + } + + &:after { + opacity: 0; + } + } + } + } + } + } + + @include breakpoint(small) { + @include padding(3em, 0, (1em, 0, -3em, 0)); + + nav { + right: 0.5em; + top: 0.5em; + + ul { + li { + a[href="#menu"] { + &:before, &:after { + background-size: 1.5em 1.5em; + } + } + } + } + } + } + } \ No newline at end of file diff --git a/utils/test/reporting/3rd_party/sass/layout/_main.scss b/utils/test/reporting/3rd_party/sass/layout/_main.scss new file mode 100644 index 000000000..8643931e4 --- /dev/null +++ b/utils/test/reporting/3rd_party/sass/layout/_main.scss @@ -0,0 +1,15 @@ +/// +/// Phantom by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Main */ + + #main { + @include padding(5em, 0, (-5em, 0, 3em, 0)); + + @include breakpoint(small) { + @include padding(3em, 0, (-3em, 0, 3em, 0)); + } + } \ No newline at end of file diff --git a/utils/test/reporting/3rd_party/sass/layout/_menu.scss b/utils/test/reporting/3rd_party/sass/layout/_menu.scss new file mode 100644 index 000000000..6a1895b1f --- /dev/null +++ b/utils/test/reporting/3rd_party/sass/layout/_menu.scss @@ -0,0 +1,164 @@ +/// +/// Phantom by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Menu */ + + #wrapper { + @include vendor('transition', 'opacity #{_duration(menu)} ease'); + opacity: 1; + } + + #menu { + @include vendor('transform', 'translateX(#{_size(menu)})'); + @include vendor('transition', ('transform #{_duration(menu)} ease', 'visibility #{_duration(menu)}')); + position: fixed; + top: 0; + right: 0; + width: _size(menu); + max-width: 80%; + height: 100%; + -webkit-overflow-scrolling: touch; + background: _palette(fg); + color: _palette(bg); + cursor: default; + visibility: hidden; + z-index: _misc(z-index-base) + 2; + + > .inner { + @include vendor('transition', 'opacity #{_duration(menu)} ease'); + -webkit-overflow-scrolling: touch; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + padding: 2.75em; + opacity: 0; + overflow-y: auto; + + > ul { + list-style: none; + margin: 0 0 (_size(element-margin) * 0.5) 0; + padding: 0; + + > li { + padding: 0; + border-top: solid 1px transparentize(_palette(bg), 0.85); + + a { + display: block; + padding: 1em 0; + line-height: 1.5; + border: 0; + color: inherit; + } + + &:first-child { + border-top: 0; + margin-top: -1em; + } + } + } + } + + > .close { + @include vendor('transition', ( + 'opacity #{_duration(menu)} ease', + 'transform #{_duration(menu)} ease' + )); + @include vendor('transform', 'scale(0.25) rotate(180deg)'); + -webkit-tap-highlight-color: transparent; + display: block; + position: absolute; + top: 2em; + left: -6em; + width: 6em; + text-indent: 6em; + height: 3em; + border: 0; + font-size: 1em; + opacity: 0; + overflow: hidden; + padding: 0; + white-space: nowrap; + + &:before, &:after { + @include vendor('transition', 'opacity #{_duration(transition)} ease'); + content: ''; + display: block; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-position: center; + background-repeat: no-repeat; + background-size: 2em 2em; + } + + &:before { + background-image: svg-url(''); + opacity: 0; + } + + &:after { + background-image: svg-url(''); + opacity: 1; + } + + &:hover { + &:before { + opacity: 1; + } + + &:after { + opacity: 0; + } + } + } + + @include breakpoint(small) { + @include vendor('transform', 'translateX(#{_size(menu) * 0.75})'); + width: (_size(menu) * 0.75); + + > .inner { + padding: 2.75em 1.5em; + } + + > .close { + top: 0.5em; + left: -4.25em; + width: 4.25em; + text-indent: 4.25em; + + &:before, &:after { + background-size: 1.5em 1.5em; + } + } + } + } + + body.is-menu-visible { + #wrapper { + @include vendor('pointer-events', 'none'); + cursor: default; + opacity: 0.25; + } + + #menu { + @include vendor('transform', 'translateX(0)'); + visibility: visible; + + > * { + opacity: 1; + } + + .close { + @include vendor('transform', 'scale(1.0) rotate(0deg)'); + opacity: 1; + } + } + } \ No newline at end of file diff --git a/utils/test/reporting/3rd_party/sass/layout/_wrapper.scss b/utils/test/reporting/3rd_party/sass/layout/_wrapper.scss new file mode 100644 index 000000000..62ee1741c --- /dev/null +++ b/utils/test/reporting/3rd_party/sass/layout/_wrapper.scss @@ -0,0 +1,26 @@ +/// +/// Phantom by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Wrapper */ + + #wrapper { + > * { + > .inner { + $gutter: _size(gutter); + + width: 100%; + max-width: _size(inner); + margin: 0 auto; + padding: 0 $gutter; + + @include breakpoint(small) { + $gutter: _size(gutter) * 0.5; + + padding: 0 $gutter; + } + } + } + } \ No newline at end of file -- cgit 1.2.3-korg