/** * 列表 */ .plugins-data-list { position: relative; } .plugins-data-list>ul { padding: 0px; width: calc(100% + 2rem); margin-left: -1rem; } .plugins-data-list>ul>li { float: left; padding: 1rem; } .plugins-data-list>ul>li .item { height: 20.8rem; padding: 2rem; position: relative; } .plugins-data-list>ul>li .icon { width: 10.8rem; height: 10.8rem; border-radius: 1.2rem; box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.13); } .plugins-data-list>ul .item { box-shadow: none; border-radius: var(--border-radius-lg); background-color: #f9f9f9; border: 0.1rem solid #f9f9f9; transition: all 0.3s ease-in-out; } .plugins-data-list>ul.not-install .item { background: #F4F4F4; border: 0.1rem solid #F4F4F4 !important; } .plugins-data-list>ul .item:hover { border: 0.1rem solid var(--color-main) !important; } .plugins-data-list>ul>li { position: relative; } .plugins-data-list>ul>li .base { position: absolute; top: 3rem; left: 15rem; width: calc(100% - 18rem); } .plugins-data-list>ul>li .base h3 { font-weight: 700; color: #333; font-size: 1.6rem; margin: 0 0 1rem 0; } .plugins-data-list>ul>li .base p, .plugins-data-list>ul>li .base a { line-height: 1.8rem; margin: 0; font-size: 1.2rem; font-weight: 300; color: #999; } .plugins-data-list>ul>li .base h3, .plugins-data-list>ul>li .base p { word-wrap: normal; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .plugins-data-list>ul .desc { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; font-size: 1.4rem; -webkit-box-orient: vertical; margin-top: 1.2rem; color: #333; height: 4rem; line-height: 2rem; } .plugins-data-list>ul>li .operation { padding-top: 0.8rem; display: flex; flex-flow: row nowrap; overflow: auto; position: relative; z-index: 2; } .plugins-data-list>ul>li.setup .operation { z-index: 0; } .plugins-data-list>ul .item .operation .am-btn { position: relative; padding: 0.5em 2em; z-index: 2; } .plugins-data-list>ul .item .operation .am-btn:hover { color: #2A94FF; } .plugins-data-list>ul .item .operation .am-btn:first-child::before { display: none; } .plugins-data-list>ul .item .operation .am-btn:first-child { padding-left: 0; } .plugins-data-list>ul .item .operation .am-btn:last-child { padding-right: 0; } .plugins-data-list>ul .item .operation .am-btn::before { content: ''; width: 1px; height: 30px; background: #EEEEEE; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .plugins-data-list>ul.not-install .item .operation .am-btn::before { background: #DDDDDD; } .plugins-data-list>ul>li .operation a, .plugins-data-list>ul>li .operation button { display: flex; flex-flow: column nowrap; justify-content: end; align-items: center; width: auto !important; gap: 0.5rem; color: #666; background-color: transparent !important; border: 0 !important; height: auto; line-height: normal; } .plugins-data-list>ul>li .operation button.am-btn-danger { color: var(--color-red); } .plugins-data-list>ul>li .operation a i, .plugins-data-list>ul>li .operation button i { font-size: 1.6rem; } .plugins-data-list>ul>li .operation a:hover, .plugins-data-list>ul>li .operation a:focus, .plugins-data-list>ul>li .operation a:active, .plugins-data-list>ul>li .operation button:hover, .plugins-data-list>ul>li .operation button:focus, .plugins-data-list>ul>li .operation button:active { box-shadow: none; } .plugins-data-list>ul>li .am-btn, .plugins-data-list>ul>li .am-icon-btn { width: 3.5rem; } .plugins-data-list>ul>li .plugins-status-event.am-success { color: #52C41A; } .plugins-data-list>ul>li .submit-move { cursor: move !important; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } .content .middle-divider { height: 5rem; position: relative; padding-top: 2.5rem; } .content .middle-divider strong { position: absolute; top: 0.4rem; background: #fff; padding: 0.4rem 2rem; left: calc(50% - 8.3rem); border: 0.1rem dashed #ccc; border-radius: 0.2rem; } .content .middle-divider:hover>strong { border: 0.1rem dashed #2196F3; color: #2196F3; background: #eaf6ff; } .content .middle-divider:hover>hr { border-top: 0.1rem dashed #2196F3; } .am-nav-left { position: relative; padding-left: 1.2rem; } .am-nav-left::before { content: ''; width: 3px; height: 14px; background: #2A94FF; border-radius: 2px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } @media only screen and (max-width: 640px) { .plugins-data-list>ul>li .item { height: 18.7rem; } .plugins-data-list>ul>li .icon { width: 6.5rem; height: 6.5rem; } .plugins-data-list>ul>li .base { left: 10.5rem; width: calc(100% - 13.5rem); } .plugins-data-list>ul>li .base h3 { margin: 0px; } .plugins-data-list>ul>li .base p { line-height: 1.6rem; } .plugins-data-list>ul>li .operation { padding-top: 3rem; } } /** * 删除modal */ .am-modal-confirm .am-modal-dialog { box-shadow: rgb(85 85 85 / 60%) 0px 0px 3rem; } @media only screen and (min-width: 641px) { .plugins-data-list>ul>li { width: 50%; } #plugins-delete-modal .am-modal-bd button.submit-ajax { margin-right: 2rem; } } @media only screen and (min-width: 1025px) { .plugins-data-list>ul>li { width: 33.33%; } } @media only screen and (max-width: 640px) { .plugins-data-list>ul>li { width: 100%; } #plugins-delete-modal .am-modal-bd .am-btn { width: 100%; display: block; margin-top: 1rem; } } /** * 搜索 */ .plugins-search { width: 38rem; z-index: 1; } .plugins-search input { border-radius: var(--border-radius) !important; padding-right: 2.8rem; } .plugins-search i.search-event { cursor: pointer; color: #ddd; position: absolute; right: 0.8rem; z-index: 2; top: 50%; transform: translateY(-50%); } .plugins-search i.search-event:hover { color: #2A94FF; } @media only screen and (max-width: 800px) { .plugins-search { width: 100%; position: relative; } } /** * 插件设置容器 */ .plugins-data-list .plugins-setup-container { position: absolute; bottom: 0; left: 0; width: 100%; border-bottom-left-radius: 0.7rem; border-bottom-right-radius: 0.7rem; -webkit-box-shadow: 0 -0.5rem 0.5rem rgb(50 55 58 / 6%); box-shadow: 0 -0.5rem 0.5rem rgb(50 55 58 / 6%); background: #f9f9f9; } .plugins-data-list .plugins-setup-container .chosen-select-item { width: 10rem; vertical-align: middle; } .plugins-data-list .plugins-setup-container .chosen-select-item.second-domain { border: 0.1rem solid #f0f0f0; border-radius: var(--border-radius); padding: 0.48rem 0.8rem; height: 3.1rem; } .plugins-data-list .plugins-setup-container .chosen-select-item.second-domain, .plugins-data-list .plugins-setup-container .chosen-select-item .chosen-single { position: relative; z-index: 3; } /** * 插件应用分类 */ .plugins-category-nav button.am-btn-default { background: #F5F5F5; border: 0; } .plugins-category-nav button.am-btn-secondary { background: var(--color-main-light); color: var(--color-main); border: 0; }