Browse Source

éviter les erreurs scss (avec scssphp v2.7.0)

en passant par du css (mais en gardant le scss pour les surcharges)
pull/2/head
chankalan 2 years ago
parent
commit
7167ea9f7e
  1. 23
      css/_font.scss
  2. 39
      css/base/_page.scss
  3. 186
      css/base/_typography.scss
  4. 26
      css/components/_box.scss
  5. 87
      css/components/_button.scss
  6. 156
      css/components/_features.scss
  7. 37
      css/components/_fonts.scss
  8. 182
      css/components/_form.scss
  9. 17
      css/components/_icon.scss
  10. 74
      css/components/_image.scss
  11. 255
      css/components/_list.scss
  12. 31
      css/components/_mini-posts.scss
  13. 179
      css/components/_posts.scss
  14. 39
      css/components/_section.scss
  15. 81
      css/components/_table.scss
  16. 7
      css/fontawesome-all.min.css
  17. 4
      css/fontawesome/font-awesome.min.css
  18. BIN
      css/fonts/FontAwesome.otf
  19. BIN
      css/fonts/fontawesome-webfont.eot
  20. 685
      css/fonts/fontawesome-webfont.svg
  21. BIN
      css/fonts/fontawesome-webfont.ttf
  22. BIN
      css/fonts/fontawesome-webfont.woff
  23. BIN
      css/fonts/fontawesome-webfont.woff2
  24. BIN
      css/fonts/opensans-italic-webfont.woff
  25. BIN
      css/fonts/opensans-italic-webfont.woff2
  26. BIN
      css/fonts/opensans-regular-webfont.woff
  27. BIN
      css/fonts/opensans-regular-webfont.woff2
  28. BIN
      css/fonts/opensans-semibold-webfont.woff
  29. BIN
      css/fonts/opensans-semibold-webfont.woff2
  30. BIN
      css/fonts/opensans-semibolditalic-webfont.woff
  31. BIN
      css/fonts/opensans-semibolditalic-webfont.woff2
  32. BIN
      css/fonts/robotoslab-bold-webfont.woff
  33. BIN
      css/fonts/robotoslab-bold-webfont.woff2
  34. BIN
      css/fonts/robotoslab-regular-webfont.woff
  35. BIN
      css/fonts/robotoslab-regular-webfont.woff2
  36. 75
      css/layout/_banner.scss
  37. 18
      css/layout/_footer.scss
  38. 51
      css/layout/_header.scss
  39. 58
      css/layout/_main.scss
  40. 98
      css/layout/_menu.scss
  41. 223
      css/layout/_sidebar.scss
  42. 13
      css/layout/_wrapper.scss
  43. 2
      css/libs/_skel.scss
  44. 2275
      css/main.css
  45. 60
      css/main.scss
  46. 8
      css/spip.scss
  47. 214
      css/theme.scss
  48. 2
      inclure/head.html
  49. BIN
      webfonts/fa-brands-400.eot
  50. 3442
      webfonts/fa-brands-400.svg
  51. BIN
      webfonts/fa-brands-400.ttf
  52. BIN
      webfonts/fa-brands-400.woff
  53. BIN
      webfonts/fa-brands-400.woff2
  54. BIN
      webfonts/fa-regular-400.eot
  55. 803
      webfonts/fa-regular-400.svg
  56. BIN
      webfonts/fa-regular-400.ttf
  57. BIN
      webfonts/fa-regular-400.woff
  58. BIN
      webfonts/fa-regular-400.woff2
  59. BIN
      webfonts/fa-solid-900.eot
  60. 4649
      webfonts/fa-solid-900.svg
  61. BIN
      webfonts/fa-solid-900.ttf
  62. BIN
      webfonts/fa-solid-900.woff
  63. BIN
      webfonts/fa-solid-900.woff2

23
css/_font.scss

@ -1,23 +0,0 @@
/// Font Face
/// https://gist.github.com/jonathantneal/d0460e5c2d5d7f9bc5e6#file-_mixins-scss
/// simplification pour uniquement woff2 et woff
@mixin font-face($name, $path, $weight: null, $style: null, $exts: woff2 woff) {
$src: null;
@each $ext in $exts {
$src: append($src, url(quote($path + "." + $ext)) format(quote($ext)), comma);
}
@font-face {
font-family: quote($name);
font-style: $style;
font-weight: $weight;
src: $src;
}
}
@include font-face(Roboto Slab, fonts/robotoslab-regular-webfont, 400, normal);
@include font-face(Roboto Slab, fonts/robotoslab-bold-webfont, 700, bold);
@include font-face(Open Sans, fonts/opensans-regular-webfont, 400, normal);
@include font-face(Open Sans, fonts/opensans-semibold-webfont, 600, normal);
@include font-face(Open Sans, fonts/opensans-italic-webfont, 400, italic);
@include font-face(Open Sans, fonts/opensans-semibolditalic-webfont, 600, italic);

