Fix capsule-aligned navigation and refresh mini program typography

pets-fe/pages/pet-edit/pet-edit.wxml

@@ -1,13 +1,9 @@
-<scroll-view class="page-scroll" scroll-y="{{true}}" enhanced="{{true}}" show-scrollbar="{{false}}">
+<page-layout id="page-layout" title="{{id?'编辑档案':'认识新朋友'}}" back="{{true}}">
 <view class="screen">
-  <safe-top />
-  <page-back />
-  <view class="eyebrow">PET PROFILE</view>
-  <view class="title">{{id?'编辑档案':'认识新朋友'}}</view>
   <view class="photo" bindtap="choose">
     <image wx:if="{{avatar_url}}" src="{{avatar_url}}" mode="aspectFill" />
-    <text wx:else>🐕</text>
-    <view>点击上传照片</view>
+    <app-icon wx:else size="70" />
+    <view class="photo-caption">点击上传照片</view>
   </view>
   <view class="field">
     <view class="field-label">名字 *</view>
@@ -20,7 +16,7 @@
   </view>
   <view class="field">
     <view class="field-label">品种</view>
-    <input value="{{breed}}" data-key="breed" bindinput="field" />
+    <input placeholder="填写它的品种" value="{{breed}}" data-key="breed" bindinput="field" />
   </view>
   <view class="field">
     <view class="field-label">性别</view>
@@ -65,4 +61,4 @@
   <button class="primary" bindtap="save" disabled="{{saving}}">保存档案</button>
   <button wx:if="{{id}}" class="archive" bindtap="archive">归档这只宠物</button>
 </view>
-</scroll-view>
+</page-layout>