ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-18 17:51:54 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Merge branch 'master' into hotfix/switch_loading_fix

Browse Source
This commit is contained in:
jiangruowei
2017-03-01 17:04:54 +08:00
parent deeffc35a8 f5564a0d61
commit ec168a9b9c
120 changed files with 50427 additions and 11015 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/zanui-css/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "@youzan/zanui-css",
"version": "0.0.4",
"version": "0.0.7",
"description": "zanui css.",
"main": "lib/index.css",
"style": "lib/index.css",

71
packages/zanui-css/src/badge.css Normal file
View File

@@ -0,0 +1,71 @@
@import "./common/var.css";
@import "./mixins/border_retina.css";
@component-namespace zan {
@b badge-group {
position: relative;
width: 85px;
&::after {
@mixin border-retina (top);
}
}
@b badge {
display: block;
overflow: hidden;
position: relative;
padding: 20px 15px;
box-sizing: border-box;
line-height: 14px;
background-color: $c-background;
color: $c-gray-darker;
font-size: 14px;
text-decoration: none;
white-space: nowrap;
@e active {
display: none;
position: absolute;
left: 0;
top: 0;
width: 3px;
height: 100%;
background-color: #FF4444;
}
@e info {
position: absolute;
top: 2px;
right: 2px;
font-size: 10px;
transform:scale(0.8);
text-align: center;
box-sizing: border-box;
padding: 0 6px;
min-width: 18px;
height: 18px;
line-height: 18px;
border-radius: 9px;
background-color: #FF4444;
color: $c-white;
}
@when select {
font-weight: bold;
color: $c-black;
background-color: $c-white;
.zan-badge__active {
display: block;
}
&::after {
@mixin border-retina (top);
@mixin border-retina (right);
@mixin border-retina (left);
}
}
&::after {
@mixin border-retina (bottom);
}
&:last-child {
&::after {
border-bottom: 0;
}
}
}
}

2
packages/zanui-css/src/button.css
View File