39
css/base/_page.scss

@ -1,39 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Basic */
// MSIE: Required for IEMobile.
@-ms-viewport {
width: device-width;
}
// MSIE: Prevents scrollbar from overlapping content.
body {
-ms-overflow-style: scrollbar;
}
// Ensures page width is always >=320px.
@include breakpoint(xsmall) {
html, body {
min-width: 320px;
}
}
body {
background: _palette(bg);
// Prevents animation/transition "flicker".
// Automatically added/removed by js/main.js.
&.is-loading,
&.is-resizing {
*, *:before, *:after {
@include vendor('animation', 'none !important');
@include vendor('transition', 'none !important');
}
}
}

186
css/base/_typography.scss

@ -1,186 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Type */
body, input, select, textarea {
color: _palette(fg);
font-family: _font(family);
font-size: 13pt;
font-weight: _font(weight);
line-height: 1.65;
@include breakpoint(xlarge) {
font-size: 11pt;
}
@include breakpoint(large) {
font-size: 10pt;
}
@include breakpoint(xxsmall) {
font-size: 9pt;
}
}
a {
@include vendor('transition', (
'color #{_duration(transition)} ease-in-out',
'border-bottom-color #{_duration(transition)} ease-in-out'
));
border-bottom: dotted 1px;
color: _palette(accent);
text-decoration: none;
&:hover {
border-bottom-color: _palette(accent);
color: _palette(accent) !important;
strong {
color: inherit;
}
}
}
strong, b {
color: _palette(fg-bold);
font-weight: _font(weight-bold);
}
em, i {
font-style: italic;
}
p {
margin: 0 0 _size(element-margin) 0;
}
h1, h2, h3, h4, h5, h6 {
color: _palette(fg-bold);
font-family: _font(family-heading);
font-weight: _font(weight-heading);
line-height: 1.5;
margin: 0 0 (_size(element-margin) * 0.5) 0;
a {
color: inherit;
text-decoration: none;
}
}
h1 {
font-size: 4em;
margin: 0 0 (_size(element-margin) * 0.25) 0;
line-height: 1.3;
}
h2 {
font-size: 1.75em;
}
h3 {
font-size: 1.25em;
}
h4 {
font-size: 1.1em;
}
h5 {
font-size: 0.9em;
}
h6 {
font-size: 0.7em;
}
@include breakpoint(xlarge) {
h1 {
font-size: 3.5em;
}
}
@include breakpoint(medium) {
h1 {
font-size: 3.25em;
}
}
@include breakpoint(small) {
h1 {
font-size: 2em;
line-height: 1.4;
}
h2 {
font-size: 1.5em;
}
}
sub {
font-size: 0.8em;
position: relative;
top: 0.5em;
}
sup {
font-size: 0.8em;
position: relative;
top: -0.5em;
}
blockquote {
border-left: solid 3px _palette(border);
font-style: italic;
margin: 0 0 _size(element-margin) 0;
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
}
code {
background: _palette(border-bg);
border-radius: _size(border-radius);
border: solid 1px _palette(border);
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0.25em;
padding: 0.25em 0.65em;
}
pre {
-webkit-overflow-scrolling: touch;
font-family: _font(family-fixed);
font-size: 0.9em;
margin: 0 0 _size(element-margin) 0;
code {
display: block;
line-height: 1.75;
padding: 1em 1.5em;
overflow-x: auto;
}
}
hr {
border: 0;
border-bottom: solid 1px _palette(border);
margin: _size(element-margin) 0;
&.major {
margin: (_size(element-margin) * 1.5) 0;
}
}
.align-left {
text-align: left;
}
.align-center {
text-align: center;
}
.align-right {
text-align: right;
}

26
css/components/_box.scss

@ -1,26 +0,0 @@
///
/// Editorial 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 1px _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;
}
}

87
css/components/_button.scss

