summaryrefslogtreecommitdiffstats
path: root/utils/test/reporting/3rd_party/sass/components
diff options
context:
space:
mode:
Diffstat (limited to 'utils/test/reporting/3rd_party/sass/components')
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_box.scss26
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_button.scss88
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_form.scss206
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_icon.scss50
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_image.scss64
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_list.scss177
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_section.scss25
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_table.scss81
-rw-r--r--utils/test/reporting/3rd_party/sass/components/_tiles.scss258
9 files changed, 975 insertions, 0 deletions
diff --git a/utils/test/reporting/3rd_party/sass/components/_box.scss b/utils/test/reporting/3rd_party/sass/components/_box.scss
new file mode 100644
index 000000000..74d3eba02
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_box.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)
+///
+
+/* Box */
+
+ .box {
+ border-radius: _size(border-radius);
+ border: solid _size(border-width) _palette(border);
+ margin-bottom: _size(element-margin);
+ padding: 1.5em;
+
+ > :last-child,
+ > :last-child > :last-child,
+ > :last-child > :last-child > :last-child {
+ margin-bottom: 0;
+ }
+
+ &.alt {
+ border: 0;
+ border-radius: 0;
+ padding: 0;
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_button.scss b/utils/test/reporting/3rd_party/sass/components/_button.scss
new file mode 100644
index 000000000..97fb389ad
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_button.scss
@@ -0,0 +1,88 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Button */
+
+ input[type="submit"],
+ input[type="reset"],
+ input[type="button"],
+ button,
+ .button {
+ @include vendor('appearance', 'none');
+ @include vendor('transition', (
+ 'background-color #{_duration(transition)} ease-in-out',
+ 'color #{_duration(transition)} ease-in-out',
+ 'box-shadow #{_duration(transition)} ease-in-out'
+ ));
+ background-color: transparent;
+ border-radius: _size(border-radius);
+ border: 0;
+ box-shadow: inset 0 0 0 (_size(border-width) * 2) _palette(fg);
+ color: _palette(fg) !important;
+ cursor: pointer;
+ display: inline-block;
+ font-size: 0.8em;
+ font-weight: _font(weight-bold);
+ height: 3.5em;
+ letter-spacing: _font(letter-spacing);
+ line-height: 3.45em;
+ overflow: hidden;
+ padding: 0 1.25em 0 #{1.25em + _font(letter-spacing)};
+ text-align: center;
+ text-decoration: none;
+ text-overflow: ellipsis;
+ text-transform: uppercase;
+ white-space: nowrap;
+
+ &.icon {
+ &:before {
+ margin-right: 0.5em;
+ }
+ }
+
+ &.fit {
+ display: block;
+ margin: 0 0 (_size(element-margin) * 0.5) 0;
+ width: 100%;
+ }
+
+ &:hover {
+ color: _palette(accent1) !important;
+ box-shadow: inset 0 0 0 (_size(border-width) * 2) _palette(accent1);
+ }
+
+ &:active {
+ background-color: transparentize(_palette(accent1), 0.9);
+ }
+
+ &.small {
+ font-size: 0.6em;
+ }
+
+ &.big {
+ font-size: 1em;
+ }
+
+ &.special {
+ box-shadow: none;
+ background-color: _palette(fg);
+ color: _palette(bg) !important;
+
+ &:hover {
+ background-color: _palette(accent1);
+ }
+
+ &:active {
+ background-color: darken(_palette(accent1), 8);
+ }
+ }
+
+ &.disabled,
+ &:disabled {
+ @include vendor('pointer-events', 'none');
+ opacity: 0.25;
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_form.scss b/utils/test/reporting/3rd_party/sass/components/_form.scss
new file mode 100644
index 000000000..af0d5f224
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_form.scss
@@ -0,0 +1,206 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Form */
+
+ form {
+ margin: (_size(element-margin) * -0.5) 0 _size(element-margin) 0;
+
+ &:after {
+ content: '';
+ display: block;
+ clear: both;
+ height: 1px;
+ }
+
+ .field {
+ position: relative;
+ float: left;
+ margin: 0 0 (_size(element-margin) * 0.65) 0;
+ vertical-align: top;
+ width: 100%;
+ }
+
+ .half {
+ width: calc(50% + #{_size(field-gutter) * 0.5}) !important;
+ padding-left: _size(field-gutter);
+ }
+
+ .half.first {
+ width: calc(50% - #{_size(field-gutter) * 0.5}) !important;
+ padding-left: 0;
+ }
+
+ :last-child {
+ margin-bottom: 0;
+ }
+
+ .half:nth-last-child(2) {
+ margin-bottom: 0;
+ }
+
+ .actions {
+ position: relative;
+ clear: both;
+ padding-top: (_size(element-margin) * 0.5);
+ }
+
+ @include breakpoint(xsmall) {
+ .half {
+ width: 100% !important;
+ padding-left: 0;
+ }
+
+ .half.first {
+ width: 100% !important;
+ padding-left: 0;
+ }
+
+ .half:nth-last-child(2) {
+ margin: 0 0 (_size(element-margin) * 0.65) 0;
+ }
+ }
+ }
+
+ label {
+ display: block;
+ font-size: 0.9em;
+ font-weight: _font(weight-bold);
+ margin: 0 0 (_size(element-margin) * 0.5) 0;
+ }
+
+ input[type="text"],
+ input[type="password"],
+ input[type="email"],
+ input[type="tel"],
+ select,
+ textarea {
+ @include vendor('appearance', 'none');
+ background-color: transparent;
+ border: none;
+ border-radius: 0;
+ border-bottom: solid _size(border-width) _palette(border);
+ color: inherit;
+ display: block;
+ outline: 0;
+ padding: 0;
+ text-decoration: none;
+ width: 100%;
+
+ &:invalid {
+ box-shadow: none;
+ }
+
+ &:focus {
+ border-bottom-color: _palette(accent1);
+ box-shadow: inset 0 -1px 0 0 _palette(accent1);
+ }
+ }
+
+ .select-wrapper {
+ @include icon;
+ display: block;
+ position: relative;
+
+ &:before {
+ color: _palette(border);
+ content: '\f078';
+ display: block;
+ height: _size(element-height);
+ line-height: _size(element-height);
+ pointer-events: none;
+ position: absolute;
+ right: 0;
+ text-align: center;
+ top: 0;
+ width: _size(element-height);
+ }
+
+ select::-ms-expand {
+ display: none;
+ }
+ }
+
+ input[type="text"],
+ input[type="password"],
+ input[type="email"],
+ select {
+ height: _size(element-height);
+ }
+
+ textarea {
+ padding: 0;
+ min-height: (_size(element-height) * 1.25);
+ }
+
+ input[type="checkbox"],
+ input[type="radio"], {
+ @include vendor('appearance', 'none');
+ display: block;
+ float: left;
+ margin-right: -2em;
+ opacity: 0;
+ width: 1em;
+ z-index: -1;
+
+ & + label {
+ @include icon;
+ color: _palette(fg);
+ cursor: pointer;
+ display: inline-block;
+ font-size: 1em;
+ font-weight: _font(weight);
+ padding-left: (_size(element-height) * 0.6) + 0.75em;
+ padding-right: 0.75em;
+ position: relative;
+
+ &:before {
+ border-radius: _size(border-radius);
+ border: solid _size(border-width) _palette(border);
+ content: '';
+ display: inline-block;
+ height: (_size(element-height) * 0.6);
+ left: 0;
+ line-height: (_size(element-height) * 0.575);
+ position: absolute;
+ text-align: center;
+ top: 0;
+ width: (_size(element-height) * 0.6);
+ }
+ }
+
+ &:checked + label {
+ &:before {
+ background: _palette(fg);
+ border-color: _palette(fg);
+ color: _palette(bg);
+ content: '\f00c';
+ }
+ }
+
+ &:focus + label {
+ &:before {
+ border-color: _palette(accent1);
+ box-shadow: 0 0 0 _size(border-width) _palette(accent1);
+ }
+ }
+ }
+
+ input[type="checkbox"] {
+ & + label {
+ &:before {
+ border-radius: _size(border-radius);
+ }
+ }
+ }
+
+ input[type="radio"] {
+ & + label {
+ &:before {
+ border-radius: 100%;
+ }
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_icon.scss b/utils/test/reporting/3rd_party/sass/components/_icon.scss
new file mode 100644
index 000000000..5b9a40ca6
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_icon.scss
@@ -0,0 +1,50 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Icon */
+
+ .icon {
+ @include icon;
+ border-bottom: none;
+ position: relative;
+
+ > .label {
+ display: none;
+ }
+
+ &.style1 {
+ }
+
+ &.style2 {
+ @include vendor('transition', (
+ 'background-color #{_duration(transition)} ease-in-out',
+ 'color #{_duration(transition)} ease-in-out',
+ 'border-color #{_duration(transition)} ease-in-out'
+ ));
+ background-color: transparent;
+ border: solid 1px _palette(border);
+ border-radius: _size(border-radius);
+ width: 2.65em;
+ height: 2.65em;
+ display: inline-block;
+ text-align: center;
+ line-height: 2.65em;
+ color: inherit;
+
+ &:before {
+ font-size: 1.1em;
+ }
+
+ &:hover {
+ color: _palette(accent1);
+ border-color: _palette(accent1);
+ }
+
+ &:active {
+ background-color: transparentize(_palette(accent1), 0.9);
+ }
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_image.scss b/utils/test/reporting/3rd_party/sass/components/_image.scss
new file mode 100644
index 000000000..81ae7a372
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_image.scss
@@ -0,0 +1,64 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Image */
+
+ .image {
+ border-radius: _size(border-radius);
+ border: 0;
+ display: inline-block;
+ position: relative;
+
+ img {
+ border-radius: _size(border-radius);
+ display: block;
+ }
+
+ &.left,
+ &.right {
+ max-width: 40%;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ &.left {
+ float: left;
+ padding: 0 1.5em 1em 0;
+ top: 0.25em;
+ }
+
+ &.right {
+ float: right;
+ padding: 0 0 1em 1.5em;
+ top: 0.25em;
+ }
+
+ &.fit {
+ display: block;
+ margin: 0 0 _size(element-margin) 0;
+ width: 100%;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ &.main {
+ display: block;
+ margin: 0 0 (_size(element-margin) * 1.5) 0;
+ width: 100%;
+
+ img {
+ width: 100%;
+ }
+
+ @include breakpoint(small) {
+ margin: 0 0 _size(element-margin) 0;
+ }
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_list.scss b/utils/test/reporting/3rd_party/sass/components/_list.scss
new file mode 100644
index 000000000..9aadc22d1
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_list.scss
@@ -0,0 +1,177 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* List */
+
+ ol {
+ list-style: decimal;
+ margin: 0 0 _size(element-margin) 0;
+ padding-left: 1.25em;
+
+ li {
+ padding-left: 0.25em;
+ }
+ }
+
+ ul {
+ list-style: disc;
+ margin: 0 0 _size(element-margin) 0;
+ padding-left: 1em;
+
+ li {
+ padding-left: 0.5em;
+ }
+
+ &.alt {
+ list-style: none;
+ padding-left: 0;
+
+ li {
+ border-top: solid _size(border-width) _palette(border);
+ padding: 0.5em 0;
+
+ &:first-child {
+ border-top: 0;
+ padding-top: 0;
+ }
+ }
+ }
+
+ &.icons {
+ cursor: default;
+ list-style: none;
+ padding-left: 0;
+ margin: -1em 0 _size(element-margin) -1em;
+
+ li {
+ display: inline-block;
+ padding: 1em 0 0 1em;
+ }
+ }
+
+ &.actions {
+ cursor: default;
+ list-style: none;
+ padding-left: 0;
+
+ li {
+ display: inline-block;
+ padding: 0 (_size(element-margin) * 0.5) 0 0;
+ vertical-align: middle;
+
+ &:last-child {
+ padding-right: 0;
+ }
+ }
+
+ &.small {
+ li {
+ padding: 0 (_size(element-margin) * 0.25) 0 0;
+ }
+ }
+
+ &.vertical {
+ li {
+ display: block;
+ padding: (_size(element-margin) * 0.5) 0 0 0;
+
+ &:first-child {
+ padding-top: 0;
+ }
+
+ > * {
+ margin-bottom: 0;
+ }
+ }
+
+ &.small {
+ li {
+ padding: (_size(element-margin) * 0.25) 0 0 0;
+
+ &:first-child {
+ padding-top: 0;
+ }
+ }
+ }
+ }
+
+ &.fit {
+ display: table;
+ margin-left: (_size(element-margin) * -0.5);
+ padding: 0;
+ table-layout: fixed;
+ width: calc(100% + #{(_size(element-margin) * 0.5)});
+
+ li {
+ display: table-cell;
+ padding: 0 0 0 (_size(element-margin) * 0.5);
+
+ > * {
+ margin-bottom: 0;
+ }
+ }
+
+ &.small {
+ margin-left: (_size(element-margin) * -0.25);
+ width: calc(100% + #{(_size(element-margin) * 0.25)});
+
+ li {
+ padding: 0 0 0 (_size(element-margin) * 0.25);
+ }
+ }
+ }
+
+ @include breakpoint(xsmall) {
+ margin: 0 0 _size(element-margin) 0;
+
+ li {
+ padding: (_size(element-margin) * 0.5) 0 0 0;
+ display: block;
+ text-align: center;
+ width: 100%;
+
+ &:first-child {
+ padding-top: 0;
+ }
+
+ > * {
+ width: 100%;
+ margin: 0 !important;
+
+ &.icon {
+ &:before {
+ margin-left: -2em;
+ }
+ }
+ }
+ }
+
+ &.small {
+ li {
+ padding: (_size(element-margin) * 0.25) 0 0 0;
+
+ &:first-child {
+ padding-top: 0;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ dl {
+ margin: 0 0 _size(element-margin) 0;
+
+ dt {
+ display: block;
+ font-weight: _font(weight-bold);
+ margin: 0 0 (_size(element-margin) * 0.5) 0;
+ }
+
+ dd {
+ margin-left: _size(element-margin);
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_section.scss b/utils/test/reporting/3rd_party/sass/components/_section.scss
new file mode 100644
index 000000000..5b1b02a5d
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_section.scss
@@ -0,0 +1,25 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Section/Article */
+
+ section, article {
+ &.special {
+ text-align: center;
+ }
+ }
+
+ header {
+ p {
+ margin-top: _size(element-margin) * -0.5;
+ }
+
+ @include breakpoint(small) {
+ p {
+ margin-top: 0;
+ }
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_table.scss b/utils/test/reporting/3rd_party/sass/components/_table.scss
new file mode 100644
index 000000000..d6e872865
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_table.scss
@@ -0,0 +1,81 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Table */
+
+ .table-wrapper {
+ -webkit-overflow-scrolling: touch;
+ overflow-x: auto;
+ }
+
+ table {
+ margin: 0 0 _size(element-margin) 0;
+ width: 100%;
+
+ tbody {
+ tr {
+ border: solid _size(border-width) _palette(border);
+ border-left: 0;
+ border-right: 0;
+
+ &:nth-child(2n + 1) {
+ background-color: _palette(border-bg);
+ }
+ }
+ }
+
+ td {
+ padding: 0.75em 0.75em;
+ }
+
+ th {
+ color: _palette(fg-bold);
+ font-size: 0.9em;
+ font-weight: _font(weight-bold);
+ padding: 0 0.75em 0.75em 0.75em;
+ text-align: left;
+ }
+
+ thead {
+ border-bottom: solid (_size(border-width) * 2) _palette(border);
+ }
+
+ tfoot {
+ border-top: solid (_size(border-width) * 2) _palette(border);
+ }
+
+ &.alt {
+ border-collapse: separate;
+
+ tbody {
+ tr {
+ td {
+ border: solid _size(border-width) _palette(border);
+ border-left-width: 0;
+ border-top-width: 0;
+
+ &:first-child {
+ border-left-width: _size(border-width);
+ }
+ }
+
+ &:first-child {
+ td {
+ border-top-width: _size(border-width);
+ }
+ }
+ }
+ }
+
+ thead {
+ border-bottom: 0;
+ }
+
+ tfoot {
+ border-top: 0;
+ }
+ }
+ } \ No newline at end of file
diff --git a/utils/test/reporting/3rd_party/sass/components/_tiles.scss b/utils/test/reporting/3rd_party/sass/components/_tiles.scss
new file mode 100644
index 000000000..cecbbbe8d
--- /dev/null
+++ b/utils/test/reporting/3rd_party/sass/components/_tiles.scss
@@ -0,0 +1,258 @@
+///
+/// Phantom by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Tiles */
+
+ .tiles {
+ $gutter: _size(gutter);
+ $duration: 0.5s;
+ $ease: 'ease';
+
+ @include vendor('display', 'flex');
+ @include vendor('flex-wrap', 'wrap');
+ postiion: relative;
+ margin: ($gutter * -1) 0 0 ($gutter * -1);
+
+ article {
+ @include vendor('transition', (
+ 'transform #{$duration} #{$ease}',
+ 'opacity #{$duration} #{$ease}'
+ ));
+ position: relative;
+ width: calc(#{(100% / 3)} - #{$gutter * 1});
+ margin: $gutter 0 0 $gutter;
+
+ > .image {
+ @include vendor('transition', 'transform #{$duration} #{$ease}');
+ position: relative;
+ display: block;
+ width: 100%;
+ border-radius: _size(border-radius);
+ overflow: hidden;
+
+ img {
+ display: block;
+ width: 100%;
+ }
+
+ &:before {
+ @include vendor('pointer-events', 'none');
+ @include vendor('transition', (
+ 'background-color #{$duration} #{$ease}',
+ 'opacity #{$duration} #{$ease}'
+ ));
+ content: '';
+ display: block;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ opacity: 1.0;
+ z-index: 1;
+ opacity: 0.8;
+ }
+
+ &:after {
+ @include vendor('pointer-events', 'none');
+ @include vendor('transition', 'opacity #{$duration} #{$ease}');
+ content: '';
+ display: block;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" preserveAspectRatio="none"><style>line { stroke-width: 0.25px; stroke: #ffffff; }</style><line x1="0" y1="0" x2="100" y2="100" /><line x1="100" y1="0" x2="0" y2="100" /></svg>');
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+ opacity: 0.25;
+ z-index: 2;
+ }
+ }
+
+ > a {
+ @include vendor('display', 'flex');
+ @include vendor('flex-direction', 'column');
+ @include vendor('align-items', 'center');
+ @include vendor('justify-content', 'center');
+ @include vendor('transition', (
+ 'background-color #{$duration} #{$ease}',
+ 'transform #{$duration} #{$ease}'
+ ));
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ padding: 1em;
+ border-radius: _size(border-radius);
+ border-bottom: 0;
+ color: _palette(fg-accent);
+ text-align: center;
+ text-decoration: none;
+ z-index: 3;
+
+ > :last-child {
+ margin: 0;
+ }
+
+ &:hover {
+ color: _palette(fg-accent) !important;
+ }
+
+ h2 {
+ margin: 0;
+ }
+
+ .content {
+ @include vendor('transition', (
+ 'max-height #{$duration} #{$ease}',
+ 'opacity #{$duration} #{$ease}'
+ ));
+ width: 100%;
+ max-height: 0;
+ line-height: 1.5;
+ margin-top: 0.35em;
+ opacity: 0;
+
+ > :last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+
+ &.style1 {
+ > .image:before {
+ background-color: _palette(accent1);
+ }
+ }
+
+ &.style2 {
+ > .image:before {
+ background-color: _palette(accent2);
+ }
+ }
+
+ &.style3 {
+ > .image:before {
+ background-color: _palette(accent3);
+ }
+ }
+
+ &.style4 {
+ > .image:before {
+ background-color: _palette(accent4);
+ }
+ }
+
+ &.style5 {
+ > .image:before {
+ background-color: _palette(accent5);
+ }
+ }
+
+ &.style6 {
+ > .image:before {
+ background-color: _palette(accent6);
+ }
+ }
+
+ body:not(.is-touch) & {
+ &:hover {
+ > .image {
+ @include vendor('transform', 'scale(1.1)');
+
+ &:before {
+ background-color: _palette(bg-accent);
+ opacity: 0.35;
+ }
+
+ &:after {
+ opacity: 0;
+ }
+ }
+
+ .content {
+ max-height: 15em;
+ opacity: 1;
+ }
+ }
+ }
+ }
+
+ * + & {
+ margin-top: _size(element-margin);
+ }
+
+ body.is-loading & {
+ article {
+ @include vendor('transform', 'scale(0.9)');
+ opacity: 0;
+ }
+ }
+
+ body.is-touch & {
+ article {
+ .content {
+ max-height: 15em;
+ opacity: 1;
+ }
+ }
+ }
+
+ @include breakpoint(large) {
+ $gutter: _size(gutter) * 0.5;
+
+ margin: ($gutter * -1) 0 0 ($gutter * -1);
+
+ article {
+ width: calc(#{(100% / 3)} - #{$gutter * 1});
+ margin: $gutter 0 0 $gutter;
+ }
+ }
+
+ @include breakpoint(medium) {
+ $gutter: _size(gutter);
+
+ margin: ($gutter * -1) 0 0 ($gutter * -1);
+
+ article {
+ width: calc(#{(100% / 2)} - #{$gutter * 1});
+ margin: $gutter 0 0 $gutter;
+ }
+ }
+
+ @include breakpoint(small) {
+ $gutter: _size(gutter) * 0.5;
+
+ margin: ($gutter * -1) 0 0 ($gutter * -1);
+
+ article {
+ width: calc(#{(100% / 2)} - #{$gutter * 1});
+ margin: $gutter 0 0 $gutter;
+
+ &:hover {
+ > .image {
+ @include vendor('transform', 'scale(1.0)');
+ }
+ }
+ }
+ }
+
+ @include breakpoint(xsmall) {
+ $gutter: _size(gutter) * 0.5;
+
+ margin: 0;
+
+ article {
+ width: 100%;
+ margin: $gutter 0 0 0;
+ }
+ }
+ }
+