@@ -1,6 +1,6 @@
@import "./common/var.css";
@component-namespace z {
@component-namespace zan {
@b button {
position: relative;
padding: 0;

6
packages/zanui-css/src/button_group.css
View File

@@ -5,16 +5,16 @@
&:last-child {
padding-right: 0;
}
.z-button {
.zan-button {
width: 100%;
}
}
@component-namespace z {
@component-namespace zan {
@b button-group {
font-size: 0;
> .z-button {
> .zan-button {
margin-right: 10px;
&::last-child {
margin-right: 0;

6
packages/zanui-css/src/card.css
View File

@@ -1,6 +1,6 @@
@import "./mixins/ellipsis.css";
@component-namespace z {
@component-namespace zan {
@b card {
padding: 5px 15px;
background: #FAFAFA;
@@ -27,7 +27,7 @@
display: table;
height: 90px;
.z-card__info {
.zan-card__info {
display: table-cell;
vertical-align: middle;
}
@@ -80,7 +80,7 @@
right: 15px;
bottom: 5px;
.z-button {
.zan-button {
margin-left: 5px;
}
}

14
packages/zanui-css/src/cell.css
View File

@@ -1,7 +1,7 @@
@import "./common/var.css";
@import "./mixins/border_retina.css";
@component-namespace z {
@component-namespace zan {
@b cell-group {
padding-left: 10px;
position: relative;
@@ -19,7 +19,7 @@
box-sizing: border-box;
line-height: 22px;
background-color: $c-white;
color: #333;
color: $c-black;
font-size: 14px;
text-decoration: none;
@@ -42,7 +42,7 @@
display: block;
font-size: 12px;
line-height: 1.2;
color: #666;
color: $c-gray-darker;
}
@e value {
@@ -52,14 +52,18 @@
@when link {
margin-right: 20px;
}
@when alone {
float: left;
}
}
.zui-icon-arrow {
.zan-icon-arrow {
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
color: #999;
color: $c-gray-dark;
font-size: 12px;
}
}

44
packages/zanui-css/src/checkbox.css Normal file
View File

@@ -0,0 +1,44 @@
@import "./common/var.css";
@component-namespace zan {
@b checkbox {
@when disabled {
.zan-icon {
color: #d1dbe5;
}
}
@e input {
position: relative;
height: 22px;
margin-right: 15px;
}
@e control {
position: absolute;
top: 0;
left: 0;
width: 22px;
height: 22px;
opacity: 0;
margin: 0;
}
@e label {
line-height: 22px;
}
.zan-icon {
font-size: 22px;
line-height: 1;
}
.zan-icon-checked {
color: $c-green;
}
.zan-icon-check {
color: $c-gray-dark;
}
}
}

2
packages/zanui-css/src/common/var.css
View File

@@ -33,7 +33,7 @@ $button-disabled-border-color: #cacaca;
:root{
/* z-index
/* zan-index
-------------------------- */
--index-normal: 1;
--index-top: 1000;

6
packages/zanui-css/src/dialog.css
View File

@@ -1,6 +1,6 @@
@import "./mixins/border_retina.css";
@component-namespace z {
@component-namespace zan {
@b dialog-wrapper {
position: absolute;
}
@@ -52,11 +52,11 @@
overflow: hidden;
@when twobtn {
.z-dialog__btn {
.zan-dialog__btn {
width: 50%;
}
.z-dialog__cancel {
.zan-dialog__cancel {
&::after {
@mixin border-retina (right);
}

16
packages/zanui-css/src/field.css
View File

@@ -1,42 +1,42 @@
@import "./common/var.css";
@import "./mixins/border_retina.css";
@component-namespace z {
@component-namespace zan {
@b field {
width: 100%;
overflow: hidden;
@when textarea {
.z-field__control {
.zan-field__control {
min-height: 60px;
}
}
@when nolabel {
.z-cell__title {
.zan-cell__title {
display: none;
}
.z-cell__value {
.zan-cell__value {
width: 100%;
padding-left: 0;
}
}
.z-cell__title,
.z-cell__value {
.zan-cell__title,
.zan-cell__value {
float: none;
box-sizing: border-box;
}
.z-cell__title {
.zan-cell__title {
width: 90px;
position: absolute;
top: 10px;
left: 0;
}
.z-cell__value {
.zan-cell__value {
width: 100%;
padding-left: 90px;
}

40
packages/zanui-css/src/icon.css
View File

@@ -9,10 +9,10 @@
url('https://b.yzcdn.cn/zui/font/zuiicon-b37948cf5d.ttf') format('truetype')
}
.zui-icon {
.zan-icon {
display: inline-block;
}
.zui-icon::before {
.zan-icon::before {
font-family: "zuiicon" !important;
font-style: normal;
font-weight: normal;
@@ -39,7 +39,7 @@
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-mozan-osx-font-smoothing: grayscale;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
@@ -47,20 +47,20 @@
/* DO NOT EDIT! Generated by fount */
.zui-icon-album:before { content: '\e800'; } /* '' */
.zui-icon-arrow:before { content: '\e801'; } /* '' */
.zui-icon-camera:before { content: '\e802'; } /* '' */
.zui-icon-certificate:before { content: '\e803'; } /* '' */
.zui-icon-check:before { content: '\e804'; } /* '' */
.zui-icon-checked:before { content: '\e805'; } /* '' */
.zui-icon-close:before { content: '\e806'; } /* '' */
.zui-icon-gift:before { content: '\e807'; } /* '' */
.zui-icon-home:before { content: '\e808'; } /* '' */
.zui-icon-location:before { content: '\e809'; } /* '' */
.zui-icon-message:before { content: '\e80a'; } /* '' */
.zui-icon-send:before { content: '\e80b'; } /* '' */
.zui-icon-shopping-cart:before { content: '\e80c'; } /* '' */
.zui-icon-sign:before { content: '\e80d'; } /* '' */
.zui-icon-store:before { content: '\e80e'; } /* '' */
.zui-icon-topay:before { content: '\e80f'; } /* '' */
.zui-icon-tosend:before { content: '\e810'; } /* '' */
.zan-icon-album:before { content: '\e800'; } /* '' */
.zan-icon-arrow:before { content: '\e801'; } /* '' */
.zan-icon-camera:before { content: '\e802'; } /* '' */
.zan-icon-certificate:before { content: '\e803'; } /* '' */
.zan-icon-check:before { content: '\e804'; } /* '' */
.zan-icon-checked:before { content: '\e805'; } /* '' */
.zan-icon-close:before { content: '\e806'; } /* '' */
.zan-icon-gift:before { content: '\e807'; } /* '' */
.zan-icon-home:before { content: '\e808'; } /* '' */
.zan-icon-location:before { content: '\e809'; } /* '' */
.zan-icon-message:before { content: '\e80a'; } /* '' */
.zan-icon-send:before { content: '\e80b'; } /* '' */
.zan-icon-shopping-cart:before { content: '\e80c'; } /* '' */
.zan-icon-sign:before { content: '\e80d'; } /* '' */
.zan-icon-store:before { content: '\e80e'; } /* '' */
.zan-icon-topay:before { content: '\e80f'; } /* '' */
.zan-icon-tosend:before { content: '\e810'; } /* '' */

4
packages/zanui-css/src/index.css
View File

@@ -13,5 +13,9 @@
@import './popup.css';
@import './radio.css';
@import './switch.css';
@import './badge.css';
@import './search.css';
@import './panel.css';
@import './steps.css';
@import './tag.css';
@import './checkbox.css';

2
packages/zanui-css/src/panel.css
View File

@@ -1,4 +1,4 @@
@component-namespace z {
@component-namespace zan {
@b panel {
background: #fff;
border-top: 1px solid #E5E5E5;

20
packages/zanui-css/src/picker.css
View File

@@ -1,4 +1,4 @@
@component-namespace z {
@component-namespace zan {
@b picker {
overflow: hidden;
@@ -11,26 +11,26 @@
overflow: hidden;
@m 1 {
.z-picker-column {
.zan-picker-column {
width: 100%;
}
}
@m 2 {
.z-picker-column {
.zan-picker-column {
width: 50%;
}
}
@m 3 {
.z-picker-column {
.zan-picker-column {
width: 33.333%;
}
}
}
}
.z-picker-center-highlight {
.zan-picker-center-highlight {
box-sizing: border-box;
position: absolute;
left: 0;
@@ -40,26 +40,26 @@
pointer-events: none;
}
.z-picker-center-highlight:before,
.z-picker-center-highlight:after {
.zan-picker-center-highlight:before,
.zan-picker-center-highlight:after {
content: '';
position: absolute;
height: 1px;
width: 100%;
background-color: #eaeaea;
display: block;
z-index: 15;
zan-index: 15;
transform: scaleY(0.5);
}
.z-picker-center-highlight:before {
.zan-picker-center-highlight:before {
left: 0;
top: 0;
bottom: auto;
right: auto;
}
.z-picker-center-highlight:after {
.zan-picker-center-highlight:after {
left: 0;
bottom: 0;
right: auto;

2
packages/zanui-css/src/popup.css
View File

@@ -1,4 +1,4 @@
@component-namespace z {
@component-namespace zan {
@b modal {
position: fixed;
width: 100%;

12
packages/zanui-css/src/radio.css
View File

@@ -1,11 +1,9 @@
@import "./common/var.css";
@component-namespace z {
@component-namespace zan {
@b radio {
margin: 10px 0;
@when disabled {
.zui-icon {
.zan-icon {
color: #d1dbe5;
}
}
@@ -30,16 +28,16 @@
line-height: 22px;
}
.zui-icon {
.zan-icon {
font-size: 22px;
line-height: 1;
}
.zui-icon-checked {
.zan-icon-checked {
color: $c-green;
}
.zui-icon-check {
.zan-icon-check {
color: $c-gray-dark;
}
}

53
packages/zanui-css/src/search.css Normal file
View File

@@ -0,0 +1,53 @@
@import "./common/var.css";
@component-namespace zan {
@b search {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
position: relative;
box-sizing: border-box;
padding: 4px 15px;
background-color: #F2F2F2;
@when focus {
.zan-search__input-wrap {
width: 82%;
}
span {
display: inline-block;
}
}
@e input-wrap {
position: relative;
width: 90%;
padding: 8px 24px 8px 35px;
border: 1px solid $c-gray-light;
border-radius: 4px;
background-color: $c-white;
span {
display: none;
position: absolute;
right: 5px;
top: 8px;
}
input {
width: 100%;
height: 14px;
font-size: 14px;
color: $c-gray-dark;
border: none;
outline: none;
}
}
@e cancel {
display: none;
color: #44BB00;
font-size: 14px;
white-space: nowrap;
@when focus {
display: block;
}
}
}
}

2
packages/zanui-css/src/steps.css
View File

@@ -1,4 +1,4 @@
@component-namespace z {
@component-namespace zan {
@b steps {
color: red;
}

66
packages/zanui-css/src/tag.css Normal file
View File

@@ -0,0 +1,66 @@
@import "./common/var.css";
@import "./mixins/border_retina.css";
@component-namespace zan {
@b tag {
position: relative;
display: inline-block;
line-height: 14px;
padding: 1px 5px;
border-radius: 2px;
font-size: 10px;
background: $c-gray;
color: $c-white;
&::after {
@mixin border-retina (top, right, bottom, left), $c-gray;
border-radius: 4px;
}
@m success {
background: $c-green;
&::after {
border-color: $c-green;
}
@when plain {
color: $c-green;
}
}
@m danger {
background: $button-danger-background-color;
&::after {
border-color: $button-danger-background-color;
}
@when plain {
color: $button-danger-background-color;
}
}
@m primary {
background: $c-blue;
&::after {
border-color: $c-blue;
}
@when plain {
color: $c-blue;
}
}
@when plain {
background: $c-white;
color: $c-gray;
}
@when mark {
border-radius: 0 8px 8px 0;
&::after {
border-radius: 0 16px 16px 0;
}
}
}
}