From 81311bda2d2f235d3874d75c2777b3782b9d53e4 Mon Sep 17 00:00:00 2001 From: SHAOJIAHAO <55341701@qq.com> Date: Fri, 29 Oct 2021 10:04:11 +0800 Subject: [PATCH] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=E5=AE=8C=E5=96=84=E9=81=AE?= =?UTF-8?q?=E7=BD=A9=E5=B1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 8 +- package.json | 2 +- src/app/pages/pages.module.ts | 2 +- .../today-warning.component.html | 4 +- .../today-warning.component.scss | 204 ++++++++++-------- src/theme.less | 8 + 6 files changed, 131 insertions(+), 97 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0be4a03..764fbb5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -241,16 +241,16 @@ "integrity": "sha1-jSuFLFJzvMFh0T+C+q81ZqtWKVE=" }, "@angular/cdk": { - "version": "9.0.0", - "resolved": "https://registry.npm.taobao.org/@angular/cdk/download/@angular/cdk-9.0.0.tgz", - "integrity": "sha1-VzSBeulwRPkNME+g8lycGn+gv5Y=", + "version": "9.2.4", + "resolved": "https://registry.npmmirror.com/@angular/cdk/download/@angular/cdk-9.2.4.tgz", + "integrity": "sha1-hBOVi9J15MNL47lvVkRGcd0wupM=", "requires": { "parse5": "^5.0.0" }, "dependencies": { "parse5": { "version": "5.1.1", - "resolved": "https://registry.npm.taobao.org/parse5/download/parse5-5.1.1.tgz?cache=0&sync_timestamp=1573036762880&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fparse5%2Fdownload%2Fparse5-5.1.1.tgz", + "resolved": "https://registry.nlark.com/parse5/download/parse5-5.1.1.tgz", "integrity": "sha1-9o5OW6GFKsLK3AD0VV//bCq7YXg=", "optional": true } diff --git a/package.json b/package.json index fde065a..3d0bbbb 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "private": true, "dependencies": { "@angular/animations": "^9.0.0", - "@angular/cdk": "^9.0.0", + "@angular/cdk": "^9.2.4", "@angular/common": "~9.0.0", "@angular/compiler": "~9.0.0", "@angular/core": "~9.0.0", diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts index 6a8e0d3..9801b0f 100644 --- a/src/app/pages/pages.module.ts +++ b/src/app/pages/pages.module.ts @@ -51,7 +51,7 @@ import { NzModalModule } from 'ng-zorro-antd/modal'; NzDatePickerModule, NzIconModule, NzGridModule, - // NzModalModule + NzModalModule ] }) export class PagesModule { } diff --git a/src/app/pages/today-warning/today-warning.component.html b/src/app/pages/today-warning/today-warning.component.html index 97cb22a..442781e 100644 --- a/src/app/pages/today-warning/today-warning.component.html +++ b/src/app/pages/today-warning/today-warning.component.html @@ -81,12 +81,12 @@
- +
diff --git a/src/app/pages/today-warning/today-warning.component.scss b/src/app/pages/today-warning/today-warning.component.scss index c303717..48b526d 100644 --- a/src/app/pages/today-warning/today-warning.component.scss +++ b/src/app/pages/today-warning/today-warning.component.scss @@ -1,95 +1,121 @@ -.warningbox{ +.warningbox { + width: 100%; + height: 100%; + position: relative; + display: flex; + flex-direction: column; + + .title { + box-sizing: border-box; + padding: 0 20PX; + width: 100%; + height: 50px; + line-height: 50px; + font-family: titlefont; + font-size: 26px; + color: #D0EAFF; + } + + .search { + box-sizing: border-box; + padding: 0 36px; width: 100%; - height: 100%; - position: relative; - display: flex; - flex-direction: column; - .title{ - box-sizing: border-box; - padding: 0 20PX; - width: 100%; - height: 50px; - line-height: 50px; - font-family: titlefont; - font-size: 26px; - color: #D0EAFF; + height: 32px; + + // margin-bottom: 18px; + form { + width: 100%; + height: 32px; + display: flex; + justify-content: space-around; + + .searchParams { + width: 22%; + } + + .btn { + width: 5%; + } + + nz-select { + color: #fff; + } + + nz-date-picker { + + background-color: #002552; + width: 145%; + } + } - .search{ - box-sizing: border-box; - padding: 0 36px; - width: 100%; - height: 32px; - // margin-bottom: 18px; - form{ - width: 100%; - height: 32px; - display: flex; - justify-content: space-around; - .searchParams{ - width: 22%; - } - .btn{ - width: 5%; - } - nz-select{ - color: #fff; - } - nz-date-picker{ - - background-color: #002552; - width: 145%; - } - - } - .submit{ - background-color: #013064; - border: 1px solid #4c8ac8; - color: #86bff3; - } - .reset{ - background-color: #010d26; - border: 1px solid #4c8ac8; - color: #86bff3; - } + + .submit { + background-color: #013064; + border: 1px solid #4c8ac8; + color: #86bff3; } - .warningnumber{ - position: absolute; - left: 23px; - top: -60px; - .num{ - font-size: 50px; - text-shadow: 0px 0px 6px #8df; - color: white; - font-weight: 600; - } - .today{ - font-size: 18px; - font-family: titlefont; - color: #D0EAFF; - } + + .reset { + background-color: #010d26; + border: 1px solid #4c8ac8; + color: #86bff3; } - .listbox{ - flex: 1; - overflow-y: auto; - background-image: radial-gradient(#004987,#03447c,#02325c,#012341,#01122e); - box-sizing: border-box; - padding: 20px 47px 20px 39px; - .listitem{ - width: 100%; - height: 75px; - line-height: 75px; - border: 1px solid #4c8ac8; - color: #86bff3; - margin-bottom: 12px; - div{ - text-align: center; - button{ - background-color: #013064; - border: 1px solid #4c8ac8; - color: #86bff3; - } - } - } + } + + .warningnumber { + position: absolute; + left: 23px; + top: -60px; + .num { + font-size: 50px; + text-shadow: 0px 0px 6px #8df; + color: white; + font-weight: 600; } -} \ No newline at end of file + + .today { + font-size: 18px; + font-family: titlefont; + color: #D0EAFF; + } + } + + .listbox { + flex: 1; + overflow-y: auto; + background-image: radial-gradient(#004987, #03447c, #02325c, #012341, #01122e); + box-sizing: border-box; + padding: 20px 47px 20px 39px; + + .listitem { + width: 100%; + height: 75px; + line-height: 75px; + border: 1px solid #4c8ac8; + color: #86bff3; + margin-bottom: 12px; + + div { + text-align: center; + + button { + background-color: #013064; + border: 1px solid #4c8ac8; + color: #86bff3; + } + } + } + + } +} + +::ng-deep .vertical-center-modal { + display: flex; + align-items: center; + justify-content: center; +} + +::ng-deep .vertical-center-modal .ant-modal { + top: 0; +} diff --git a/src/theme.less b/src/theme.less index aa86b34..8bdb3f5 100644 --- a/src/theme.less +++ b/src/theme.less @@ -16,7 +16,15 @@ @input-placeholder-color: #8aacce; .ant-picker-suffix{ color: #8aacce; + } .ant-picker-input > input{ color: #fff; +} +//弹窗遮罩层 +.ant-modal-mask{ + background: rgba(0,0,0,0.05); +} +.ant-modal-content{ + box-shadow: 0px 0px 4px #fff; } \ No newline at end of file