diff --git a/.postcssrc b/.postcssrc
index bcd4ab8f1..1b70a9990 100644
--- a/.postcssrc
+++ b/.postcssrc
@@ -5,7 +5,7 @@
"postcss-import-url": { "modernBrowser": true },
"postcss-url": { "url": "rebase" },
"postcss-mixins": {
- "mixinsDir": "src/designa/mixins"
+ "mixinsDir": "src/shared/styles/mixins"
},
"postcss-custom-selectors": {
"importFrom": "src/selectors.css"
diff --git a/src/designa/mixins/list-separated.css b/src/shared/styles/mixins/list-separated.css
similarity index 86%
rename from src/designa/mixins/list-separated.css
rename to src/shared/styles/mixins/list-separated.css
index 59edfd212..0b04b4153 100644
--- a/src/designa/mixins/list-separated.css
+++ b/src/shared/styles/mixins/list-separated.css
@@ -2,7 +2,7 @@
Display a `
` or `` as an inline list of items
separated by some content `$separator`
*/
-@define-mixin list-separated $separator: ', ' {
+@define-mixin list-inline $separator: ', ' {
display: inline;
list-style: none;
margin: 0;
diff --git a/src/designa/Article.css b/src/shared/styles/types/Article.css
similarity index 92%
rename from src/designa/Article.css
rename to src/shared/styles/types/Article.css
index d976c569d..192f155a7 100644
--- a/src/designa/Article.css
+++ b/src/shared/styles/types/Article.css
@@ -2,7 +2,7 @@
@import './Person.css';
:--Article {
- @mixin CreativeWork;
+ @extend: --CreativeWork;
max-width: var(--article-content-max-width);
margin-left: auto;
diff --git a/src/designa/mixins/CreativeWork.css b/src/shared/styles/types/CreativeWork.css
similarity index 60%
rename from src/designa/mixins/CreativeWork.css
rename to src/shared/styles/types/CreativeWork.css
index ee75c7c4c..e8fcb8446 100644
--- a/src/designa/mixins/CreativeWork.css
+++ b/src/shared/styles/types/CreativeWork.css
@@ -1,12 +1,9 @@
-/*
- A mixin for nodes that extend `CreativeWork` (e.g. `Article`, `Figure`).
-*/
-@define-mixin CreativeWork {
+:--CreativeWork {
/*
`authors` property: a comma separated list of authors
*/
:--authors {
- @mixin list-separated;
+ @mixin list-inline;
}
:--references > :--CreativeWork {
diff --git a/src/designa/Entity.css b/src/shared/styles/types/Entity.css
similarity index 100%
rename from src/designa/Entity.css
rename to src/shared/styles/types/Entity.css
diff --git a/src/designa/Person.css b/src/shared/styles/types/Person.css
similarity index 95%
rename from src/designa/Person.css
rename to src/shared/styles/types/Person.css
index 0b2e11c02..7f801dfe2 100644
--- a/src/designa/Person.css
+++ b/src/shared/styles/types/Person.css
@@ -35,7 +35,7 @@
the email address/es (leave that to web component).
*/
:--emails {
- @mixin list-separated;
+ @mixin list-inline;
order: 2;
@@ -56,7 +56,7 @@
of integer links.
*/
:--affiliations {
- @mixin list-separated;
+ @mixin list-inline;
order: 3;
diff --git a/src/themes/nature/styles.css b/src/themes/nature/styles.css
index 6b1a0253b..2b5f5d583 100644
--- a/src/themes/nature/styles.css
+++ b/src/themes/nature/styles.css
@@ -1,4 +1,5 @@
@import '../../shared/styles/shared.css';
+@import '../../shared/styles/types/Person.css';
@import 'prismjs/themes/prism.css';
@import '../../shared/fonts/lora/lora.css';
@import '../../shared/fonts/sourceSansPro/sourceSansPro.css';
@@ -422,10 +423,6 @@ blockquote {
}
}
-/* Microdata-based Styles */
-@import '../../designa/Entity.css';
-@import '../../designa/Person.css';
-
:--Article {
> :--headline {
padding-left: 50px;
@@ -440,13 +437,13 @@ blockquote {
:--authors,
:--organizations {
- @mixin list-separated;
+ @mixin list-inline;
display: block;
}
:--organizations {
- @mixin list-separated '; ';
+ @mixin list-inline '; ';
:--Organization > * {
display: inline;
diff --git a/src/themes/plos/styles.css b/src/themes/plos/styles.css
index ee6362ca3..a46d26ac6 100644
--- a/src/themes/plos/styles.css
+++ b/src/themes/plos/styles.css
@@ -1,6 +1,7 @@
@import '../../shared/styles/shared.css';
@import 'prismjs/themes/prism.css';
@import '../../shared/fonts/openSans/openSans.css';
+@import '../../shared/styles/types/Person.css';
:root {
--max-width: 650px;
@@ -19,10 +20,6 @@
--bg-color: #fff;
}
-/* Microdata-based Styles */
-@import '../../designa/Entity.css';
-@import '../../designa/Person.css';
-
:--Article {
> :--headline + div {
max-width: var(--max-width);
@@ -32,11 +29,11 @@
line-height: normal;
:--authors {
- @mixin list-separated;
+ @mixin list-inline;
}
:--organizations {
- @mixin list-separated '; ';
+ @mixin list-inline '; ';
margin-top: 1.25rem;
display: block;