@ -1,87 +0,0 @@
///
/// Editorial 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'
));
background-color: transparent;
border-radius: _size(border-radius);
border: 0;
box-shadow: inset 0 0 0 2px _palette(accent);
color: _palette(accent) !important;
cursor: pointer;
display: inline-block;
font-family: _font(family-heading);
font-size: 0.8em;
font-weight: _font(weight-heading);
height: 3.5em;
letter-spacing: _font(kerning-heading);
line-height: 3.5em;
padding: 0 2.25em;
text-align: center;
text-decoration: none;
text-transform: uppercase;
white-space: nowrap;
&:hover {
background-color: transparentize(_palette(accent), 0.95);
}
&:active {
background-color: transparentize(_palette(accent), 0.85);
}
&.icon {
&:before {
margin-right: 0.5em;
}
}
&.fit {
display: block;
margin: 0 0 (_size(element-margin) * 0.5) 0;
width: 100%;
}
&.small {
font-size: 0.6em;
}
&.big {
font-size: 1em;
height: 3.65em;
line-height: 3.65em;
}
&.special {
background-color: _palette(accent);
box-shadow: none;
color: _palette(bg) !important;
&:hover {
background-color: lighten(_palette(accent), 3);
}
&:active {
background-color: darken(_palette(accent), 3);
}
}
&.disabled,
&:disabled {
@include vendor('pointer-events', 'none');
opacity: 0.25;
}
}

156
css/components/_features.scss

@ -1,156 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Features */
.features {
$gutter: _size(gutter);
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
margin: 0 0 _size(element-margin) ($gutter * -1);
width: calc(100% + #{$gutter});
article {
@include vendor('align-items', 'center');
@include vendor('display', 'flex');
margin: 0 0 $gutter $gutter;
position: relative;
width: calc(50% - #{$gutter});
&:nth-child(2n - 1) {
margin-right: ($gutter * 0.5);
}
&:nth-child(2n) {
margin-left: ($gutter * 0.5);
}
&:nth-last-child(1),
&:nth-last-child(2) {
margin-bottom: 0;
}
.icon {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '0');
display: block;
height: 10em;
line-height: 10em;
margin: 0 _size(element-margin) 0 0;
text-align: center;
width: 10em;
&:before {
color: _palette(accent);
font-size: 2.75rem;
position: relative;
top: 0.05em;
}
&:after {
@include vendor('transform', 'rotate(45deg)');
border-radius: 0.25rem;
border: solid 2px _palette(border);
content: '';
display: block;
height: 7em;
left: 50%;
margin: -3.5em 0 0 -3.5em;
position: absolute;
top: 50%;
width: 7em;
}
}
.content {
@include vendor('flex-grow', '1');
@include vendor('flex-shrink', '1');
width: 100%;
> :last-child {
margin-bottom: 0;
}
}
}
@include breakpoint(medium) {
margin: 0 0 _size(element-margin) 0;
width: 100%;
article {
margin: 0 0 $gutter 0;
width: 100%;
&:nth-child(2n - 1) {
margin-right: 0;
}
&:nth-child(2n) {
margin-left: 0;
}
&:nth-last-child(1),
&:nth-last-child(2) {
margin-bottom: $gutter;
}
&:last-child {
margin-bottom: 0;
}
.icon {
height: 8em;
line-height: 8em;
width: 8em;
&:before {
font-size: 2.25rem;
}
&:after {
height: 6em;
margin: -3em 0 0 -3em;
width: 6em;
}
}
}
}
@include breakpoint(xsmall) {
article {
@include vendor('flex-direction', 'column');
@include vendor('align-items', 'flex-start');
.icon {
height: 6em;
line-height: 6em;
margin: 0 0 (_size(element-margin) * 0.75) 0;
width: 6em;
&:before {
font-size: 1.5rem;
}
&:after {
height: 4em;
margin: -2em 0 0 -2em;
width: 4em;
}
}
}
}
@include breakpoint(xsmall) {
article {
.icon {
&:before {
font-size: 1.25rem;
}
}
}
}
}

37
css/components/_fonts.scss

@ -1,37 +0,0 @@
@font-face {
font-family: 'Open Sans';
src: url('fonts/opensans-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal
}
/*@font-face {
font-family: 'Open Sans';
src: url('fonts/opensans-semibold-webfont.woff') format('woff');
font-weight: 600;
font-style: normal
}
@font-face {
font-family: 'opensans';
src: url('fonts/opensans-italic-webfont.woff') format('woff');
font-weight: normal;
font-style: italic
}
@font-face {
font-family: 'Open Sans';
src: url('fonts/opensans-semibolditalic-webfont.woff') format('woff');
font-weight: 600;
font-style: italic
}*/
@font-face {
font-family: 'Roboto Slab';
src: url('../../fonts/robotoslab-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal
}
/*@font-face {
font-family: 'Roboto Slab';
src: url('fonts/robotoslab-bold-webfont.woff') format('woff');
font-weight: 700;
font-style: normal
}*/

182
css/components/_form.scss

@ -1,182 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Form */
form {
margin: 0 0 _size(element-margin) 0;
}
label {
color: _palette(fg-bold);
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"],
input[type="search"],
input[type="url"],
select,
textarea {
@include vendor('appearance', 'none');
background: _palette(bg);
border-radius: _size(border-radius);
border: none;
border: solid 1px _palette(border);
color: inherit;
display: block;
outline: 0;
padding: 0 1em;
text-decoration: none;
width: 100%;
&:invalid {
box-shadow: none;
}
&:focus {
border-color: _palette(accent);
box-shadow: 0 0 0 1px _palette(accent);
}
}
.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"],
input[type="tel"],
input[type="search"],
input[type="url"],
select {
height: _size(element-height);
}
textarea {
padding: 0.75em 1em;
}
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 {
background: _palette(bg);
border-radius: _size(border-radius);
border: solid 1px _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-bold);
border-color: _palette(fg-bold);
color: _palette(bg);
content: '\f00c';
}
}
&:focus + label {
&:before {
border-color: _palette(accent);
box-shadow: 0 0 0 1px _palette(accent);
}
}
}
input[type="checkbox"] {
& + label {
&:before {
border-radius: _size(border-radius);
}
}
}
input[type="radio"] {
& + label {
&:before {
border-radius: 100%;
}
}
}
::-webkit-input-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
:-moz-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
::-moz-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
:-ms-input-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}
.formerize-placeholder {
color: _palette(fg-light) !important;
opacity: 1.0;
}

