|
|
| （未显示同一用户的1个中间版本） |
| 第1行： |
第1行： |
| .mp-box { | | .step { |
| position : relative;
| | width: 112px; |
| z-index : 1;
| | height: 52px; |
| | | position: relative; |
| display : flex;
| | } |
| overflow : hidden;
| | .content { |
| overflow-y : hidden;
| | opacity: 0; |
| align-items : center;
| | transition: opacity 0.1s linear; |
| justify-content : center;
| | transform: translate(-50%,-50px); |
| | | left: 50%; |
| box-sizing : border-box;
| | position: absolute; |
| width : 100%;
| | background-color: #fff; |
| height : 125px;
| | border: 2px solid gray; |
| padding : 1px;
| | padding: 3px; |
| | | box-sizing: border-box; |
| background-size : cover;
| | border-radius: 4px; |
|
| | cursor:pointer; |
| | z-index: 114514; |
| | text-align: center; |
| } | | } |
| | | .step:hover .content { |
| .mp-box::before { | | opacity: 1; |
| position : absolute;
| |
| z-index : 2;
| |
| top : 0;
| |
| left : 0;
| |
| | |
| width : 100%;
| |
| height : 125px;
| |
| | |
| content : '';
| |
| | |
| background : inherit;
| |
| | |
| filter : blur(20px);
| |
| }
| |
| | |
| .mp-abox {
| |
| z-index : 3;
| |
| | |
| width : auto;
| |
| height : auto;
| |
| padding : 10px;
| |
| }
| |
| | |
| @media all and (max-width: 720px) {
| |
| .mp-abox{
| |
| display:none;
| |
| }
| |
| }
| |
| | |
| .mp-circle {
| |
| z-index : 3;
| |
| | |
| display : flex;
| |
| align-items : center;
| |
| flex-shrink : 0;
| |
| justify-content : center;
| |
| | |
| width : 165px;
| |
| height : 165px;
| |
| margin-right : 8px;
| |
| margin-left : 8px;
| |
| | |
| border : 1px solid white;
| |
| border-radius : 50%;
| |
| background-size : cover;
| |
| }
| |
| | |
| .mp-icon {
| |
| z-index : 4;
| |
| | |
| width : 133.365px;
| |
| height : 42.84px;
| |
| | |
| background-size : contain;
| |
| }
| |
| .mp-header{
| |
| position: relative;
| |
| | |
| box-sizing: border-box;
| |
| margin: 0 0 1.6em;
| |
| padding: .8em 1.6em 1.6em;
| |
| | |
| color: #000;
| |
| border: 1px solid #E8E8E8;
| |
| background: #FFF;
| |
| box-shadow: 0px 1px 3px rgba(0,0,0,0.08);
| |
| | |
| font-family: sans-serif;
| |
| font-size: calc(1em * 0.875);
| |
| line-height: 1.5em;
| |
| | |
| direction: ltr;
| |
| }
| |
| .mp-header-text-b{
| |
| padding: 0.1em;
| |
| | |
| text-align: center;
| |
| | |
| color: #000;
| |
| | |
| font-family: sans-serif;
| |
| font-size: 162%;
| |
| line-height: 1.5em;
| |
| | |
| direction: ltr;
| |
| }
| |
| | |
| .mp-header-text-a{
| |
| text-align: center;
| |
| | |
| color: #000;
| |
| | |
| font-family: sans-serif;
| |
| font-size: 95%;
| |
| line-height: 1.5em;
| |
| | |
| direction: ltr;
| |
| }
| |
| | |
| | |
| | |
| /* .mp-icon-new{*/
| |
| | |
| /*}*/
| |
| | |
| /*.mp-icon-next{*/
| |
| /*}*/
| |
| | |
| /*.mp-icon-dev{*/
| |
| | |
| /*} */
| |
| | |
| .mp-icon-new,.mp-icon-next,.mp-icon-dev{
| |
| padding-left: 30px;
| |
| | |
| color: #369;
| |
| border: 0;
| |
| | |
| font-family: Arial, sans-serif;
| |
| | |
| Background-size:21px 21px;
| |
| }
| |
| | |
| .mp-info-box{
| |
| margin: 0 0 1.6em;
| |
| | |
| color: #000;
| |
| border: 1px solid #E8E8E8;
| |
| background: #FFF;
| |
| box-shadow: 0px 1px 3px rgba(0,0,0,0.08);
| |
| | |
| font-family: sans-serif;
| |
| font-size: calc(1em * 0.875);
| |
| line-height: 1.5em;
| |
| | |
| direction: ltr;
| |
| }
| |
| | |
| .mp-box-header{
| |
| text-align: center;
| |
| background-color: #c4d999;
| |
| direction: ltr;
| |
| font-weight: normal;
| |
| line-height: 1.3;
| |
| font-size: 1.5em;
| |
| /* color: white; */
| |
| font-family: Arial,sans-serif;
| |
| padding: 0.4em 0;
| |
| }
| |
| | |
| .mp-box-in-box{
| |
| padding: .8em 1.6em 1.6em;
| |
| }
| |
| | |
| .mw-body-header{
| |
| display:none !important;
| |
| }
| |
| | |
| .mp-quicklink-box{
| |
| display: flex;
| |
| justify-content:center;
| |
| flex-direction: column;
| |
| gap: 5px 0;
| |
| }
| |
| .mp-quicklink-box-a{
| |
| text-align: center;
| |
| width: calc(100% - 10px);
| |
| margin: 0 5px;
| |
| padding-top:15px;
| |
| padding-bottom: 15px;
| |
| background-color: #e0efbb;
| |
| height: min-content;
| |
| | |
| display: grid;
| |
| grid-template-columns: 3fr 2fr;
| |
| }
| |
| .mp-quicklink-box-a > big {
| |
| display: flex;
| |
| align-items: center;
| |
| justify-content: center;
| |
| }
| |
| .mp-quicklink-box-b{
| |
| text-align: center;
| |
| width: calc(20% - 10px);
| |
| margin: 0 5px;
| |
| padding-top:18px;
| |
| padding-bottom: 18px;
| |
| background-color: #e0efbb;
| |
| }
| |
| | |
| .mp-latest.rotable tr:first-child th {
| |
| background-color: #bad780;
| |
| }
| |
| | |
| .mp-content {
| |
| display: grid;
| |
| grid-template-columns: 2fr 1fr;
| |
| gap: 5px;
| |
| }
| |
| .mp-center-box {
| |
| display: grid;
| |
| grid-template-columns: 3fr 1fr;
| |
| gap: 10px;
| |
| }
| |
| .mp-quicklink-list {
| |
| display: flex;
| |
| flex-direction: column;
| |
| flex-wrap: wrap;
| |
| gap: 5px 0;
| |
| width: 100%;
| |
| }
| |
| .mp-quicklink-list > p {
| |
| margin: 0;
| |
| } | | } |
