Ver Fonte

在app之后引入tailwindcss可以让tailwindcss样式覆盖elementui样式

Nivek há 2 anos atrás
pai
commit
46d8f1a124
3 ficheiros alterados com 9 adições e 7 exclusões
  1. 6 6
      src/components/Register.vue
  2. 1 1
      src/main.ts
  3. 2 0
      src/style.css

+ 6 - 6
src/components/Register.vue

@@ -82,16 +82,17 @@
 </script>
 
 <template>
-  <div class="bgimage h-fit w-full flex flex-col items-center justify-center px-6 py-6 space-y-10">
+
+  <div class="bgimage h-full w-full flex flex-col items-center justify-center px-6 py-6 space-y-10">
 
 
     <span class="flex items-center text-2xl font-semibold text-gray-900">
       Blue Whale Shopping Online
     </span>
 
-    <el-card class="w-3/5 min-w-max max-w-xl bg-white rounded-lg shadow-md ">
+    <el-card class="w-3/5 min-w-max max-w-xl bg-white rounded-lg shadow-md overflow-y-scroll">
 
-      <div class="p-6 space-y-4 ">
+      <div class="p-6 space-y-4 overflow-auto min-h-max">
 
         <h1 class="text-2xl font-bold leading-tight tracking-tight text-gray-900">
           创建一个新的账户
@@ -102,7 +103,7 @@
           <el-row class="flex flex-row justify-between">
 
             <el-col :span="15">
-              <el-form-item>
+              <el-form-item class="mb-0">
                 <label for="name" class="inline-block mb-2 text-sm font-medium text-gray-900">昵称</label>
                 <input id="name"
                        v-model="name"
@@ -113,7 +114,7 @@
 
 
             <el-col :span="8">
-              <el-form-item>
+              <el-form-item class="mb-0">
                 <label for="identity" class="block mb-2 text-sm font-medium text-gray-900">身份</label>
                 <select id="identity"
                         v-model="identity"
@@ -245,7 +246,6 @@
 
 
 <style scoped>
-
 .bgimage {
   background-image: url("../assets/shopping-1s-1084px.svg");
 }

+ 1 - 1
src/main.ts

@@ -1,7 +1,7 @@
 import { createApp } from 'vue'
-import './style.css'
 import {router} from './router'
 import App from './App.vue'
+import './style.css'
 import axios from 'axios'
 
 axios.defaults.baseURL = ("http://localhost:8080")

+ 2 - 0
src/style.css

@@ -20,6 +20,8 @@ html, body {
   height: 100%;
   display: flex;
   flex-direction: column;
+
+  @apply min-h-screen
 }
 
 @layer components {