fix: demos full css

[xiaoyatong]

🤔 这个变动的性质是？

• 新特性提交
• 日常 bug 修复
• 站点、文档改进
• 演示代码改进
• 组件样式/交互改进
• TypeScript 定义更新
• 包体积优化
• 性能优化
• 功能增强
• 国际化改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他改动（是关于什么的改动？）

🔗 相关 Issue

💡 需求背景和解决方案

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项。⚠️

• 文档已补充或无须补充
• 代码演示已提供或无须提供
• TypeScript 定义已补充或无须补充
• fork仓库代码是否为最新避免文件冲突
• Files changed 没有 package.json lock 等无关文件

Summary by CodeRabbit

• Style
  • 调整页面布局样式：移除了部分区域默认的顶部填充，使整体布局更为紧凑。
  • 新增针对拖动操作的专用样式，恢复了顶部空白以保持视图平衡。
  • 更新部分滚动区域的样式类，确保在不同环境下显示一致的布局效果。

[coderabbitai]

Walkthrough

本次提交主要针对样式文件以及部分组件代码进行了调整。在 CSS 文件中，将 .full 类的 top padding 从 57px 修改为 0，并新增 .drag-full 类以保留原有的 57px top padding。在组件文件中，针对 ScrollView 组件调整了 className 的赋值逻辑，确保在不同环境下正确应用样式类，部分组件新增了 full 类以统一样式设置。

Changes

文件	变更概述
packages/nutui-taro-demo/.../app.scss	修改 .full 类的 padding 从 57px 变为 0，新增 .drag-full 类设置 57px 0 0 0
src/packages/drag/demo.taro.tsx	调整 ScrollView 组件中条件判断，非 Web 环境时由 full 改为 drag-full 类
src/packages/{menu,tabs}/demo.taro.tsx	在 ScrollView 组件 className 中统一添加 full 类，确保在 Web 环境下 className 正确组合

Possibly related PRs

• fix(collapse): 去掉 demo 顶部留白 #3041: 处理 ScrollView 类名及 CSS 类修改，与本次提交在 className 处理上相似。
• fix: H5 小程序走查中遇到的问题修复 #3047: 涉及 .full 与 .drag-full 类样式调整，直接关联组件样式变更。
• chore(themes): output multiple themes #3020: 修改 body 元素样式并新增 .drag-full 类，与本次 CSS 及组件 className 的调整存在代码级对应。

Suggested reviewers

• oasis-cloud
• Alex-huxiyang

Poem

我是一只快乐的小兔子，
在代码森林里欢快跳跃，
.drag-full 与 .full 搭起彩虹桥，
逻辑简洁明了，格式妙不可言，
为这次改动吟唱一曲欢乐的诗篇 🐰🌸!

---

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between f50de3c and 3c88258.

📒 Files selected for processing (4)

• packages/nutui-taro-demo/src/app.scss (1 hunks)
• src/packages/drag/demo.taro.tsx (1 hunks)
• src/packages/menu/demo.taro.tsx (1 hunks)
• src/packages/tabs/demo.taro.tsx (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms (1)

• GitHub Check: test

🔇 Additional comments (5)

src/packages/menu/demo.taro.tsx (1)

42-44: 良好的样式调整，确保跨环境一致性

在 ScrollView 组件中添加 full 类，确保了不管是否在 WEB 环境下都会应用该样式类。这与 CSS 中的更改相匹配，使得样式更加一致。

src/packages/tabs/demo.taro.tsx (1)

90-90: 样式调整保持一致性

将 full 类应用到 ScrollView 组件，使其与其他组件（如 Menu）保持一致的样式处理。现在 full 类不再受环境判断影响，始终被应用。

src/packages/drag/demo.taro.tsx (1)

39-39: 正确应用了特定组件的样式类

将非 Web 环境下的类名从 full 改为 drag-full，与 CSS 文件中的更改相匹配。这样确保了拖拽组件在非 Web 环境下仍保持原有的顶部间距（57px）。

packages/nutui-taro-demo/src/app.scss (2)

28-28: 合理调整了 .full 类的样式

将 .full 类的 padding 从 57px 0 0 0 改为 0 0 0 0，移除了顶部的间距。这有助于统一组件的布局表现。

---

35-37: 新增 .drag-full 类保持特定组件的原有布局

添加了新的 .drag-full 类并保留了原有的顶部间距（57px），为需要保持原有顶部间距的组件（如拖拽组件）提供了专门的样式支持。这种方法既保持了向后兼容性，又允许其他组件使用新的样式。

✨ Finishing Touches

• 📝 Generate Docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai generate docstrings to generate docstrings for this PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 86.11%. Comparing base (f50de3c) to head (3c88258).
Report is 2 commits behind head on feat_v3.x.

Additional details and impacted files

@@            Coverage Diff             @@
##           feat_v3.x    #3051   +/-   ##
==========================================
  Coverage      86.11%   86.11%           
==========================================
  Files            283      283           
  Lines          18399    18399           
  Branches        2768     2768           
==========================================
  Hits           15845    15845           
  Misses          2549     2549           
  Partials           5        5           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.