Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(button): using new style #993

Merged
merged 1 commit into from
Nov 9, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
196 changes: 19 additions & 177 deletions src/button/__test__/__snapshots__/demo.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -6,115 +6,45 @@ exports[`Button Button base demo works fine 1`] = `
class="box"
>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
size="large"
theme="primary"
>
强按钮
主按钮
</t-button>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
theme="primary"
variant="outline"
size="large"
theme="light"
>
弱按钮
浅按钮
</t-button>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
variant="outline"
size="large"
>
次按钮
默认按钮
</t-button>
<wx-view
style="height: 32rpx"
/>
<t-button
block="{{true}}"
disabled="{{false}}"
icon="app"
tClass="external-class"
size="large"
theme="primary"
variant="outline"
>
带图标按钮
描边按钮
</t-button>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
theme="danger"
>
强告警按钮
</t-button>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
theme="danger"
variant="outline"
>
弱告警按钮
</t-button>
</wx-view>
<wx-view
class="full-width"
>
<wx-view
class="box"
>
<t-button
block="{{true}}"
disabled="{{false}}"
ghost="{{true}}"
tClass="external-class"
>
幽灵按钮
</t-button>
</wx-view>
</wx-view>
<wx-view
class="box"
>
<t-button
block="{{true}}"
disabled="{{false}}"
tClass="external-class"
size="large"
theme="primary"
variant="text"
>
文字按钮
</t-button>
</wx-view>
<t-button
block="{{true}}"
disabled="{{false}}"
size="large"
tClass="external-class no-border-radius"
theme="primary"
>
通栏按钮
</t-button>
<t-button-group>
<t-button
block="{{true}}"
disabled="{{false}}"
size="large"
tClass="external-class no-border-radius no-border"
>
次按钮
</t-button>
<t-button
block="{{true}}"
disabled="{{false}}"
size="large"
tClass="external-class no-border-radius"
theme="primary"
>
主按钮
</t-button>
</t-button-group>
</base>
`;

