diff --git a/src/assets/scss/_settings.scss b/src/assets/scss/_settings.scss
index fb2f2fd..9332f8e 100644
--- a/src/assets/scss/_settings.scss
+++ b/src/assets/scss/_settings.scss
@@ -92,7 +92,7 @@ $body-background: $white;
$body-font-color: $black;
$body-font-family: worksans-medium, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
$body-antialiased: true;
-$global-margin: 1rem;
+$global-margin: 2rem;
$global-padding: 1rem;
$global-position: 1rem;
$global-weight-normal: normal;
@@ -248,13 +248,13 @@ $accordion-plusminus: true;
$accordion-plus-content: '\002B';
$accordion-minus-content: '\2013';
$accordion-title-font-size: rem-calc(12);
-$accordion-item-color: $primary-color;
-$accordion-item-background-hover: $light-gray;
-$accordion-item-padding: 1.25rem 1rem;
+$accordion-item-color: $body-font-color;
+$accordion-item-background-hover: none;
+$accordion-item-padding: $global-padding*1.5 0;
$accordion-content-background: $white;
-$accordion-content-border: 1px solid $light-gray;
+$accordion-content-border: none;
$accordion-content-color: $body-font-color;
-$accordion-content-padding: 1rem;
+$accordion-content-padding: $global-padding*1.5 0;
// 8. Accordion Menu
// -----------------
@@ -304,8 +304,8 @@ $breadcrumbs-item-separator-color: $medium-gray;
$button-font-family: inherit;
$button-font-weight: null;
$button-font-variant: all-petite-caps;
-$button-padding: 1em 2em;
-$button-margin: 0 0 $global-margin 0;
+$button-padding: $global-padding $global-padding*3;
+$button-margin: 0;
$button-fill: solid;
$button-background: $primary-color;
$button-background-hover: scale-color($button-background, $lightness: -15%);
@@ -317,8 +317,8 @@ $button-hollow-border-width: 2px;
$button-sizes: (
tiny: 0.6rem,
small: 0.75rem,
- default: 0.9rem,
- large: 1.25rem,
+ default: 1.2rem,
+ large: 1.5rem,
);
$button-palette: $foundation-palette;
$button-opacity-disabled: 0.25;
@@ -363,7 +363,7 @@ $card-border: none;
$card-shadow: none;
$card-border-radius: $global-radius;
$card-padding: $global-padding*4;
-$card-margin-bottom: $global-margin;
+$card-margin-bottom: $global-margin*2;
// 15. Close Button
// ----------------
diff --git a/src/assets/scss/app.scss b/src/assets/scss/app.scss
index 5a93850..df1e934 100644
--- a/src/assets/scss/app.scss
+++ b/src/assets/scss/app.scss
@@ -79,6 +79,8 @@
// Componentes
@import "components/cards";
+@import "components/buttons";
+@import "components/accordion";
// Templates
//@import "templates/front";
diff --git a/src/assets/scss/components/_accordion.scss b/src/assets/scss/components/_accordion.scss
new file mode 100644
index 0000000..88f3fc0
--- /dev/null
+++ b/src/assets/scss/components/_accordion.scss
@@ -0,0 +1,16 @@
+.accordion-item {
+ border-bottom: 1px solid $body-font-color;
+}
+.accordion-title {
+ ul,ol {
+ list-style: none;
+ //@include flex;
+ //@include flex-align(justify,middle);
+ @include xy-grid;
+ }
+ li {
+ display:inline;
+ @include xy-cell(3);
+ text-align:left;
+ }
+}
diff --git a/src/assets/scss/components/_buttons.scss b/src/assets/scss/components/_buttons.scss
new file mode 100644
index 0000000..a3a2f79
--- /dev/null
+++ b/src/assets/scss/components/_buttons.scss
@@ -0,0 +1,14 @@
+button,.button {
+ min-width: 20rem;
+}
+.hero {
+ button,.button {
+ color: $button-color-alt;
+ border-color: $button-color-alt;
+// margin: $global-margin*2 0;
+ &:hover{
+ color: $anchor-color;
+ border-color: $anchor-color;
+ }
+ }
+}
diff --git a/src/assets/scss/modules/_content.scss b/src/assets/scss/modules/_content.scss
index 3676db3..8db816a 100644
--- a/src/assets/scss/modules/_content.scss
+++ b/src/assets/scss/modules/_content.scss
@@ -8,20 +8,17 @@
.news {
@include xy-grid;
- margin: $global-margin*2 0;
- header {
+ header,main,aside {
@include xy-cell(12);
@include flex;
- @include flex-align(center,middle);
+ @include flex-align(center,top);
+ padding: $global-padding*3 0;
}
main {
- @include xy-cell(12);
+ //@include xy-cell(12);
@include xy-grid;
article{
text-align:center;
- > *{
- padding: $global-padding/2 0;
- }
@include card-container();
@include breakpoint(small){
@include xy-cell(12);
@@ -34,6 +31,44 @@
}
}
}
+ aside {
+ }
+ }
+ // end news category
+
+
+ //
+ // collections category
+ //--------------
+
+ .collections-list {
+ @include xy-grid;
+ header,main,aside {
+ @include xy-cell(12);
+ @include flex;
+ @include flex-align(center,top);
+ padding: $global-padding*3 0;
+ }
+ header {
+ border-top: 1px solid $body-font-color;
+ padding: $global-padding*4 0;
+ }
+ main {
+ @include xy-grid;
+ article{
+ text-align:center;
+ @include card-container();
+ @include breakpoint(small){
+ @include xy-cell();
+ }
+ @include breakpoint(medium){
+ }
+ @include breakpoint(large){
+ }
+ }
+ }
+ aside {
+ }
}
// end news category
@@ -46,38 +81,43 @@
$hero-padding: $global-padding * 3;
.hero {
- margin-bottom: $hero-padding;
border-top: 2px solid $primary-color;
background-color: $primary-color;
.slide {
- @include xy-grid();
- .claim, figure {
- @include breakpoint(small){
- @include xy-cell(full);
- }
- @include breakpoint(medium){
- @include xy-cell(auto);
- @include xy-cell-gutters(0,margin);
- @include flex;
- @include flex-align(center,middle);
- }
- padding: $hero-padding;
+ @include xy-grid();
+ .claim, figure {
+ @include breakpoint(small){
+ @include xy-cell(full);
}
- .claim{
- color: $white;
- //font-variant: all-small-caps;
- @include breakpoint(medium){
+ @include breakpoint(medium){
+ @include xy-cell(auto);
+ @include xy-cell-gutters(0,margin);
+ @include flex;
+ @include flex-align(center,middle);
+ }
+ padding: $hero-padding;
+ }
+ .claim{
+ color: $white;
+ @include xy-grid;
+ @include breakpoint(medium) {
font-size: $lead-font-size;
}
+ > * {
+ @include xy-cell(full);
+ @include flex;
+ @include flex-align(center,bottom);
+
}
- figure {
- background-color: $white;
+ }
+ figure {
+ background-color: $white;
.logo {
- @include breakpoint(medium){
- max-width: 80%;
- }
+ @include breakpoint(medium){
+ max-width: 80%;
}
}
+ }
}
aside {
@include xy-grid();
@@ -86,33 +126,21 @@ $hero-padding: $global-padding * 3;
@include xy-cell(auto);
@include flex;
@include flex-align(spaced,middle);
- min-height: 5rem;
- button.archive-secondary {
- //font-variant:all-small-caps;
- color: $black;
- border-color: $black;
- margin: 0;
- padding: $global-padding*1.2 $global-padding*5;
- &:hover{
- color: $anchor-color;
- border-color: $anchor-color;
- }
+ min-height: 8rem;
}
}
- }
//hero secondary
&.secondary {
border-top: none;
background-color: $secondary-color;
- min-height: 10vh;
- .slide{
- .claim {
- color: $body-font-color;
- }
- figure {
- background-color: unset;
- }
+ .slide{
+ .claim {
+ color: $body-font-color;
}
+ figure {
+ background-color: unset;
+ }
+ }
}
}
//end hero
diff --git a/src/assets/scss/modules/_header.scss b/src/assets/scss/modules/_header.scss
index c463189..40d0939 100644
--- a/src/assets/scss/modules/_header.scss
+++ b/src/assets/scss/modules/_header.scss
@@ -10,9 +10,6 @@
@include xy-cell(auto);
@include flex;
@include flex-align(right, middle);
- //font-variant:all-small-caps;
- //.menu, .menu-horizontal {
- //}
a, button {
color: $black;
&:hover {
diff --git a/src/partials/section-collections-latest.html b/src/partials/section-collections-latest.html
index e69de29..e8ee7b3 100644
--- a/src/partials/section-collections-latest.html
+++ b/src/partials/section-collections-latest.html
@@ -0,0 +1,66 @@
+ Latest in collections
+