-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
![]()
@@ -270,6 +323,12 @@ export default {
data() {
return {
author: localStorage.getItem('author'),
+ authorPadding: localStorage.getItem('authorPadding') ?? 0,
+ authorAlign: localStorage.getItem('authorAlign') ?? 'left',
+ authorTextColor: localStorage.getItem('authorTextColor') ?? 0,
+ authorMarginBottom: localStorage.getItem('authorMarginBottom') ?? 0,
+ authorBackgroundColor: localStorage.getItem('authorBackgroundColor') ?? '#000000',
+ authorBackgroundOpacity: localStorage.getItem('authorBackgroundOpacity') ?? 0,
heading: localStorage.getItem('heading'),
subheading: localStorage.getItem('subheading'),
headingAlign: localStorage.getItem('headingAlign') ?? 'left',
@@ -307,6 +366,24 @@ export default {
author(value) {
localStorage.setItem('author', value)
},
+ authorAlign(value) {
+ localStorage.setItem('authorAlign', value)
+ },
+ authorPadding(value) {
+ localStorage.setItem('authorPadding', value)
+ },
+ authorBackgroundColor(value) {
+ localStorage.setItem('authorBackgroundColor', value)
+ },
+ authorBackgroundOpacity(value) {
+ localStorage.setItem('authorBackgroundOpacity', value)
+ },
+ authorTextColor(value) {
+ localStorage.setItem('authorTextColor', value)
+ },
+ authorMarginBottom(value) {
+ localStorage.setItem('authorMarginBottom', value)
+ },
heading(value) {
localStorage.setItem('heading', value)
},
@@ -392,6 +469,40 @@ export default {
textAlign: this.headingAlign,
}
},
+ ogAuthorStyle() {
+ let background = 'none'
+
+ if (this.backgroundHover) {
+ const colors = hexToRgb(this.authorBackgroundColor)
+ background = `rgba(${colors.red}, ${colors.green}, ${colors.blue}, ${this.authorBackgroundOpacity})`
+ }
+
+ return {
+ textAlign: this.authorAlign,
+ color: this.authorTextColor,
+ marginBottom: `${this.authorMarginBottom}px`,
+ padding: `${this.authorPadding}px`,
+ marginLeft: `-${this.contentPadding}px`,
+ width: `calc(${this.contentPadding * 2}px + 100%)`,
+ background,
+ }
+ },
+ ogAuthorTextStyle() {
+ let value = {}
+
+ if (this.authorAlign === 'left') {
+ value.marginRight = 'auto !important'
+ } else if (this.authorAlign === 'center') {
+ value.marginLeft = 'auto !important'
+ value.marginRight = 'auto !important'
+ } else if (this.authorAlign === 'right') {
+ value.marginLeft = 'auto !important'
+ }
+
+ console.log(value, this.authorAlign)
+
+ return value
+ },
ogImageHoverStyle() {
let background = 'none'
@@ -407,7 +518,9 @@ export default {
},
ogContentStyle() {
return {
- padding: `${this.contentPadding}em`,
+ paddingTop: `${this.contentPadding}px`,
+ paddingRight: `${this.contentPadding}px`,
+ paddingLeft: `${this.contentPadding}px`,
}
},
downloadAsPng() {