Expand All @@ -124,56 +54,42 @@ exports[`Button Button icon-btn demo works fine 1`] = `
class="box"
>
<t-button
content="带图标按钮"
disabled="{{false}}"
content="填充按钮"
icon="app"
tClass="external-class"
theme="primary"
/>
<t-button
disabled="{{false}}"
icon="app"
shape="round"
tClass="external-class"
theme="primary"
>
<wx-text>
带图标按钮
</wx-text>
带图标按钮
</t-button>
</wx-view>
<wx-view
class="box"
>
<t-button
disabled="{{false}}"
icon="app"
shape="square"
tClass="external-class"
theme="primary"
/>
<t-button
disabled="{{false}}"
icon="app"
shape="circle"
tClass="external-class"
theme="primary"
/>
</wx-view>
<wx-view
class="box"
>
<t-button
disabled="{{false}}"
loading="{{true}}"
shape="square"
tClass="external-class"
theme="primary"
/>
<t-button
disabled="{{false}}"
loading="{{true}}"
tClass="external-class"
theme="primary"
>
加载中...
Expand All @@ -192,99 +108,25 @@ exports[`Button Button size demo works fine 1`] = `
tClass="external-class"
theme="primary"
>
按钮 44
大号按钮 44
</t-button>
<t-button
tClass="external-class"
theme="primary"
>
按钮 40
</t-button>
<t-button
size="small"
tClass="external-class"
theme="primary"
>
按钮 36
中号按钮 40
</t-button>
</wx-view>
<wx-view
class="box align-bottom"
class="box"
>
<t-button
icon="app"
shape="round"
size="large"
tClass="external-class"
theme="primary"
>
按钮
</t-button>
<t-button
icon="app"
shape="round"
tClass="external-class"
theme="primary"
>
按钮
</t-button>
<t-button
icon="app"
shape="round"
size="small"
tClass="external-class"
theme="primary"
>
按钮
小号按钮 36
</t-button>
</wx-view>
<wx-view
class="box align-bottom"
>
<t-button
icon="app"
shape="square"
size="large"
tClass="external-class"
theme="primary"
/>
<t-button
icon="app"
shape="square"
tClass="external-class"
theme="primary"
/>
<t-button
icon="app"
shape="square"
size="small"
tClass="external-class"
theme="primary"
/>
</wx-view>
<wx-view
class="box align-bottom"
>
<t-button
icon="app"
shape="circle"
size="large"
tClass="external-class"
theme="primary"
/>
<t-button
icon="app"
shape="circle"
tClass="external-class"
theme="primary"
/>
<t-button
icon="app"
shape="circle"
size="small"
tClass="external-class"
theme="primary"
/>
</wx-view>
</size>
`;
37 changes: 6 additions & 31 deletions src/button/_example/base/index.wxml
Original file line number Diff line number Diff line change
@@ -1,33 +1,8 @@
<view class="box">
<t-button t-class="external-class" theme="primary" block disabled="{{disabled}}">强按钮</t-button>
<t-button t-class="external-class" theme="primary" variant="outline" block disabled="{{disabled}}">弱按钮</t-button>
<t-button t-class="external-class" variant="outline" block disabled="{{disabled}}">次按钮</t-button>
<t-button t-class="external-class" theme="primary" icon="app" variant="outline" block disabled="{{disabled}}"
>带图标按钮</t-button
>
<t-button t-class="external-class" theme="danger" block disabled="{{disabled}}">强告警按钮</t-button>
<t-button t-class="external-class" theme="danger" variant="outline" block disabled="{{disabled}}"
>弱告警按钮</t-button
>
<t-button theme="primary" size="large" disabled="{{disabled}}">主按钮</t-button>
<t-button theme="light" size="large" disabled="{{disabled}}">浅按钮</t-button>
<t-button size="large" disabled="{{disabled}}">默认按钮</t-button>
<view style="height: 32rpx" />
<t-button theme="primary" size="large" variant="outline" disabled="{{disabled}}">描边按钮</t-button>
<t-button theme="primary" size="large" variant="text" disabled="{{disabled}}">文字按钮</t-button>
</view>

<view class="full-width">
<view class="box">
<t-button t-class="external-class" ghost block disabled="{{disabled}}">幽灵按钮</t-button>
</view>
</view>

<view class="box">
<t-button t-class="external-class" theme="primary" variant="text" block disabled="{{disabled}}">文字按钮</t-button>
</view>
<t-button t-class="external-class no-border-radius" theme="primary" size="large" block disabled="{{disabled}}"
>通栏按钮</t-button
>
<t-button-group>
<t-button t-class="external-class no-border-radius no-border" size="large" block disabled="{{disabled}}"
>次按钮</t-button
>
<t-button t-class="external-class no-border-radius" theme="primary" size="large" block disabled="{{disabled}}"
>主按钮</t-button
>
</t-button-group>
6 changes: 3 additions & 3 deletions src/button/_example/base/index.wxss
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@
margin: 0 32rpx;
}

.external-class {
margin-top: 32rpx;
.box t-button + t-button {
margin-left: 32rpx;
}

.full-width {
background: rgba(0, 0, 0, 0.4);
background: #181818;
padding: 16rpx 0;
margin-top: 32rpx;
}
Expand Down
1 change: 1 addition & 0 deletions src/button/_example/block-btn/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Component({});
6 changes: 6 additions & 0 deletions src/button/_example/block-btn/index.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"component": true,
"usingComponents": {
"t-button": "tdesign-miniprogram/button/button"
}
}
3 changes: 3 additions & 0 deletions src/button/_example/block-btn/index.wxml
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<view class="box">
<t-button theme="primary" size="large" block>填充按钮</t-button>
</view>
3 changes: 3 additions & 0 deletions src/button/_example/block-btn/index.wxss
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.box {
margin: 0 32rpx;
}
7 changes: 6 additions & 1 deletion src/button/_example/button.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,11 @@
"usingComponents": {
"base": "./base",
"size": "./size",
"icon-btn": "./icon-btn"
"icon-btn": "./icon-btn",
"group-btn": "./group-btn",
"block-btn": "./block-btn",
"ghost-btn": "./ghost-btn",
"shape": "./shape",
"theme": "./theme"
}
}
Loading