MediaWiki

Gadget-CopyTextTool.css:修订间差异

来自卡厄思梦境WIKI

律Rhyme留言 | 贡献
创建页面,内容为“文本复制工具样式:​ #copy-text-tool { position: fixed; top: 100px; right: 20px; width: 300px; background: white; border: 2px solid #2196F3; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); z-index: 9999; font-family: sans-serif; } #copy-text-tool.minimized { width: auto; } #copy-text-tool.minimized .tool-body { display: none; } .tool-header { background: #2196F3; color: white; p…”
 
律Rhyme留言 | 贡献
无编辑摘要
 
(未显示同一用户的1个中间版本)
第1行: 第1行:
/* 文本复制工具样式 */
/* 文本复制工具样式 */
#copy-text-tool {
#copy-text-tool {
     position: fixed;
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    top: 100px;
    right: 20px;
    width: 300px;
    background: white;
    border: 2px solid #2196F3;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 9999;
    font-family: sans-serif;
}
}


#copy-text-tool.minimized {
#copy-text-tool * {
     width: auto;
     box-sizing: border-box;
}
}


#copy-text-tool.minimized .tool-body {
#copy-tool-fab {
     display: none;
     animation: fadeInUp 0.5s ease;
}
}


.tool-header {
@keyframes fadeInUp {
     background: #2196F3;
     from {
    color: white;
        opacity: 0;
    padding: 10px;
        transform: translateY(20px);
     cursor: move;
     }
     display: flex;
     to {
    justify-content: space-between;
        opacity: 1;
    align-items: center;
        transform: translateY(0);
     border-radius: 6px 6px 0 0;
     }
}
}


.tool-title {
/* 移动端适配 */
     font-weight: bold;
@media (max-width: 768px) {
     font-size: 14px;
     #copy-text-tool {
        width: 90% !important;
        max-width: 320px;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%);
     }
   
    #copy-tool-fab {
        bottom: 20px !important;
        right: 20px !important;
        width: 48px !important;
        height: 48px !important;
        font-size: 20px !important;
    }
}
}


.tool-controls {
/* 打印时隐藏 */
    display: flex;
@media print {
    gap: 5px;
     #copy-text-tool,
}
     #copy-tool-fab {
 
        display: none !important;
.tool-btn {
     }
     background: rgba(255,255,255,0.2);
    border: none;
    color: white;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
}
 
.tool-btn:hover {
    background: rgba(255,255,255,0.3);
}
 
.tool-body {
     padding: 15px;
}
 
.copy-button {
    width: 100%;
    margin-bottom: 8px;
    padding: 12px;
    background: #2196F3;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s;
}
 
.copy-button:hover {
    background: #1976D2;
}
 
.copy-button:active {
    background: #0D47A1;
}
 
.tool-status {
    text-align: center;
    color: #666;
    padding: 8px;
    font-size: 12px;
    min-height: 20px;
}
 
.tool-status.success {
    color: #2196F3;
    font-weight: bold;
}
 
.pin-control {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px;
    background: #f5f5f5;
    border-radius: 4px;
    margin-bottom: 10px;
}
 
.pin-control input[type="checkbox"] {
    width: 16px;
     height: 16px;
    cursor: pointer;
}
 
.pin-control label {
    cursor: pointer;
    font-size: 13px;
    user-select: none;
}
}

2025年10月3日 (五) 20:45的最新版本

/* 文本复制工具样式 */
#copy-text-tool {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

#copy-text-tool * {
    box-sizing: border-box;
}

#copy-tool-fab {
    animation: fadeInUp 0.5s ease;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 移动端适配 */
@media (max-width: 768px) {
    #copy-text-tool {
        width: 90% !important;
        max-width: 320px;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%);
    }
    
    #copy-tool-fab {
        bottom: 20px !important;
        right: 20px !important;
        width: 48px !important;
        height: 48px !important;
        font-size: 20px !important;
    }
}

/* 打印时隐藏 */
@media print {
    #copy-text-tool,
    #copy-tool-fab {
        display: none !important;
    }
}