17
css/components/_icon.scss

@ -1,17 +0,0 @@
///
/// Editorial 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;
}
}

74
css/components/_image.scss

@ -1,74 +0,0 @@
///
/// Editorial 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%;
}
}
}
a.image {
overflow: hidden;
img {
@include vendor('transition', 'transform #{_duration(transition)} ease');
}
&:hover {
img {
@include vendor('transform', 'scale(1.075)');
}
}
}

255
css/components/_list.scss

@ -1,255 +0,0 @@
///
/// Editorial 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 1px _palette(border);
padding: 0.5em 0;
&:first-child {
border-top: 0;
padding-top: 0;
}
}
}
&.icons {
cursor: default;
list-style: none;
padding-left: 0;
li {
display: inline-block;
padding: 0 1em 0 0;
&:last-child {
padding-right: 0;
}
.icon {
color: inherit;
&:before {
font-size: 1.25em;
}
}
}
}
&.contact {
list-style: none;
padding: 0;
li {
@include icon;
border-top: solid 1px _palette(border);
margin: 1.5em 0 0 0;
padding: 1.5em 0 0 3em;
position: relative;
&:before {
color: _palette(accent);
display: inline-block;
font-size: 1.5em;
height: 1.125em;
left: 0;
line-height: 1.125em;
position: absolute;
text-align: center;
top: (1.5em / 1.5);
width: 1.5em;
}
&:first-child {
border-top: 0;
margin-top: 0;
padding-top: 0;
&:before {
top: 0;
}
}
a {
color: inherit;
}
}
}
&.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);
}
}
}
}
&.pagination {
cursor: default;
list-style: none;
padding-left: 0;
li {
display: inline-block;
padding-left: 0;
vertical-align: middle;
> .page {
@include vendor('transition', (
'background-color #{_duration(transition)} ease-in-out',
'color #{_duration(transition)} ease-in-out'
));
border-bottom: 0;
border-radius: _size(border-radius);
display: inline-block;
font-size: 0.8em;
font-weight: _font(weight-bold);
height: 2em;
line-height: 2em;
margin: 0 0.125em;
min-width: 2em;
padding: 0 0.5em;
text-align: center;
&.active {
background-color: _palette(accent);
color: _palette(bg) !important;
&:hover {
background-color: lighten(_palette(accent), 3);
}
&:active {
background-color: darken(_palette(accent), 3);
}
}
}
&:first-child {
padding-right: 0.75em;
}
&:last-child {
padding-left: 0.75em;
}
}
/* @include breakpoint(xsmall) {
li {
&:nth-child(n+2):nth-last-child(n+2) {
display: none;
}
&:first-child {
padding-right: 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);
}
}

31
css/components/_mini-posts.scss

@ -1,31 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Mini Posts */
.mini-posts {
article {
border-top: solid 1px _palette(border);
margin-top: _size(element-margin);
padding-top: _size(element-margin);
.image {
display: block;
margin: 0 0 (_size(element-margin) * 0.75) 0;
img {
display: block;
width: 100%;
}
}
&:first-child {
border-top: 0;
margin-top: 0;
padding-top: 0;
}
}
}

179
css/components/_posts.scss

@ -1,179 +0,0 @@
///
/// Editorial by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///
/* Posts */
.posts {
$gutter: (_size(gutter) * 2);
@include vendor('display', 'flex');
@include vendor('flex-wrap', 'wrap');
margin: 0 0 _size(element-margin) ($gutter * -1);
width: calc(100% + #{$gutter});
article {
@include vendor('flex-grow', '0');
@include vendor('flex-shrink', '1');
margin: 0 0 $gutter $gutter;
position: relative;
width: calc(#{(100% / 3)} - #{$gutter});
&:before {
background: _palette(border);
content: '';
display: block;
height: calc(100% + #{$gutter});
left: ($gutter * -0.5);
position: absolute;
top: 0;
width: 1px;
}
&:after {
background: _palette(border);
bottom: ($gutter * -0.5);
content: '';
display: block;
height: 1px;
position: absolute;
right: 0;
width: calc(100% + #{$gutter});
}
> :last-child {
margin-bottom: 0;
}
.image {
display: block;
margin: 0 0 _size(element-margin) 0;
img {
display: block;
width: 100%;
}
}
}
@include breakpoint(xlarge-to-max) {
article {
&:nth-child(3n + 1) {
&:before {
display: none;
}
&:after {
width: 100%;
}
}
&:nth-last-child(1),
&:nth-last-child(2),
&:nth-last-child(3) {
margin-bottom: 0;
&:before {
height: 100%;
}
&:after {
display: none;
}
}
}
}
@include breakpoint(xlarge) {
article {
width: calc(50% - #{$gutter});
&:nth-last-child(3) {
margin-bottom: $gutter;
}
}
}
@include breakpoint(small-to-xlarge) {
article {
&:nth-child(2n + 1) {
&:before {
display: none;
}
&:after {
width: 100%;
}
}
&:nth-last-child(1),
&:nth-last-child(2) {
margin-bottom: 0;
&:before {
height: 100%;
}
&:after {
display: none;
}
}
}
}
@include breakpoint(small) {
$gutter: _size(gutter) * 1.5;
margin: 0 0 _size(element-margin) ($gutter * -1);
width: calc(100% + #{$gutter});
article {
margin: 0 0 $gutter $gutter;
width: calc(50% - #{$gutter});
&:before {
height: calc(100% + #{$gutter});
left: ($gutter * -0.5);
}
&:after {
bottom: ($gutter * -0.5);
width: calc(100% + #{$gutter});
}
&:nth-last-child(3) {
margin-bottom: $gutter;
}
}
}
@include breakpoint(xsmall) {
$gutter: _size(gutter) * 1.5;
margin: 0 0 _size(element-margin) 0;
width: 100%;
article {
margin: 0 0 $gutter 0;
width: 100%;
&:before {
display: none;
}
&:after {
width: 100%;
}
&:last-child {
margin-bottom: 0;
&:after {
display: none;
}
}
}
}
}

39
css/components/_section.scss

@ -1,39 +0,0 @@
///
/// Editorial 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 {
font-family: _font(family-heading);
font-size: 1em;
font-weight: _font(weight-heading-alt);
letter-spacing: _font(kerning-heading);
margin-top: -0.5em;
text-transform: uppercase;
}
&.major {
> :last-child {
border-bottom: solid 3px _palette(accent);
display: inline-block;
margin: 0 0 _size(element-margin) 0;
padding: 0 0.75em 0.5em 0;
}
}
&.main {
> :last-child {
margin: 0 0 (_size(element-margin) * 0.5) 0;
}
}
}

81
css/components/_table.scss

@ -1,81 +0,0 @@
///
/// Editorial 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 1px _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 2px _palette(border);