样式修改

zhaoxing

2023-05-13 9563b1b03728efbccf66c59d4deb83c4a83ebafc

 pages/index/write.vue

@@ -1,7 +1,7 @@
<template>
   <view>
      <!-- #ifndef H5 -->
      <u-navbar placeholder title="AI解答">
      <u-navbar placeholder title="AI创作教学">
      </u-navbar>
      <!-- #endif -->
      <view class="">
@@ -10,36 +10,36 @@
               height="234rpx"></u--image>
            <view class="content-wrap">
               <view class="content">
                  <view class="text-bold text-xxl">AI创作</view>
                  <view class="text-bold text-xxl">AI创作教学</view>
                  <view class="text-bold text-lg padding-top-xs">启发灵感，专注创造</view>
               </view>
               <!-- <button class="cu-btn bg-gradual-orange round">我的创作</button> -->
            </view>
         </view>
         <view class="cu-bar text-cyan">
         <view class="cu-bar text-green">
            <view class="action">
               <text class="text-cyan"></text>
               <text class="text-green"></text>
               <text class="text-lg text-bold">创作类型</text>
            </view>
         </view>
         <view class="padding-lr">
            <u-input v-model="title" placeholder="输入需要AI为你创作的文本类型,如:小红书文案" />
            <u-input v-model="title" class="input-text" placeholder="输入需要AI为你创作的文本类型,如:小红书文案" />
         </view>
         <view class="cu-bar text-cyan padding-right">
         <view class="cu-bar text-green padding-right">
            <view class="action">
               <text class="text-cyan"></text>
               <text class="text-green"></text>
               <text class="text-lg text-bold">主要内容</text>
            </view>
            <button @click="submit" class="cu-btn line-blue radius text-bold">提交</button>
         </view>
         <view class="padding-lr ">
         <view class="input-btn">
            <u--textarea height="90" v-model="desc"
               placeholder="输入需要AI为你创作的文本主要内容及要求,如:一个关于戒指的小红书产品文案，要求以网红种草博主的口吻，博主身份为网红女生，文案中最好多带一些emoji表情"
               :adjustPosition="false"></u--textarea>
            <button @click="submit" class="btn">提 交</button>
         </view>
         <view class="cu-bar text-cyan padding-right">
         <view class="cu-bar text-green padding-right">
            <view class="action">
               <text class="text-cyan"></text>
               <text class="text-green"></text>
               <text class="text-lg text-bold">AI创作</text>
            </view>
            <view class="flex" v-if="answerStatus == 2">
@@ -53,15 +53,15 @@
               <zero-markdown-view style="padding: 0;" :markdown="answer"></zero-markdown-view>
            </view>
         </view>
         <!-- <view class="cu-bar text-cyan">
         <!-- <view class="cu-bar text-green">
            <view class="action">
               <text class="text-cyan"></text>
               <text class="text-green"></text>
               <text class="text-lg text-bold">常用模板</text>
            </view>
         </view> -->
         <!-- <view class="padding-lr">
            <view v-for="item in write_template" :key="item.write_template_id">
               <view class="flex align-center text-cyan text-df">
               <view class="flex align-center text-green text-df">
                  <view class="icon-tagfill"></view>
                  <view class="text-bold">{{item.title}}</view>
               </view>
@@ -291,7 +291,44 @@
   }
</script>

<style>
   .uni-input-input{
      color: #fff !important;
   }
</style>

<style lang="scss">
   .input-text{
      border-radius: 22rpx;
      background: #30324f;
      border: none;
      padding: 20rpx 24rpx !important;
      margin-bottom: 20rpx;
      color: #fff;
   }
   .input-btn{
      background: #30324f;
      margin: 0 30rpx 20rpx 30rpx;
      border-radius: 22rpx;
      overflow: hidden;
		
      .u-textarea--radius{
         border-radius: 0 0 22rpx 22rpx;
         border: none;
         font-size: 26rpx;
         padding: 24rpx;
      }
		
      .btn{
         width: 100%;
         border-radius: 0;
         background: #30324f;
         color: #01e681;
         border: none;
         height: 80rpx;
         line-height: 74rpx;
      }
   }
   .topbg {
      position: relative;

@@ -299,8 +336,8 @@
         position: absolute;
         top: 0;
         left: 0;
         width: 750rpx;
         height: 234rpx;
         width: 100vw;
         height: calc(100vw * 0.32);
         background-color: rgba(0, 0, 0, 0.39);

         .content {
@@ -321,8 +358,6 @@

<style>
   @import url("@/static/style/color-ui.css");



   .template-card {
      background: #30324F;
@@ -375,7 +410,7 @@
   .anser-area {
      color: #93949D;
      background: #30324F;
      border-radius: 32rpx;
      border-radius: 22rpx;
      padding: 24rpx;
      min-height: 120px;
   }