19 changed files with 398 additions and 433 deletions
@ -1,145 +1,97 @@ |
|||||
page { |
|
||||
// background-color: #FFF8F8; |
|
||||
background-color: #F1F1F1; |
|
||||
// min-height: 100%; |
|
||||
height: 100%; |
|
||||
font-size: 28rpx; |
|
||||
line-height: 1.2; // |
|
||||
color: #000; |
|
||||
} |
|
||||
|
|
||||
page .tabpage{ |
// .a-flexbox{ |
||||
// 怪异盒模型 |
// display: flex; |
||||
-webkit-overflow-scrolling: touch; |
// &.a-flexbox--fixed{ |
||||
box-sizing: border-box; |
// flex-shrink: 0; |
||||
/* #ifdef H5 */ |
// flex-grow: 0; |
||||
//貌似不需要了，已经是去除了tabbar的高度了 |
// } |
||||
//自定义tabbar的时候需要 |
// &.a-flexbox--inline{ |
||||
// 底部tab栏高度 |
// display: inline-flex; |
||||
margin-bottom: 0;//var(--window-bottom); |
// } |
||||
/* #endif */ |
// &.a-flexbox__column{ |
||||
/* #ifndef H5 */ |
// flex-direction: column; |
||||
margin-bottom: 0; |
// } |
||||
/* #endif */ |
// &.a-flexbox__row{ |
||||
// 触发BFC |
// flex-direction: row; |
||||
// overflow-x: hidden; |
// } |
||||
// overflow-y: scroll; |
// &.a-flexbox__wrap{ |
||||
min-height: 100%; |
// flex-wrap: wrap; |
||||
} |
// } |
||||
page .page{ |
// &.a-flexbox__center{ |
||||
// 怪异盒模型 |
// align-items: center; |
||||
-webkit-overflow-scrolling: touch; |
// justify-content: center; |
||||
box-sizing: border-box; |
// } |
||||
// 触发BFC |
// &.a-flexbox__center--x{ |
||||
// overflow-x: hidden; |
// justify-content: center; |
||||
// overflow-y: scroll; |
// } |
||||
min-height: 100%; |
// &.a-flexbox--around{ |
||||
} |
// justify-content: space-around; |
||||
|
// } |
||||
|
// &.a-flexbox--between{ |
||||
|
// justify-content: space-between; |
||||
|
// } |
||||
|
// &.a-flexbox__start--x{ |
||||
|
// justify-content: flex-start; |
||||
|
// } |
||||
|
// &.a-flexbox__end--x{ |
||||
|
// justify-content: flex-end; |
||||
|
// } |
||||
|
// &.a-flexbox__center--y{ |
||||
|
// align-items: center; |
||||
|
// } |
||||
|
// &.a-flexbox__start--y{ |
||||
|
// align-items: flex-start; |
||||
|
// } |
||||
|
// &.a-flexbox__end--y{ |
||||
|
// align-items: flex-end; |
||||
|
// } |
||||
|
// .a-flexbox__noshrink{ |
||||
|
// flex-shrink: 0; |
||||
|
// } |
||||
|
// .a-flexbox__full{ |
||||
|
// flex: 1; |
||||
|
// width: 0; |
||||
|
// } |
||||
|
// .a-flexbox__full--h{ |
||||
|
// flex: 1; |
||||
|
// height: 0; |
||||
|
// } |
||||
|
// } |
||||
|
// // 单行省略号 |
||||
|
// .a-ov{ |
||||
|
// @include ellipsis(1) |
||||
|
// } |
||||
|
// // 两行省略号 |
||||
|
// .a-ov2{ |
||||
|
// @include ellipsis(2) |
||||
|
// } |
||||
|
|
||||
::-webkit-scrollbar { |
// // 包裹输入框 |
||||
width: 0; |
// .a-wrapinput{ |
||||
height: 0; |
// position:relative; |
||||
color: transparent; |
// display: flex; |
||||
display: none; |
// align-items: center; |
||||
} |
// // height: 100%; |
||||
|
// >input{ |
||||
page *{ |
// width: 0; |
||||
box-sizing: border-box; |
// flex: 1; |
||||
} |
// // height: 100%; |
||||
|
// font-size: inherit; |
||||
.a-flexbox{ |
// line-height: inherit; |
||||
display: flex; |
// } |
||||
&.a-flexbox--fixed{ |
// .sub{ |
||||
flex-shrink: 0; |
// display: flex; |
||||
flex-grow: 0; |
// align-items: center; |
||||
} |
// margin-right: 8rpx; |
||||
&.a-flexbox--inline{ |
// } |
||||
display: inline-flex; |
// } |
||||
} |
// // 包裹文本域 |
||||
&.a-flexbox__column{ |
// .a-wraptextarea{ |
||||
flex-direction: column; |
// min-height: 160rpx; |
||||
} |
// height: 160rpx; |
||||
&.a-flexbox__row{ |
// >textarea{ |
||||
flex-direction: row; |
// font-size: inherit; |
||||
} |
// width: 100%; |
||||
&.a-flexbox__wrap{ |
// height: 100%; |
||||
flex-wrap: wrap; |
// } |
||||
} |
// } |
||||
&.a-flexbox__center{ |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
} |
|
||||
&.a-flexbox__center--x{ |
|
||||
justify-content: center; |
|
||||
} |
|
||||
&.a-flexbox--around{ |
|
||||
justify-content: space-around; |
|
||||
} |
|
||||
&.a-flexbox--between{ |
|
||||
justify-content: space-between; |
|
||||
} |
|
||||
&.a-flexbox__start--x{ |
|
||||
justify-content: flex-start; |
|
||||
} |
|
||||
&.a-flexbox__end--x{ |
|
||||
justify-content: flex-end; |
|
||||
} |
|
||||
&.a-flexbox__center--y{ |
|
||||
align-items: center; |
|
||||
} |
|
||||
&.a-flexbox__start--y{ |
|
||||
align-items: flex-start; |
|
||||
} |
|
||||
&.a-flexbox__end--y{ |
|
||||
align-items: flex-end; |
|
||||
} |
|
||||
.a-flexbox__noshrink{ |
|
||||
flex-shrink: 0; |
|
||||
} |
|
||||
.a-flexbox__full{ |
|
||||
flex: 1; |
|
||||
width: 0; |
|
||||
} |
|
||||
.a-flexbox__full--h{ |
|
||||
flex: 1; |
|
||||
height: 0; |
|
||||
} |
|
||||
} |
|
||||
// 单行省略号 |
|
||||
.a-ov{ |
|
||||
@include ellipsis(1) |
|
||||
} |
|
||||
// 两行省略号 |
|
||||
.a-ov2{ |
|
||||
@include ellipsis(2) |
|
||||
} |
|
||||
|
|
||||
// 包裹输入框 |
|
||||
.a-wrapinput{ |
|
||||
position:relative; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
// height: 100%; |
|
||||
>input{ |
|
||||
width: 0; |
|
||||
flex: 1; |
|
||||
// height: 100%; |
|
||||
font-size: inherit; |
|
||||
line-height: inherit; |
|
||||
} |
|
||||
.sub{ |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
margin-right: 8rpx; |
|
||||
} |
|
||||
} |
|
||||
// 包裹文本域 |
|
||||
.a-wraptextarea{ |
|
||||
min-height: 160rpx; |
|
||||
height: 160rpx; |
|
||||
>textarea{ |
|
||||
font-size: inherit; |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
} |
|
||||
} |
|
||||
|
|||||
@ -1,112 +1,113 @@ |
|||||
/* |
// /* |
||||
* 内部通用scss |
// * 内部通用scss |
||||
*/ |
// */ |
||||
|
|
||||
@mixin clearfix { |
// @mixin clearfix { |
||||
&:after { |
// &:after { |
||||
clear: both; |
// clear: both; |
||||
content: '.'; |
// content: '.'; |
||||
display: block; |
// display: block; |
||||
height: 0; |
// height: 0; |
||||
line-height: 0; |
// line-height: 0; |
||||
overflow: hidden; |
// overflow: hidden; |
||||
} |
// } |
||||
// *height: 1%; |
// // *height: 1%; |
||||
} |
// } |
||||
|
|
||||
|
|
||||
@mixin hairline { |
// @mixin hairline { |
||||
&::after { |
// &::after { |
||||
content: " "; |
// content: " "; |
||||
box-sizing: border-box; |
// box-sizing: border-box; |
||||
pointer-events: none; |
// pointer-events: none; |
||||
border: 0 solid #ebedf0; |
// border: 0 solid #ebedf0; |
||||
position: absolute; |
// position: absolute; |
||||
top: -50%; |
// top: -50%; |
||||
right: -50%; |
// right: -50%; |
||||
bottom: -50%; |
// bottom: -50%; |
||||
left: -50%; |
// left: -50%; |
||||
-webkit-transform: scale(0.5); |
// -webkit-transform: scale(0.5); |
||||
transform: scale(0.5); |
// transform: scale(0.5); |
||||
@content |
// @content |
||||
} |
// } |
||||
}; |
// }; |
||||
@mixin hairline--no { |
// @mixin hairline--no { |
||||
@include hairline{ |
// @include hairline{ |
||||
border: 0; |
// border: 0; |
||||
}; |
// }; |
||||
} |
// } |
||||
@mixin hairline--all { |
// @mixin hairline--all { |
||||
@include hairline{ |
// @include hairline{ |
||||
border-width: 1px; |
// border-width: 1px; |
||||
}; |
// }; |
||||
} |
// } |
||||
@mixin hairline--right { |
// @mixin hairline--right { |
||||
@include hairline{ |
// @include hairline{ |
||||
border-right-width: 1px; |
// border-right-width: 1px; |
||||
}; |
// }; |
||||
} |
// } |
||||
@mixin hairline--left { |
// @mixin hairline--left { |
||||
@include hairline{ |
// @include hairline{ |
||||
border-left-width: 1px; |
// border-left-width: 1px; |
||||
}; |
// }; |
||||
} |
// } |
||||
@mixin hairline--bottom { |
|
||||
@include hairline{ |
|
||||
border-bottom-width: 1px; |
|
||||
}; |
|
||||
} |
|
||||
|
|
||||
@mixin hairline--top { |
// @mixin hairline--bottom { |
||||
@include hairline{ |
// @include hairline{ |
||||
border-top-width: 1px; |
// border-bottom-width: 1px; |
||||
}; |
// }; |
||||
} |
// } |
||||
@mixin hairline--right--bottom { |
|
||||
@include hairline{ |
|
||||
border-left-width: 0; |
|
||||
border-top-width: 0; |
|
||||
border-right-width: 1px; |
|
||||
border-bottom-width: 1px; |
|
||||
}; |
|
||||
} |
|
||||
@mixin hairline--left--top { |
|
||||
@include hairline{ |
|
||||
border-right-width: 0; |
|
||||
border-bottom-width: 0; |
|
||||
border-left-width: 1px; |
|
||||
border-top-width: 1px; |
|
||||
}; |
|
||||
} |
|
||||
//一行溢出 |
|
||||
@mixin text-overflow{ |
|
||||
white-space: nowrap; |
|
||||
text-overflow: ellipsis; |
|
||||
overflow: hidden; |
|
||||
word-break: break-all; |
|
||||
}; |
|
||||
|
|
||||
//两行溢出 |
// @mixin hairline--top { |
||||
@mixin ov($num: 2){ |
// @include hairline{ |
||||
text-overflow: -o-ellipsis-lastline; |
// border-top-width: 1px; |
||||
overflow: hidden; |
// }; |
||||
text-overflow: ellipsis; |
// } |
||||
display: -webkit-box; |
// @mixin hairline--right--bottom { |
||||
-webkit-line-clamp: $num; |
// @include hairline{ |
||||
line-clamp: $num; |
// border-left-width: 0; |
||||
-webkit-box-orient: vertical; |
// border-top-width: 0; |
||||
} |
// border-right-width: 1px; |
||||
@mixin ellipsis($lines: 1) { |
// border-bottom-width: 1px; |
||||
@if ($lines==1) { |
// }; |
||||
overflow: hidden; |
// } |
||||
text-overflow: ellipsis; |
// @mixin hairline--left--top { |
||||
white-space: nowrap; |
// @include hairline{ |
||||
} @else { |
// border-right-width: 0; |
||||
display: -webkit-box; |
// border-bottom-width: 0; |
||||
-webkit-box-orient: vertical; |
// border-left-width: 1px; |
||||
-webkit-line-clamp: $lines; |
// border-top-width: 1px; |
||||
overflow: hidden; |
// }; |
||||
text-overflow: ellipsis; |
// } |
||||
word-break: break-all; |
// //一行溢出 |
||||
} |
// @mixin text-overflow{ |
||||
} |
// white-space: nowrap; |
||||
|
// text-overflow: ellipsis; |
||||
|
// overflow: hidden; |
||||
|
// word-break: break-all; |
||||
|
// }; |
||||
|
|
||||
|
// //两行溢出 |
||||
|
// @mixin ov($num: 2){ |
||||
|
// text-overflow: -o-ellipsis-lastline; |
||||
|
// overflow: hidden; |
||||
|
// text-overflow: ellipsis; |
||||
|
// display: -webkit-box; |
||||
|
// -webkit-line-clamp: $num; |
||||
|
// line-clamp: $num; |
||||
|
// -webkit-box-orient: vertical; |
||||
|
// } |
||||
|
// @mixin ellipsis($lines: 1) { |
||||
|
// @if ($lines==1) { |
||||
|
// overflow: hidden; |
||||
|
// text-overflow: ellipsis; |
||||
|
// white-space: nowrap; |
||||
|
// } @else { |
||||
|
// display: -webkit-box; |
||||
|
// -webkit-box-orient: vertical; |
||||
|
// -webkit-line-clamp: $lines; |
||||
|
// overflow: hidden; |
||||
|
// text-overflow: ellipsis; |
||||
|
// word-break: break-all; |
||||
|
// } |
||||
|
// } |
||||
@ -0,0 +1,8 @@ |
|||||
|
# niu-ui |
||||
|
|
||||
|
第一个版本，目前仅供个人使用 |
||||
|
|
||||
|
``` |
||||
|
import niuUI, {toast} from '@/uni_modules/niu-ui' |
||||
|
Vue.use(niuUI) |
||||
|
``` |
||||
@ -0,0 +1,4 @@ |
|||||
|
## 0.0.1.alpha.1（2022-07-18） |
||||
|
版本修改 |
||||
|
## 0.0.1（2022-07-18） |
||||
|
第一个版本 |
||||
@ -0,0 +1,8 @@ |
|||||
|
<template> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
</style> |
||||
@ -1 +1,8 @@ |
|||||
# niu-ui |
# niu-ui |
||||
|
|
||||
|
第一个版本，目前仅供个人使用 |
||||
|
|
||||
|
``` |
||||
|
import niuUI, {toast} from '@/uni_modules/niu-ui' |
||||
|
Vue.use(niuUI) |
||||
|
``` |
||||
Loading…
Reference in new issue