|
|
@@ -301,4 +301,72 @@ const sizeChange = (limits) => {
|
|
|
margin: 20px 0 0 0;
|
|
|
}
|
|
|
}
|
|
|
+.dialog {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-top: 20px;
|
|
|
+ .list {
|
|
|
+ position: relative;
|
|
|
+ margin-right: 10px;
|
|
|
+ width: 380px;
|
|
|
+ height: 233px;
|
|
|
+ box-shadow: 0 0 13px 0 rgba(5, 88, 219, 0.18);
|
|
|
+ .name {
|
|
|
+ padding: 10px 20px;
|
|
|
+ width: 380px;
|
|
|
+ height: 71px;
|
|
|
+ background-color: #dce5ff;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 24px;
|
|
|
+ color: #0d0d0d;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .other {
|
|
|
+ height: 162px;
|
|
|
+ padding: 10px 20px 0 20px;
|
|
|
+ .other_1 {
|
|
|
+ padding: 0 10px;
|
|
|
+ height: 25px;
|
|
|
+ background-color: #e6f2fd;
|
|
|
+ border-radius: 2px;
|
|
|
+ border: solid 1px #cae0f5;
|
|
|
+ font-size: $global-font-size-14;
|
|
|
+ line-height: 25px;
|
|
|
+ color: #0085f5;
|
|
|
+ }
|
|
|
+ .other_2 {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 15px;
|
|
|
+ font-size: $global-font-size-16;
|
|
|
+ span {
|
|
|
+ color: #909090;
|
|
|
+ }
|
|
|
+ .state {
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ bottom: 15px;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: middle;
|
|
|
+ padding: 0 20px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ background-image: linear-gradient(90deg, #ff8a00 0, #ff5a00 100%), linear-gradient(#ff7800, #ff7800);
|
|
|
+ background-blend-mode: normal, normal;
|
|
|
+ border-radius: 14px;
|
|
|
+ border: solid 1px #e5e5e5;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .list:hover {
|
|
|
+ box-shadow: 0 0 5px 0 $global-color-107;
|
|
|
+ .name {
|
|
|
+ background-color: $global-color-107;
|
|
|
+ color: $global-color-fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
