diff --git a/jero-web/public/index.html b/jero-web/public/index.html index 37f7a397c..4657e9024 100644 --- a/jero-web/public/index.html +++ b/jero-web/public/index.html @@ -19,12 +19,14 @@ margin: 0px; padding: 0px; } + .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } + #loader-wrapper { position: fixed; top: 0; @@ -33,6 +35,7 @@ height: 100%; z-index: 999999; } + #loader { display: block; position: relative; @@ -57,6 +60,7 @@ /* Chrome, Firefox 16+, IE 10+, Opera */ z-index: 1001; } + #loader:before { content: ""; position: absolute; @@ -79,6 +83,7 @@ animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } + #loader:after { content: ""; position: absolute; @@ -101,6 +106,7 @@ animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } + @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); @@ -119,6 +125,7 @@ /* Firefox 16+, IE 10+, Opera */ } } + @keyframes spin { 0% { -webkit-transform: rotate(0deg); @@ -137,6 +144,7 @@ /* Firefox 16+, IE 10+, Opera */ } } + #loader-wrapper .loader-section { position: fixed; top: 0; @@ -152,12 +160,15 @@ transform: translateX(0); /* Firefox 16+, IE 10+, Opera */ } + #loader-wrapper .loader-section.section-left { left: 0; } + #loader-wrapper .loader-section.section-right { right: 0; } + /* Loaded */ .loaded #loader-wrapper .loader-section.section-left { -webkit-transform: translateX(-100%); @@ -169,6 +180,7 @@ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); } + .loaded #loader-wrapper .loader-section.section-right { -webkit-transform: translateX(100%); /* Chrome, Opera 15+, Safari 3.1+ */ @@ -179,11 +191,13 @@ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); } + .loaded #loader { opacity: 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } + .loaded #loader-wrapper { visibility: hidden; -webkit-transform: translateY(-100%); @@ -195,13 +209,16 @@ -webkit-transition: all 0.3s 1s ease-out; transition: all 0.3s 1s ease-out; } + /* JavaScript Turned Off */ .no-js #loader-wrapper { display: none; } + .no-js h1 { color: #222222; } + #loader-wrapper .load_title { font-family: 'Open Sans'; color: #FFF; @@ -214,6 +231,7 @@ opacity: 1; line-height: 30px; } + #loader-wrapper .load_title span { font-weight: normal; font-style: italic; @@ -221,28 +239,66 @@ color: #FFF; opacity: 0.5; } + /* 滚动条优化 start */ - ::-webkit-scrollbar{ - width:8px; - height:8px; + ::-webkit-scrollbar { + width: 8px; + height: 8px; } - ::-webkit-scrollbar-track{ + + ::-webkit-scrollbar-track { background: #f6f6f6; - border-radius:2px; + border-radius: 2px; } - ::-webkit-scrollbar-thumb{ + + ::-webkit-scrollbar-thumb { background: #cdcdcd; - border-radius:2px; + border-radius: 2px; } - ::-webkit-scrollbar-thumb:hover{ + + ::-webkit-scrollbar-thumb:hover { background: #747474; } + ::-webkit-scrollbar-corner { background: #f6f6f6; } + /* 滚动条优化 end */ + diff --git a/jero-web/src/App.vue b/jero-web/src/App.vue index d4bd69fbf..1caee63ae 100644 --- a/jero-web/src/App.vue +++ b/jero-web/src/App.vue @@ -211,7 +211,8 @@ height: 32px !important; line-height: 32px !important; } - .page .ant-select-selection__rendered{ + + .page .ant-select-selection__rendered { height: 32px !important; line-height: 32px !important; }