宠物界面
Change-Id: I2dd7341009685f4daac87fa0a848032b1d0c1e42
diff --git a/src/components/pet/pet.module.css b/src/components/pet/pet.module.css
new file mode 100644
index 0000000..833729a
--- /dev/null
+++ b/src/components/pet/pet.module.css
@@ -0,0 +1,71 @@
+/* 外部容器：左右布局 */
+.wrapper {
+ background:none;
+ border:none;
+ box-shadow: none;
+ display: flex;
+ align-items: flex-start;
+ justify-content: center;
+ padding: 40px;
+ gap: 60px;
+}
+
+/* 宠物区域 */
+.petSection {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.petImage {
+ width: 200px;
+ height: 200px;
+ object-fit: cover;
+ cursor: pointer;
+ margin-bottom: 12px;
+}
+
+/* 卡片区域：紧跟宠物图下方，模拟右下角 */
+.cardContainer {
+ align-self: flex-end; /* 让它贴底部对齐 */
+ width: 280px;
+}
+
+.card {
+
+ border-radius: 16px;
+
+ padding: 20px;
+}
+
+.text {
+ font-size: 16px;
+ margin: 12px 0;
+ color: #333;
+}
+
+.feedButton {
+ width: 100%;
+ padding: 12px;
+ font-size: 16px;
+ background-color: #ff9800;
+ color: white;
+ border: none;
+ border-radius: 10px;
+ cursor: pointer;
+ margin: 16px 0;
+ transition: background-color 0.2s;
+}
+
+.feedButton:hover {
+ background-color: #fb8c00;
+}
+
+.switchSection {
+ margin-top: 20px;
+}
+
+.switchTitle {
+ font-weight: 600;
+ font-size: 14px;
+}