优化移动端样式
This commit is contained in:
27
src/App.vue
27
src/App.vue
@@ -232,24 +232,39 @@ body {
|
|||||||
@apply !bg-white !border-slate-200 !shadow-xl !rounded-lg !left-4 md:!left-6 !bottom-28 md:!bottom-6 !transition-all;
|
@apply !bg-white !border-slate-200 !shadow-xl !rounded-lg !left-4 md:!left-6 !bottom-28 md:!bottom-6 !transition-all;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767px) {
|
||||||
|
.vue-flow__controls {
|
||||||
|
margin-left: 0 !important;
|
||||||
|
left: 1rem !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.vue-flow__controls-button {
|
.vue-flow__controls-button {
|
||||||
@apply !border-slate-100 !fill-slate-400 hover:!bg-slate-50 !transition-colors;
|
@apply !border-slate-100 !fill-slate-400 hover:!bg-slate-50 !transition-colors;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vue-flow__minimap {
|
.vue-flow__minimap {
|
||||||
@apply !bg-white/80 !backdrop-blur-md !border-slate-200 !shadow-2xl !rounded-xl !overflow-hidden !transition-all;
|
@apply !bg-white/80 !backdrop-blur-md !border-slate-200 !shadow-2xl !rounded-xl !overflow-hidden !transition-all;
|
||||||
margin: 1.5rem !important;
|
bottom: 130px !important;
|
||||||
bottom: 80px !important;
|
right: 1rem !important;
|
||||||
right: 0 !important;
|
width: 140px !important;
|
||||||
width: 180px !important;
|
height: 100px !important;
|
||||||
height: 120px !important;
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vue-flow__minimap svg {
|
||||||
|
display: block !important;
|
||||||
|
width: 100% !important;
|
||||||
|
height: 100% !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 768px) {
|
@media (min-width: 768px) {
|
||||||
.vue-flow__minimap {
|
.vue-flow__minimap {
|
||||||
bottom: 0 !important;
|
bottom: 1.5rem !important;
|
||||||
|
right: 1.5rem !important;
|
||||||
width: 220px !important;
|
width: 220px !important;
|
||||||
height: 160px !important;
|
height: 160px !important;
|
||||||
|
margin: 0 !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -6,7 +6,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
// 图标:输入提示与执行态
|
// 图标:输入提示与执行态
|
||||||
import { RefreshCw, Terminal, Zap } from 'lucide-vue-next'
|
import { Github, RefreshCw, Terminal, Zap } from 'lucide-vue-next'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* props:
|
* props:
|
||||||
@@ -54,5 +54,19 @@ const emit = defineEmits<{
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-center gap-2 px-3 py-1 bg-white/60 backdrop-blur-sm border border-slate-200/50 rounded-full text-[10px] font-black tracking-widest uppercase select-none shadow-sm">
|
||||||
|
<a
|
||||||
|
href="https://github.com/liu-ziting/ThinkFlowAI"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
class="flex items-center gap-1.5 text-slate-500 hover:text-orange-500 transition-colors"
|
||||||
|
>
|
||||||
|
<Github class="w-3 h-3" />
|
||||||
|
<span>ThinkFlowAI</span>
|
||||||
|
</a>
|
||||||
|
<span class="w-[1px] h-2 bg-slate-300 mx-1"></span>
|
||||||
|
<span class="text-slate-400">By:Liuziting</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -4,8 +4,8 @@ import zh from './locales/zh.json'
|
|||||||
|
|
||||||
const i18n = createI18n({
|
const i18n = createI18n({
|
||||||
legacy: false, // 使用 Composition API
|
legacy: false, // 使用 Composition API
|
||||||
locale: localStorage.getItem('language') || 'en', // 默认英文
|
locale: localStorage.getItem('language') || 'zh', // 默认英文
|
||||||
fallbackLocale: 'en',
|
fallbackLocale: 'zh',
|
||||||
messages: {
|
messages: {
|
||||||
en,
|
en,
|
||||||
zh
|
zh
|
||||||
|
|||||||
Reference in New Issue
Block a user