REFACTOR: style var configuration

This commit is contained in:
ma-silva 2023-06-27 11:53:24 +08:00
parent 166ee307ab
commit 09bf77043a
3 changed files with 15 additions and 13 deletions

View File

@ -6,8 +6,8 @@ VITE_OBP_CONSUMER_KEY=your_consumer_key
VITE_OBP_CONSUMER_SECRET=your_consumer_secret
VITE_OBP_REDIRECT_URL=http://localhost:5173/api/callback
# Product styling setting
#VITE_OBP_PRODUCT_LINKS_COLOR="#3665c7"
#VITE_OBP_PRODUCT_HEADER_LINKS_COLOR="#ffffff"
#VITE_OBP_PRODUCT_HEADER_LINKS_HOVER_COLOR="#ffffff"
#VITE_OBP_PRODUCT_HEADER_LINKS_BACKGROUND_COLOR="#f8b81e"
#VITE_OBP_PRODUCT_LOGO_SOURCE=https://static.openbankproject.com/xsquare/img/xsquare.jpg
#VITE_OBP_LINKS_COLOR="#52b165"
#VITE_OBP_HEADER_LINKS_COLOR="#39455f"
#VITE_OBP_HEADER_LINKS_HOVER_COLOR="#39455f"
#VITE_OBP_HEADER_LINKS_BACKGROUND_COLOR="#eef0f4"
#VITE_OBP_LOGO_URL=https://static.openbankproject.com/images/obp_logo.png

View File

@ -1,9 +1,11 @@
<script setup lang="ts">
import { ArrowDown } from '@element-plus/icons-vue'
import { inject } from 'vue'
import { searchLinksColor as searchLinksColorSetting} from '../obp/style-setting'
import { inject, ref } from 'vue'
const i18n = inject('i18n')
const host = inject('OBP-API-Host')
const searchLinksColor = ref(searchLinksColorSetting)
const handleLocale = (command: string) => {
i18n.global.locale.value = command
}
@ -50,7 +52,7 @@ a {
text-decoration: none;
}
a:hover {
color: #52b165;
color: v-bind(searchLinksColor);
}
.host {
font-size: 14px;

View File

@ -1,15 +1,15 @@
//Logo
export const logo = import.meta.env.VITE_OBP_PRODUCT_LOGO_SOURCE
export const logo = import.meta.env.VITE_OBP_LOGO_URL
//Header styles
export const headerLinksColor = import.meta.env.VITE_OBP_PRODUCT_HEADER_LINKS_COLOR || '#39455f'
export const headerLinksColor = import.meta.env.VITE_OBP_HEADER_LINKS_COLOR || '#39455f'
export const headerLinksHoverColor =
import.meta.env.VITE_OBP_PRODUCT_HEADER_LINKS_HOVER_COLOR || '#39455f'
import.meta.env.VITE_OBP_HEADER_LINKS_HOVER_COLOR || '#39455f'
export const headerLinksBackgroundColor =
import.meta.env.VITE_OBP_PRODUCT_HEADER_LINKS_BACKGROUND_COLOR || '#eef0f4'
import.meta.env.VITE_OBP_HEADER_LINKS_BACKGROUND_COLOR || '#eef0f4'
//Search nav styles
export const searchLinksColor = import.meta.env.VITE_OBP_PRODUCT_LINKS_COLOR || '#52b165'
export const searchLinksColor = import.meta.env.VITE_OBP_LINKS_COLOR || '#52b165'
//Content summary styles
export const summaryPagerLinksColor = import.meta.env.VITE_OBP_PRODUCT_LINKS_COLOR || '#52b165'
export const summaryPagerLinksColor = import.meta.env.VITE_OBP_LINKS_COLOR || '#52b165'