@import "./mixins/variables";

/* 宽高 */
.w-16 {
  width: 16px;
}

.w-20 {
  width: 20px;
}

.w-24 {
  width: 24px;
}

.w-32 {
  width: 32px;
}

.w-40 {
  width: 40px;
}

.w-48 {
  width: 48px;
}

.w-56 {
  width: 56px;
}

.w-64 {
  width: 64px;
}

.w-xxl {
  width: 60px;
}

.w-xs {
  width: 90px;
}

.w-sm {
  width: 120px;
}

.w {
  width: 180px;
}

.w-md {
  width: 200px;
}

.w-lg {
  width: 240px;
}

.w-xl {
  width: 280px;
}

.w-xxl {
  width: 320px;
}

.w-full {
  width: 100%;
}




.w-auto {
  width: auto;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

/* 外边距 */

.no-margin {
  margin: 0;
}

.m {
  margin: 16px;
}

.m-xs {
  margin: 4px;
}

.m-sm {
  margin: 8px;
}

.m-md {
  margin: 24px;
}

.m-lg {
  margin: 32px;
}

.m-v-xs {
  margin-top: 4px;
  margin-bottom: 4px;
}

.m-v-sm {
  margin-top: 8px;
  margin-bottom: 8px;
}

.m-v {
  margin-top: 16px;
  margin-bottom: 16px;
}

.m-v-md {
  margin-top: 24px;
  margin-bottom: 24px;
}

.m-v-lg {
  margin-top: 32px;
  margin-bottom: 32px;
}

.m-h-xs {
  margin-right: 4px;
  margin-left: 4px;
}

.m-h-sm {
  margin-right: 8px;
  margin-left: 8px;
}

.m-h {
  margin-right: 16px;
  margin-left: 16px;
}

.m-h-md {
  margin-right: 24px;
  margin-left: 24px;
}

.m-h-lg {
  margin-right: 32px;
  margin-left: 32px;
}

.m-t {
  margin-top: 16px;
}

.m-t-xs {
  margin-top: 4px;
}

.m-t-sm {
  margin-top: 8px;
}

.m-t-md {
  margin-top: 24px;
}

.m-t-lg {
  margin-top: 32px;
}

.m-r {
  margin-right: 16px;
}

.m-r-xs {
  margin-right: 4px;
}

.m-r-sm {
  margin-right: 8px;
}

.m-r-md {
  margin-right: 24px;
}

.m-r-lg {
  margin-right: 32px;
}

.m-b {
  margin-bottom: 16px;
}

.m-b-xs {
  margin-bottom: 4px;
}

.m-b-sm {
  margin-bottom: 8px;
}

.m-b-md {
  margin-bottom: 24px;
}

.m-b-lg {
  margin-bottom: 32px;
}

.m-l {
  margin-left: 16px;
}

.m-l-xs {
  margin-left: 4px;
}

.m-l-sm {
  margin-left: 8px;
}

.m-l-md {
  margin-left: 24px;
}

.m-l-lg {
  margin-left: 32px;
}

.m-n {
  margin: -16px;
}

.m-h-n {
  margin-right: -16px;
  margin-left: -16px;
}

.m-v-n {
  margin-top: -16px;
  margin-bottom: -16px;
}

.m-l-n {
  margin-left: -16px;
}

.m-r-n {
  margin-right: -16px;
}

.m-t-n {
  margin-top: -16px;
}

.m-b-n {
  margin-bottom: -16px;
}

/* 内边距 */
.no-padding {
  padding: 0 !important;
}

.no-padding-h {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.no-padding-v {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.p-xs {
  padding: 4px;
}

.p-sm {
  padding: 8px;
}

.p {
  padding: 16px;
}

.p-md {
  padding: 24px;
}

.p-lg {
  padding: 32px;
}

.p-h {
  padding-right: 16px;
  padding-left: 16px;
}

.p-h-xs {
  padding-right: 4px;
  padding-left: 4px;
}

.p-h-sm {
  padding-right: 8px;
  padding-left: 8px;
}

.p-h-md {
  padding-right: 24px;
  padding-left: 24px;
}

.p-t-md {
  padding-top:24px;
}

.p-b-md{
  padding-bottom: 24px;
}

.p-l-md{
  padding-left: 24px;
}

.p-h-lg {
  padding-right: 32px;
  padding-left: 32px;
}

.p-v {
  padding-top: 16px;
  padding-bottom: 16px;
}

.p-v-xs {
  padding-top: 4px;
  padding-bottom: 4px;
}

.p-v-sm {
  padding-top: 8px;
  padding-bottom: 8px;
}

.p-v-md {
  padding-top: 24px;
  padding-bottom: 24px;
}

.p-v-lg {
  padding-top: 32px;
  padding-bottom: 32px;
}

.padding {
  padding: 32px 32px;
}

.padding-out {
  margin: -32px -32px;
}

/* 边框 */

.no-border {
  border-color: transparent;
  border-width: 0;
}

/* 背景 */
.no-bg {
  color: inherit;
  background-color: transparent;
}

/* 文字 */

.text-ellipsis {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-muted {
  color: inherit;
  opacity: 0.75;
}

.text-muted-dk {
  color: inherit;
  opacity: 0.5;
}

.text-muted-lt {
  color: inherit;
  opacity: 0.25;
}

.u-text-left, .text-left{
 text-align: left !important;
}

.u-text-center, text-center{
  text-align: center !important;
}

.u-text-right, text-right{
  text-align: right !important;
}




// a {
//   color: inherit;
//   text-decoration: none;
//   cursor: pointer;
//   outline: 0;
// }

// a:hover,
// a:focus {
//   color: inherit;
//   text-decoration: none;
// }

// 超链接按钮
.u-link{
  cursor: pointer;
  color:unquote("rgb(#{$palette-indigo-500})");
  background-color: transparent;
  text-decoration: none;

}

.u-link:active,
.u-link:hover{
  outline: 0;
}  

.u-link:focus, .u-link:hover {
    text-decoration: underline;
}


.img-circle{
	border-radius:50%
}