2928 lines
110 KiB
HTML
2928 lines
110 KiB
HTML
{% extends "baseTemplate/index.html" %}
|
|
{% load i18n %}
|
|
{% block title %}{% trans "WordPress Manager - CyberPanel" %}{% endblock %}
|
|
{% block content %}
|
|
|
|
{% load static %}
|
|
{% get_current_language as LANGUAGE_CODE %}
|
|
<!-- Current language: {{ LANGUAGE_CODE }} -->
|
|
|
|
<style>
|
|
/* Ultra-Modern CyberPanel Design System */
|
|
/*
|
|
Commented out :root block to allow dark mode CSS variables to work properly
|
|
:root {
|
|
--primary-color: #6366f1;
|
|
--primary-hover: #5558e3;
|
|
--primary-light: #eef2ff;
|
|
--secondary-color: #8b5cf6;
|
|
--accent-color: #ec4899;
|
|
--success-color: #10b981;
|
|
--danger-color: #ef4444;
|
|
--warning-color: #f59e0b;
|
|
--info-color: #3b82f6;
|
|
|
|
--bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
--bg-gradient-alt: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
|
|
--bg-gradient-dark: linear-gradient(135deg, #2d3561 0%, #c05c7e 100%);
|
|
|
|
--bg-light: #f8fafc;
|
|
--bg-card: #ffffff;
|
|
--bg-hover: #f1f5f9;
|
|
--border-color: #e2e8f0;
|
|
--border-light: #f1f5f9;
|
|
|
|
--text-primary: #1e293b;
|
|
--text-secondary: #64748b;
|
|
--text-muted: #94a3b8;
|
|
|
|
--shadow-sm: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.06);
|
|
--shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
|
|
--shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
|
|
--shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
|
|
|
|
--radius-sm: 6px;
|
|
--radius-md: 8px;
|
|
--radius-lg: 12px;
|
|
--radius-xl: 16px;
|
|
--radius-full: 9999px;
|
|
|
|
--transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
}
|
|
*/
|
|
|
|
/* Container Styling */
|
|
.container {
|
|
max-width: 1400px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
min-height: 100vh;
|
|
background: var(--bg-primary, linear-gradient(135deg, #f8fafc 0%, #e8f2ff 25%, #f0f9ff 50%, #f8fafc 100%));
|
|
position: relative;
|
|
}
|
|
|
|
.container::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background:
|
|
radial-gradient(circle at 20% 80%, rgba(99, 102, 241, 0.05) 0%, transparent 50%),
|
|
radial-gradient(circle at 80% 20%, rgba(236, 72, 153, 0.05) 0%, transparent 50%),
|
|
radial-gradient(circle at 40% 40%, rgba(16, 185, 129, 0.03) 0%, transparent 50%);
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Page Title Section */
|
|
#page-title {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #f5576c 75%, #4facfe 100%);
|
|
color: var(--text-on-primary, white);
|
|
padding: 50px 40px;
|
|
border-radius: var(--radius-xl);
|
|
margin-bottom: 40px;
|
|
box-shadow: 0 20px 40px rgba(102, 126, 234, 0.25);
|
|
position: relative;
|
|
overflow: hidden;
|
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
#page-title::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -50%;
|
|
right: -50%;
|
|
width: 200%;
|
|
height: 200%;
|
|
background:
|
|
radial-gradient(circle at 30% 70%, rgba(255,255,255,0.15) 0%, transparent 40%),
|
|
radial-gradient(circle at 70% 30%, rgba(255,255,255,0.1) 0%, transparent 40%);
|
|
animation: pulse 6s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes pulse {
|
|
0%, 100% {
|
|
transform: scale(1) rotate(0deg);
|
|
opacity: 0.6;
|
|
}
|
|
33% {
|
|
transform: scale(1.05) rotate(1deg);
|
|
opacity: 0.4;
|
|
}
|
|
66% {
|
|
transform: scale(0.98) rotate(-1deg);
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
|
|
#page-title h2 {
|
|
font-size: 36px;
|
|
font-weight: 800;
|
|
margin-bottom: 12px;
|
|
letter-spacing: -0.8px;
|
|
position: relative;
|
|
z-index: 1;
|
|
background: linear-gradient(to right, #ffffff 0%, #f0f8ff 30%, #e6f3ff 70%, #ffffff 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
text-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
|
|
#page-title p {
|
|
font-size: 18px;
|
|
opacity: 0.95;
|
|
margin: 0;
|
|
position: relative;
|
|
z-index: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.status-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
background: rgba(255, 255, 255, 0.25);
|
|
padding: 8px 16px;
|
|
border-radius: 20px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
letter-spacing: 0.4px;
|
|
backdrop-filter: blur(15px);
|
|
border: 1px solid rgba(255, 255, 255, 0.3);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.status-badge:hover {
|
|
transform: translateY(-1px);
|
|
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.status-badge::before {
|
|
content: '';
|
|
width: 10px;
|
|
height: 10px;
|
|
background: linear-gradient(135deg, #10b981, #34d399);
|
|
border-radius: 50%;
|
|
animation: statusPulse 2s ease-in-out infinite;
|
|
box-shadow: 0 0 8px rgba(16, 185, 129, 0.4);
|
|
}
|
|
|
|
@keyframes statusPulse {
|
|
0%, 100% {
|
|
box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6);
|
|
transform: scale(1);
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 0 12px rgba(16, 185, 129, 0);
|
|
transform: scale(1.1);
|
|
}
|
|
}
|
|
|
|
/* Main Panel */
|
|
.panel {
|
|
background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
|
|
border: 1px solid rgba(226, 232, 240, 0.8);
|
|
overflow: hidden;
|
|
position: relative;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.panel:hover {
|
|
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.panel::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 3px;
|
|
background: linear-gradient(90deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #f5576c 75%, #4facfe 100%);
|
|
border-radius: var(--radius-lg) var(--radius-lg) 0 0;
|
|
}
|
|
|
|
.panel-body {
|
|
padding: 0;
|
|
}
|
|
|
|
/* Content Box Header */
|
|
.content-box-header {
|
|
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
|
padding: 24px 32px;
|
|
margin: 0;
|
|
font-size: 22px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
border-bottom: 1px solid rgba(226, 232, 240, 0.8);
|
|
letter-spacing: 0.4px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.content-box-header::after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 2px;
|
|
background: linear-gradient(90deg, #667eea, #764ba2, #f093fb, #f5576c, #4facfe);
|
|
opacity: 0.3;
|
|
}
|
|
|
|
/* Nav Tabs */
|
|
.nav-tabs {
|
|
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
|
padding: 20px 32px 0;
|
|
border: none;
|
|
display: flex;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
position: relative;
|
|
}
|
|
|
|
.nav-tabs::after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 32px;
|
|
right: 32px;
|
|
height: 1px;
|
|
background: linear-gradient(90deg, rgba(226, 232, 240, 0.5), rgba(148, 163, 184, 0.3), rgba(226, 232, 240, 0.5));
|
|
}
|
|
|
|
.nav-tabs li {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.nav-tabs li a {
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: var(--radius-md) var(--radius-md) 0 0;
|
|
padding: 14px 26px;
|
|
color: var(--text-secondary);
|
|
font-weight: 600;
|
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
font-size: 15px;
|
|
letter-spacing: 0.4px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.nav-tabs li a::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: linear-gradient(135deg, rgba(255,255,255,0.8), rgba(248,250,252,0.6));
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.nav-tabs li a i {
|
|
font-size: 16px;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.nav-tabs li.active a,
|
|
.nav-tabs li a:hover {
|
|
background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
|
|
color: var(--primary-color);
|
|
box-shadow: 0 -3px 12px rgba(102, 126, 234, 0.15), 0 2px 8px rgba(0,0,0,0.05);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.nav-tabs li.active a::before,
|
|
.nav-tabs li a:hover::before {
|
|
opacity: 1;
|
|
}
|
|
|
|
.nav-tabs li.active a i,
|
|
.nav-tabs li a:hover i {
|
|
color: var(--primary-color);
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
/* Tab Content */
|
|
.tab-content {
|
|
padding: 40px;
|
|
background: linear-gradient(145deg, #ffffff 0%, #fafbfc 100%);
|
|
min-height: 400px;
|
|
position: relative;
|
|
}
|
|
|
|
.tab-content::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background:
|
|
radial-gradient(circle at 20% 20%, rgba(102, 126, 234, 0.02) 0%, transparent 50%),
|
|
radial-gradient(circle at 80% 80%, rgba(240, 147, 251, 0.02) 0%, transparent 50%);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.tab-pane {
|
|
animation: fadeInUp 0.4s ease;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* Fix spacing for info sections */
|
|
.tab-pane .row {
|
|
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
|
padding: 24px;
|
|
border-radius: var(--radius-lg);
|
|
margin-bottom: 24px;
|
|
border: 1px solid rgba(226, 232, 240, 0.6);
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.tab-pane .row:hover {
|
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
@keyframes fadeInUp {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(20px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
/* Enhanced Action Links */
|
|
.action-card {
|
|
background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
|
|
border-radius: var(--radius-xl);
|
|
padding: 32px;
|
|
margin-bottom: 32px;
|
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.04);
|
|
border: 1px solid rgba(226, 232, 240, 0.8);
|
|
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.action-card::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 4px;
|
|
background: linear-gradient(90deg, #667eea, #764ba2, #f093fb, #f5576c, #4facfe);
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.action-card:hover {
|
|
transform: translateY(-8px) scale(1.02);
|
|
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12), 0 8px 16px rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.action-card:hover::before {
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.action-card-title {
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
margin-bottom: 20px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
letter-spacing: 0.3px;
|
|
}
|
|
|
|
.action-card-title i {
|
|
color: var(--primary-color);
|
|
font-size: 24px;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.action-card:hover .action-card-title i {
|
|
transform: rotate(360deg) scale(1.1);
|
|
color: linear-gradient(135deg, #667eea, #764ba2);
|
|
}
|
|
|
|
/* Quick Stats Section */
|
|
.quick-stats {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
|
gap: 24px;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.stat-card {
|
|
background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
|
|
border-radius: var(--radius-xl);
|
|
padding: 32px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
|
|
border: 1px solid rgba(226, 232, 240, 0.8);
|
|
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.04);
|
|
}
|
|
|
|
.stat-card::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -30%;
|
|
right: -20%;
|
|
width: 120px;
|
|
height: 120px;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
|
|
opacity: 0.08;
|
|
border-radius: 50%;
|
|
transition: all 0.4s ease;
|
|
}
|
|
|
|
.stat-card:hover {
|
|
transform: translateY(-8px) scale(1.02);
|
|
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12), 0 8px 16px rgba(0, 0, 0, 0.08);
|
|
border-color: rgba(102, 126, 234, 0.4);
|
|
}
|
|
|
|
.stat-card:hover::before {
|
|
transform: scale(1.3) rotate(10deg);
|
|
opacity: 0.12;
|
|
}
|
|
|
|
.stat-icon {
|
|
width: 60px;
|
|
height: 60px;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
|
|
border-radius: var(--radius-lg);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 20px;
|
|
font-size: 28px;
|
|
color: var(--text-on-primary, white);
|
|
box-shadow: 0 8px 24px rgba(102, 126, 234, 0.3);
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.stat-card:hover .stat-icon {
|
|
transform: scale(1.1) rotate(5deg);
|
|
box-shadow: 0 12px 32px rgba(102, 126, 234, 0.4);
|
|
}
|
|
|
|
.stat-value {
|
|
font-size: 36px;
|
|
font-weight: 800;
|
|
color: var(--text-primary);
|
|
margin: 0 0 8px 0;
|
|
line-height: 1;
|
|
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
letter-spacing: -0.5px;
|
|
}
|
|
|
|
.stat-label {
|
|
font-size: 15px;
|
|
color: var(--text-secondary);
|
|
margin: 0;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.8px;
|
|
opacity: 0.8;
|
|
}
|
|
|
|
#WPVersion {
|
|
display: inline-block;
|
|
}
|
|
|
|
/* Enhanced Checkbox Styling */
|
|
.custom-control {
|
|
position: relative;
|
|
display: block;
|
|
min-height: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
}
|
|
|
|
.custom-control-checkbox {
|
|
position: relative;
|
|
display: block;
|
|
min-height: 1.5rem;
|
|
padding-left: 2rem;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input {
|
|
position: absolute;
|
|
left: 0;
|
|
z-index: -1;
|
|
width: 1rem;
|
|
height: 1.25rem;
|
|
opacity: 0;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label {
|
|
position: relative;
|
|
margin-bottom: 0;
|
|
vertical-align: middle;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label::before {
|
|
position: absolute;
|
|
top: 0.25rem;
|
|
left: -2rem;
|
|
display: block;
|
|
width: 1.25rem;
|
|
height: 1.25rem;
|
|
pointer-events: none;
|
|
content: "";
|
|
background-color: var(--bg-primary, #fff);
|
|
border: 2px solid var(--border-color);
|
|
border-radius: var(--radius-sm);
|
|
transition: var(--transition-base);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label::after {
|
|
position: absolute;
|
|
top: 0.25rem;
|
|
left: -2rem;
|
|
display: block;
|
|
width: 1.25rem;
|
|
height: 1.25rem;
|
|
content: "";
|
|
background: no-repeat 50% / 50% 50%;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:checked ~ .custom-control-label::before {
|
|
color: var(--text-on-primary, #fff);
|
|
border-color: var(--primary-color);
|
|
background-color: var(--primary-color);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:checked ~ .custom-control-label::after {
|
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:focus ~ .custom-control-label::before {
|
|
box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
|
|
border-color: var(--primary-color);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:disabled ~ .custom-control-label,
|
|
.custom-control-checkbox .custom-control-input[disabled] ~ .custom-control-label {
|
|
color: var(--text-secondary, #6c757d);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:disabled ~ .custom-control-label::before,
|
|
.custom-control-checkbox .custom-control-input[disabled] ~ .custom-control-label::before {
|
|
background-color: var(--bg-secondary, #e9ecef);
|
|
}
|
|
|
|
/* Enhanced Toggle Switch */
|
|
.custom-control-switch {
|
|
padding-left: 3.5rem;
|
|
}
|
|
|
|
.custom-control-switch .custom-control-label {
|
|
margin-bottom: 0;
|
|
cursor: pointer;
|
|
font-weight: 500;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.custom-control-switch .custom-control-label::before {
|
|
left: -3.5rem;
|
|
width: 3.5rem;
|
|
height: 1.75rem;
|
|
pointer-events: all;
|
|
border-radius: var(--radius-full);
|
|
background-color: var(--bg-secondary, #e2e8f0);
|
|
border: 2px solid var(--border-color, #cbd5e1);
|
|
transition: all var(--transition-base);
|
|
box-shadow: inset 0 2px 4px rgba(0,0,0,0.06);
|
|
}
|
|
|
|
.custom-control-switch .custom-control-label::after {
|
|
top: calc(0.25rem + 2px);
|
|
left: calc(-3.5rem + 4px);
|
|
width: calc(1.75rem - 8px);
|
|
height: calc(1.75rem - 8px);
|
|
background-color: var(--bg-primary, white);
|
|
border-radius: var(--radius-full);
|
|
transition: all var(--transition-base);
|
|
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
|
|
}
|
|
|
|
.custom-control-switch .custom-control-input:checked ~ .custom-control-label::before {
|
|
background: var(--bg-gradient);
|
|
border-color: var(--primary-color);
|
|
box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 0 0 3px rgba(99, 102, 241, 0.2);
|
|
}
|
|
|
|
.custom-control-switch .custom-control-input:checked ~ .custom-control-label::after {
|
|
background-color: var(--bg-primary, white);
|
|
transform: translateX(1.75rem);
|
|
box-shadow: 0 3px 8px rgba(0,0,0,0.2);
|
|
}
|
|
|
|
.custom-control-label {
|
|
position: relative;
|
|
margin-bottom: 0;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.custom-control-label::before,
|
|
.custom-control-label::after {
|
|
position: absolute;
|
|
top: 0.25rem;
|
|
display: block;
|
|
content: "";
|
|
}
|
|
|
|
.custom-control-input {
|
|
position: absolute;
|
|
left: 0;
|
|
z-index: -1;
|
|
width: 1rem;
|
|
height: 1.25rem;
|
|
opacity: 0;
|
|
}
|
|
|
|
.custom-control-input:focus ~ .custom-control-label::before {
|
|
box-shadow: 0 0 0 0.2rem rgba(88, 86, 214, 0.25);
|
|
}
|
|
|
|
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
|
|
border-color: var(--primary-color);
|
|
}
|
|
|
|
.custom-control-input:disabled ~ .custom-control-label,
|
|
.custom-control-input[disabled] ~ .custom-control-label {
|
|
color: var(--text-secondary, #6c757d);
|
|
}
|
|
|
|
.custom-control-input:disabled ~ .custom-control-label::before,
|
|
.custom-control-input[disabled] ~ .custom-control-label::before {
|
|
background-color: var(--bg-secondary, #e9ecef);
|
|
}
|
|
|
|
/* Enhanced Buttons */
|
|
.btn {
|
|
padding: 14px 32px;
|
|
border-radius: var(--radius-lg);
|
|
font-weight: 700;
|
|
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
|
|
border: none;
|
|
font-size: 15px;
|
|
letter-spacing: 0.5px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 12px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.btn::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 0;
|
|
height: 0;
|
|
border-radius: 50%;
|
|
background: rgba(255, 255, 255, 0.25);
|
|
transform: translate(-50%, -50%);
|
|
transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1), height 0.8s cubic-bezier(0.4, 0, 0.2, 1);
|
|
z-index: 0;
|
|
}
|
|
|
|
.btn:active::before {
|
|
width: 400px;
|
|
height: 400px;
|
|
}
|
|
|
|
.btn i {
|
|
font-size: 18px;
|
|
transition: all 0.3s ease;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.btn span {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.btn-primary {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #f5576c 75%, #4facfe 100%);
|
|
color: var(--text-on-primary, white);
|
|
box-shadow: 0 8px 24px rgba(102, 126, 234, 0.4);
|
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
transform: translateY(-4px) scale(1.05);
|
|
box-shadow: 0 12px 32px rgba(102, 126, 234, 0.5);
|
|
background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 25%, #d53f8c 50%, #e53e3e 75%, #3182ce 100%);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
.btn-primary:hover i {
|
|
transform: rotate(360deg) scale(1.2);
|
|
}
|
|
|
|
.btn-danger {
|
|
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
|
|
color: var(--text-on-primary, white);
|
|
box-shadow: 0 4px 16px rgba(239, 68, 68, 0.3);
|
|
}
|
|
|
|
.btn-danger:hover {
|
|
background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
|
|
transform: translateY(-3px) scale(1.02);
|
|
box-shadow: 0 8px 24px rgba(239, 68, 68, 0.4);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
.btn-default {
|
|
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
|
color: var(--text-primary);
|
|
border: 1px solid rgba(226, 232, 240, 0.8);
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
.btn-default:hover {
|
|
background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
|
|
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
|
|
transform: translateY(-2px);
|
|
border-color: rgba(102, 126, 234, 0.3);
|
|
}
|
|
|
|
.btn-outline-primary {
|
|
background: transparent;
|
|
color: var(--primary-color);
|
|
border: 2px solid var(--primary-color);
|
|
box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
|
|
}
|
|
|
|
.btn-outline-primary:hover {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
color: var(--text-on-primary, white);
|
|
border-color: transparent;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.3);
|
|
}
|
|
|
|
.btn-outline-danger {
|
|
background: transparent;
|
|
color: var(--danger-color);
|
|
border: 2px solid var(--danger-color);
|
|
box-shadow: 0 2px 8px rgba(239, 68, 68, 0.2);
|
|
}
|
|
|
|
.btn-outline-danger:hover {
|
|
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
|
|
color: var(--text-on-primary, white);
|
|
border-color: transparent;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 6px 20px rgba(239, 68, 68, 0.3);
|
|
}
|
|
|
|
/* Site Settings Section */
|
|
.settings-section {
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.settings-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
|
|
gap: 20px;
|
|
}
|
|
|
|
.setting-item {
|
|
background: var(--bg-card);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: var(--radius-lg);
|
|
padding: 25px;
|
|
display: flex;
|
|
gap: 20px;
|
|
align-items: center;
|
|
transition: var(--transition-base);
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.setting-item::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 3px;
|
|
background: var(--bg-gradient);
|
|
transform: translateX(-100%);
|
|
transition: transform 0.3s ease;
|
|
}
|
|
|
|
.setting-item:hover {
|
|
box-shadow: var(--shadow-lg);
|
|
border-color: var(--primary-color);
|
|
}
|
|
|
|
.setting-item:hover::before {
|
|
transform: translateX(0);
|
|
}
|
|
|
|
.setting-icon {
|
|
width: 50px;
|
|
height: 50px;
|
|
background: linear-gradient(135deg, var(--primary-light) 0%, var(--bg-light) 100%);
|
|
border-radius: var(--radius-md);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.setting-icon i {
|
|
font-size: 22px;
|
|
background: var(--bg-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
.setting-content {
|
|
flex: 1;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
gap: 20px;
|
|
}
|
|
|
|
.setting-info {
|
|
flex: 1;
|
|
}
|
|
|
|
.setting-info h6 {
|
|
margin: 0 0 5px 0;
|
|
font-size: 16px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.setting-info p {
|
|
margin: 0;
|
|
font-size: 13px;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
/* Simple checkbox styling */
|
|
.checkbox-inline {
|
|
display: inline-block;
|
|
margin: 0;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.checkbox-inline input[type="checkbox"] {
|
|
accent-color: var(--primary-color);
|
|
transform: scale(1.2);
|
|
}
|
|
|
|
/* Enhanced Tables */
|
|
.modern-table-wrapper {
|
|
background: var(--bg-card);
|
|
border-radius: var(--radius-lg);
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow-sm);
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.table {
|
|
margin: 0;
|
|
border: none;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.table thead {
|
|
background: var(--bg-gradient);
|
|
}
|
|
|
|
.table thead th {
|
|
border: none;
|
|
color: var(--text-on-primary, white);
|
|
font-weight: 600;
|
|
padding: 18px;
|
|
font-size: 14px;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.6px;
|
|
}
|
|
|
|
.table tbody tr {
|
|
transition: all var(--transition-base);
|
|
border-bottom: 1px solid var(--border-light);
|
|
}
|
|
|
|
.table tbody tr:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.table tbody tr:hover {
|
|
background: var(--bg-hover);
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.04);
|
|
}
|
|
|
|
.table tbody td {
|
|
padding: 18px;
|
|
border: none;
|
|
vertical-align: middle;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.table-actions {
|
|
display: flex;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
/* Forms */
|
|
.form-group {
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
.form-control {
|
|
border: 1px solid var(--border-color);
|
|
border-radius: var(--radius-sm);
|
|
padding: 12px 15px;
|
|
font-size: 15px;
|
|
transition: all 0.3s ease;
|
|
background: var(--bg-secondary, white);
|
|
}
|
|
|
|
.form-control:focus {
|
|
border-color: var(--primary-color);
|
|
box-shadow: 0 0 0 3px rgba(88, 86, 214, 0.1);
|
|
outline: none;
|
|
}
|
|
|
|
.control-label {
|
|
font-weight: 500;
|
|
color: var(--text-primary);
|
|
margin-bottom: 8px;
|
|
font-size: 14px;
|
|
letter-spacing: 0.3px;
|
|
}
|
|
|
|
/* Progress Bar */
|
|
.progress {
|
|
height: 8px;
|
|
border-radius: 4px;
|
|
background: var(--border-color);
|
|
overflow: hidden;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.progress-bar {
|
|
background: var(--primary-color);
|
|
transition: width 0.3s ease;
|
|
}
|
|
|
|
/* Alerts */
|
|
.alert {
|
|
border-radius: var(--radius-md);
|
|
border: none;
|
|
padding: 15px 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.alert-success {
|
|
background: var(--success-bg, #d1fae5);
|
|
color: var(--success-text, #065f46);
|
|
}
|
|
|
|
.alert-danger {
|
|
background: var(--danger-bg, #fee2e2);
|
|
color: var(--danger-text, #991b1b);
|
|
}
|
|
|
|
.alert-warning {
|
|
background: var(--warning-bg, #fef3c7);
|
|
color: var(--warning-text, #92400e);
|
|
border: 1px solid var(--warning-border, #fde68a);
|
|
}
|
|
|
|
/* Labels */
|
|
.label {
|
|
padding: 4px 12px;
|
|
border-radius: 20px;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.label-success {
|
|
background: var(--success-bg, #d1fae5);
|
|
color: var(--success-text, #065f46);
|
|
}
|
|
|
|
/* Modal Styling */
|
|
.modal-content {
|
|
border-radius: var(--radius-lg);
|
|
border: none;
|
|
box-shadow: var(--shadow-md);
|
|
}
|
|
|
|
.modal-header {
|
|
background: var(--bg-light);
|
|
border-bottom: 1px solid var(--border-color);
|
|
padding: 20px 25px;
|
|
border-radius: var(--radius-lg) var(--radius-lg) 0 0;
|
|
}
|
|
|
|
.modal-title {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.modal-body {
|
|
padding: 25px;
|
|
}
|
|
|
|
.modal-footer {
|
|
background: var(--bg-light);
|
|
border-top: 1px solid var(--border-color);
|
|
padding: 15px 25px;
|
|
border-radius: 0 0 var(--radius-lg) var(--radius-lg);
|
|
}
|
|
|
|
/* Help Tooltip */
|
|
.help_test_domain {
|
|
background: var(--text-primary);
|
|
padding: 12px 15px;
|
|
display: none;
|
|
position: absolute;
|
|
z-index: 1000;
|
|
text-align: left;
|
|
color: var(--text-on-primary, white);
|
|
font-size: 13px;
|
|
border-radius: var(--radius-sm);
|
|
box-shadow: var(--shadow-md);
|
|
max-width: 250px;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
#help:hover + .help_test_domain {
|
|
display: block;
|
|
}
|
|
|
|
/* Loading Spinner */
|
|
#wordpresshomeloading {
|
|
width: 24px;
|
|
height: 24px;
|
|
vertical-align: middle;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
/* Animated Background Elements */
|
|
@keyframes float-slow {
|
|
0%, 100% { transform: translateY(0) rotate(0deg); }
|
|
50% { transform: translateY(-20px) rotate(180deg); }
|
|
}
|
|
|
|
@keyframes float-fast {
|
|
0%, 100% { transform: translateY(0) scale(1); }
|
|
50% { transform: translateY(-30px) scale(1.1); }
|
|
}
|
|
|
|
/* Custom Scrollbar */
|
|
::-webkit-scrollbar {
|
|
width: 10px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: var(--bg-light);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: var(--bg-gradient);
|
|
border-radius: var(--radius-full);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: var(--primary-hover);
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 768px) {
|
|
.container {
|
|
padding: 15px;
|
|
}
|
|
|
|
#page-title {
|
|
padding: 25px;
|
|
border-radius: var(--radius-lg);
|
|
}
|
|
|
|
#page-title h2 {
|
|
font-size: 24px;
|
|
}
|
|
|
|
.tab-content {
|
|
padding: 20px;
|
|
}
|
|
|
|
.nav-tabs {
|
|
padding: 10px 20px 0;
|
|
gap: 5px;
|
|
}
|
|
|
|
.nav-tabs li a {
|
|
padding: 10px 16px;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.site-overview-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.quick-stats {
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 15px;
|
|
}
|
|
|
|
.settings-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.action-links-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.bottom-action-links {
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
|
|
.bottom-action-link {
|
|
width: 100%;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
|
|
/* Additional custom styles */
|
|
.center-div {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.no-margin {
|
|
margin: 0;
|
|
}
|
|
|
|
hr {
|
|
border: none;
|
|
border-top: 1px solid var(--border-color);
|
|
margin: 30px 0;
|
|
}
|
|
|
|
/* Fix for example-box-wrapper */
|
|
.example-box-wrapper {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
/* Tab buttons action area */
|
|
.tab-action-area {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
gap: 15px;
|
|
margin-bottom: 25px;
|
|
padding: 20px;
|
|
background: var(--bg-light);
|
|
border-radius: var(--radius-lg);
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
.action-buttons {
|
|
display: flex;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
/* Enhanced nav tabs design */
|
|
.nav-tabs li a {
|
|
position: relative;
|
|
}
|
|
|
|
.nav-tabs li a::after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 50%;
|
|
width: 0;
|
|
height: 3px;
|
|
background: var(--bg-gradient);
|
|
transform: translateX(-50%);
|
|
transition: width 0.3s ease;
|
|
}
|
|
|
|
.nav-tabs li.active a::after,
|
|
.nav-tabs li a:hover::after {
|
|
width: 80%;
|
|
}
|
|
|
|
/* Loading animation */
|
|
@keyframes spin {
|
|
0% { transform: rotate(0deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
|
|
.fa-spin {
|
|
animation: spin 1s linear infinite;
|
|
}
|
|
|
|
/* Enhanced form elements */
|
|
.form-card {
|
|
background: var(--bg-card);
|
|
padding: 30px;
|
|
border-radius: var(--radius-lg);
|
|
border: 1px solid var(--border-color);
|
|
box-shadow: var(--shadow-sm);
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
/* Badge styles */
|
|
.badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 4px 12px;
|
|
border-radius: var(--radius-full);
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.badge-success {
|
|
background: var(--success-color);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
.badge-danger {
|
|
background: var(--danger-color);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
.badge-info {
|
|
background: var(--info-color);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
/* Additional Modern Enhancements */
|
|
|
|
/* Animated gradient backgrounds */
|
|
@keyframes gradientShift {
|
|
0% { background-position: 0% 50%; }
|
|
50% { background-position: 100% 50%; }
|
|
100% { background-position: 0% 50%; }
|
|
}
|
|
|
|
.gradient-animate {
|
|
background-size: 200% 200%;
|
|
animation: gradientShift 10s ease infinite;
|
|
}
|
|
|
|
/* Plugin/Theme Tables Enhancement */
|
|
.plugins-themes-section {
|
|
position: relative;
|
|
}
|
|
|
|
.table-section-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
/* Enhanced existing staging section */
|
|
.existing-staging-section {
|
|
margin-top: 50px;
|
|
padding-top: 30px;
|
|
border-top: 2px solid var(--border-color);
|
|
}
|
|
|
|
.existing-staging-section h5 {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: 20px;
|
|
font-size: 18px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.existing-staging-section h5::before {
|
|
content: '';
|
|
width: 4px;
|
|
height: 20px;
|
|
background: var(--bg-gradient);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
/* Progress indicators */
|
|
.progress {
|
|
height: 8px;
|
|
border-radius: 4px;
|
|
background: var(--border-color);
|
|
overflow: hidden;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.progress-bar {
|
|
background: var(--bg-gradient);
|
|
transition: width 0.3s ease;
|
|
height: 100%;
|
|
}
|
|
|
|
/* Enhanced modals */
|
|
.modal-content {
|
|
border-radius: var(--radius-xl);
|
|
border: none;
|
|
box-shadow: var(--shadow-xl);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.modal-header {
|
|
background: var(--bg-gradient);
|
|
color: var(--text-on-primary, white);
|
|
border-bottom: none;
|
|
padding: 20px 25px;
|
|
}
|
|
|
|
.modal-title {
|
|
font-weight: 600;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.modal-body {
|
|
padding: 30px;
|
|
}
|
|
|
|
.modal-footer {
|
|
background: var(--bg-light);
|
|
border-top: 1px solid var(--border-color);
|
|
padding: 15px 25px;
|
|
}
|
|
|
|
/* Bottom Actions Enhancement */
|
|
.bottom-actions {
|
|
background: linear-gradient(135deg, var(--bg-light) 0%, var(--bg-card) 100%);
|
|
padding: 30px 40px;
|
|
margin: 40px -30px -30px;
|
|
border-radius: 0 0 var(--radius-xl) var(--radius-xl);
|
|
border-top: 1px solid var(--border-color);
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.bottom-actions::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -100px;
|
|
left: -100px;
|
|
width: 300px;
|
|
height: 300px;
|
|
background: var(--bg-gradient);
|
|
opacity: 0.05;
|
|
border-radius: 50%;
|
|
animation: float 6s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes float {
|
|
0%, 100% { transform: translateY(0); }
|
|
50% { transform: translateY(-20px); }
|
|
}
|
|
|
|
.bottom-action-links {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 20px;
|
|
flex-wrap: wrap;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.bottom-action-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
padding: 14px 28px;
|
|
background: var(--bg-card);
|
|
color: var(--text-primary);
|
|
border-radius: var(--radius-full);
|
|
text-decoration: none;
|
|
transition: var(--transition-base);
|
|
font-weight: 600;
|
|
border: 2px solid transparent;
|
|
font-size: 14px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow-sm);
|
|
}
|
|
|
|
.bottom-action-link::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 0;
|
|
height: 0;
|
|
background: var(--bg-gradient);
|
|
border-radius: 50%;
|
|
transform: translate(-50%, -50%);
|
|
transition: width 0.6s ease, height 0.6s ease;
|
|
z-index: 0;
|
|
}
|
|
|
|
.bottom-action-link:hover::before {
|
|
width: 300px;
|
|
height: 300px;
|
|
}
|
|
|
|
.bottom-action-link:hover {
|
|
color: var(--text-on-primary, white);
|
|
transform: translateY(-3px) scale(1.05);
|
|
box-shadow: var(--shadow-xl);
|
|
border-color: var(--primary-color);
|
|
}
|
|
|
|
.bottom-action-link i,
|
|
.bottom-action-link span {
|
|
position: relative;
|
|
z-index: 1;
|
|
transition: var(--transition-base);
|
|
}
|
|
|
|
.bottom-action-link i {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.bottom-action-link:hover i {
|
|
transform: rotate(360deg);
|
|
}
|
|
|
|
/* Fix panel padding */
|
|
.panel-body {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
/* Fix row spacing in General tab */
|
|
#tab1 .row {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
/* Staging Section Styles */
|
|
.staging-section {
|
|
padding: 0;
|
|
}
|
|
|
|
.section-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 30px;
|
|
padding-bottom: 20px;
|
|
border-bottom: 1px solid var(--border-color);
|
|
}
|
|
|
|
.section-header h4 {
|
|
margin: 0;
|
|
color: var(--text-primary);
|
|
font-weight: 600;
|
|
font-size: 24px;
|
|
}
|
|
|
|
.section-header p {
|
|
margin: 5px 0 0 0;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.restore-link {
|
|
padding: 8px 16px;
|
|
background: var(--bg-light);
|
|
color: var(--text-primary);
|
|
text-decoration: none;
|
|
border-radius: var(--radius-sm);
|
|
font-size: 14px;
|
|
transition: all 0.3s ease;
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
.restore-link:hover {
|
|
background: var(--primary-color);
|
|
color: var(--text-on-primary, white);
|
|
text-decoration: none;
|
|
border-color: var(--primary-color);
|
|
}
|
|
|
|
.form-card {
|
|
background: var(--bg-light);
|
|
padding: 30px;
|
|
border-radius: var(--radius-md);
|
|
border: 1px solid var(--border-color);
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.create-staging-form .form-group {
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
.domain-selection-box {
|
|
background: var(--bg-primary, white);
|
|
padding: 20px;
|
|
border-radius: var(--radius-sm);
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
.domain-option-content {
|
|
margin-top: 15px;
|
|
padding: 15px;
|
|
background: var(--bg-light);
|
|
border-radius: var(--radius-sm);
|
|
}
|
|
|
|
.input-group {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
|
|
.input-group .form-control {
|
|
border-radius: var(--radius-sm) 0 0 var(--radius-sm);
|
|
}
|
|
|
|
.input-group-append {
|
|
margin-left: -1px;
|
|
}
|
|
|
|
.domain-select {
|
|
border-radius: 0 var(--radius-sm) var(--radius-sm) 0 !important;
|
|
border-left: 0;
|
|
background: var(--bg-primary, white);
|
|
min-width: 200px;
|
|
}
|
|
|
|
.existing-staging-section {
|
|
margin-top: 50px;
|
|
padding-top: 30px;
|
|
border-top: 1px solid var(--border-color);
|
|
}
|
|
|
|
.existing-staging-section h5 {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: 20px;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.staging-table {
|
|
background: var(--bg-primary, white);
|
|
}
|
|
|
|
/* Backup Section Styles */
|
|
.backup-section {
|
|
padding: 0;
|
|
}
|
|
|
|
.backup-form {
|
|
margin-top: 30px;
|
|
}
|
|
|
|
.alert-modern {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 15px;
|
|
padding: 20px;
|
|
border-radius: var(--radius-md);
|
|
border: 1px solid;
|
|
}
|
|
|
|
.alert-modern.alert-info {
|
|
background: var(--info-bg, #e0f2fe);
|
|
color: var(--info-text, #0369a1);
|
|
border-color: var(--info-border, #7dd3fc);
|
|
}
|
|
|
|
.alert-modern i {
|
|
font-size: 20px;
|
|
flex-shrink: 0;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.alert-modern p {
|
|
margin: 0 0 8px 0;
|
|
}
|
|
|
|
.alert-modern p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.alert-modern a {
|
|
color: var(--info-accent, #0284c7);
|
|
font-weight: 500;
|
|
}
|
|
|
|
.alert-modern a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
/* Button styling improvements */
|
|
.btn-lg {
|
|
padding: 12px 32px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
/* Form improvements */
|
|
.form-group.row {
|
|
align-items: center;
|
|
}
|
|
|
|
.form-group.row .control-label {
|
|
font-weight: 500;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Site Overview Section */
|
|
.site-overview-section {
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
margin-bottom: 25px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
position: relative;
|
|
}
|
|
|
|
.section-title::before {
|
|
content: '';
|
|
width: 5px;
|
|
height: 28px;
|
|
background: var(--bg-gradient);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.site-overview-grid {
|
|
display: grid;
|
|
grid-template-columns: 380px 1fr;
|
|
gap: 30px;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.site-preview-card {
|
|
background: var(--bg-card);
|
|
border-radius: var(--radius-xl);
|
|
box-shadow: var(--shadow-lg);
|
|
border: 1px solid var(--border-color);
|
|
overflow: hidden;
|
|
position: relative;
|
|
transition: var(--transition-base);
|
|
}
|
|
|
|
.site-preview-card:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: var(--shadow-xl);
|
|
}
|
|
|
|
.preview-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 20px;
|
|
background: linear-gradient(135deg, var(--primary-light) 0%, var(--bg-light) 100%);
|
|
border-bottom: 1px solid var(--border-color);
|
|
}
|
|
|
|
.preview-header h6 {
|
|
margin: 0;
|
|
font-size: 14px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.btn-refresh {
|
|
background: var(--bg-primary, white);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: var(--radius-md);
|
|
padding: 8px 12px;
|
|
cursor: pointer;
|
|
transition: var(--transition-base);
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.btn-refresh:hover {
|
|
background: var(--primary-color);
|
|
color: var(--text-on-primary, white);
|
|
border-color: var(--primary-color);
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.preview-container {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 220px;
|
|
overflow: hidden;
|
|
background: linear-gradient(45deg, #f3f4f6 25%, transparent 25%, transparent 75%, #f3f4f6 75%, #f3f4f6),
|
|
linear-gradient(45deg, #f3f4f6 25%, transparent 25%, transparent 75%, #f3f4f6 75%, #f3f4f6);
|
|
background-size: 20px 20px;
|
|
background-position: 0 0, 10px 10px;
|
|
}
|
|
|
|
.preview-container img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
transition: transform 0.6s ease;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.preview-overlay {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: linear-gradient(135deg, rgba(99, 102, 241, 0.9) 0%, rgba(139, 92, 246, 0.9) 100%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
z-index: 2;
|
|
}
|
|
|
|
.preview-container:hover .preview-overlay {
|
|
opacity: 1;
|
|
}
|
|
|
|
.preview-container:hover img {
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.preview-link {
|
|
color: var(--text-on-primary, white);
|
|
text-decoration: none;
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
padding: 12px 28px;
|
|
background: rgba(255, 255, 255, 0.2);
|
|
border: 2px solid white;
|
|
border-radius: var(--radius-full);
|
|
transition: all 0.3s ease;
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
|
|
.preview-link:hover {
|
|
background: var(--bg-primary, white);
|
|
color: var(--primary-color);
|
|
text-decoration: none;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.2);
|
|
}
|
|
|
|
.preview-actions {
|
|
padding: 20px;
|
|
display: flex;
|
|
gap: 12px;
|
|
justify-content: center;
|
|
background: var(--bg-light);
|
|
border-top: 1px solid var(--border-color);
|
|
}
|
|
|
|
.preview-actions .btn {
|
|
flex: 1;
|
|
}
|
|
|
|
.quick-actions-card {
|
|
background: var(--bg-card);
|
|
border-radius: var(--radius-xl);
|
|
padding: 30px;
|
|
border: 1px solid var(--border-color);
|
|
box-shadow: var(--shadow-sm);
|
|
height: 100%;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.quick-actions-card::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -100px;
|
|
right: -100px;
|
|
width: 200px;
|
|
height: 200px;
|
|
background: var(--bg-gradient);
|
|
opacity: 0.05;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.quick-actions-card h5 {
|
|
margin: 0 0 25px 0;
|
|
font-size: 18px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.quick-actions-card h5::before {
|
|
content: '⚡';
|
|
font-size: 20px;
|
|
}
|
|
|
|
.action-links-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 16px;
|
|
}
|
|
|
|
.action-links-grid a {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
padding: 18px 20px;
|
|
background: linear-gradient(135deg, var(--bg-light) 0%, white 100%);
|
|
color: var(--text-primary);
|
|
border-radius: var(--radius-lg);
|
|
text-decoration: none;
|
|
transition: var(--transition-base);
|
|
font-weight: 600;
|
|
border: 2px solid transparent;
|
|
font-size: 14px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow-sm);
|
|
}
|
|
|
|
.action-links-grid a::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: var(--bg-gradient);
|
|
opacity: 0;
|
|
transition: var(--transition-base);
|
|
z-index: 0;
|
|
}
|
|
|
|
.action-links-grid a:hover {
|
|
transform: translateY(-3px);
|
|
box-shadow: var(--shadow-lg);
|
|
border-color: var(--primary-color);
|
|
color: var(--text-on-primary, white);
|
|
}
|
|
|
|
.action-links-grid a:hover::before {
|
|
opacity: 1;
|
|
}
|
|
|
|
.action-links-grid a > * {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.action-links-grid a svg {
|
|
width: 20px;
|
|
height: 20px;
|
|
transition: var(--transition-base);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.action-links-grid a:hover svg path {
|
|
fill: white;
|
|
}
|
|
|
|
.action-links-grid a i {
|
|
font-size: 18px;
|
|
width: 20px;
|
|
text-align: center;
|
|
flex-shrink: 0;
|
|
background: var(--bg-gradient);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
transition: var(--transition-base);
|
|
}
|
|
|
|
.action-links-grid a:hover i {
|
|
-webkit-text-fill-color: var(--text-on-primary, white);
|
|
}
|
|
|
|
/* Responsive improvements */
|
|
@media (max-width: 992px) {
|
|
.site-overview-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.site-preview-card {
|
|
max-width: 500px;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.section-header {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 15px;
|
|
}
|
|
|
|
.form-card {
|
|
padding: 20px;
|
|
}
|
|
|
|
.form-group.row .control-label {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.domain-select {
|
|
min-width: auto;
|
|
}
|
|
|
|
.action-links-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.site-overview-grid {
|
|
gap: 20px;
|
|
}
|
|
|
|
.quick-actions-card {
|
|
padding: 20px;
|
|
}
|
|
}
|
|
|
|
/* Custom checkbox styling */
|
|
.custom-control-checkbox {
|
|
position: relative;
|
|
display: block;
|
|
min-height: 1.5rem;
|
|
padding-left: 1.5rem;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input {
|
|
position: absolute;
|
|
left: 0;
|
|
z-index: -1;
|
|
width: 1rem;
|
|
height: 1.25rem;
|
|
opacity: 0;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label {
|
|
position: relative;
|
|
margin-bottom: 0;
|
|
vertical-align: middle;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label::before {
|
|
position: absolute;
|
|
top: 0.25rem;
|
|
left: -1.5rem;
|
|
display: block;
|
|
width: 1rem;
|
|
height: 1rem;
|
|
pointer-events: none;
|
|
content: "";
|
|
background-color: var(--bg-primary, #fff);
|
|
border: 1px solid var(--border-color, #adb5bd);
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-label::after {
|
|
position: absolute;
|
|
top: 0.25rem;
|
|
left: -1.5rem;
|
|
display: block;
|
|
width: 1rem;
|
|
height: 1rem;
|
|
content: "";
|
|
background: no-repeat 50% / 50% 50%;
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:checked ~ .custom-control-label::before {
|
|
color: var(--text-on-primary, #fff);
|
|
border-color: var(--primary-color);
|
|
background-color: var(--primary-color);
|
|
}
|
|
|
|
.custom-control-checkbox .custom-control-input:checked ~ .custom-control-label::after {
|
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
|
|
}
|
|
|
|
/* Input group styling */
|
|
.input-group {
|
|
position: relative;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: stretch;
|
|
width: 100%;
|
|
}
|
|
|
|
.input-group > .form-control {
|
|
position: relative;
|
|
flex: 1 1 auto;
|
|
width: 1%;
|
|
min-width: 0;
|
|
margin-bottom: 0;
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
|
|
.input-group-addon {
|
|
padding: 0;
|
|
margin-bottom: 0;
|
|
font-size: 1rem;
|
|
font-weight: 400;
|
|
line-height: 1.25;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
border: 1px solid var(--border-color, #ced4da);
|
|
border-radius: 0.25rem;
|
|
display: flex;
|
|
align-items: center;
|
|
border-top-left-radius: 0;
|
|
border-bottom-left-radius: 0;
|
|
border-left: 0;
|
|
}
|
|
|
|
.input-group-addon select {
|
|
padding: 0.375rem 0.75rem;
|
|
margin: 0;
|
|
border-radius: 0 var(--radius-sm) var(--radius-sm) 0 !important;
|
|
background: var(--bg-secondary, white);
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
function refreshSitePreview() {
|
|
var previewImg = document.getElementById('sitePreviewImage');
|
|
var currentSrc = previewImg.src;
|
|
|
|
// Add a spinner/loading state
|
|
previewImg.style.opacity = '0.5';
|
|
|
|
// Force reload by adding timestamp
|
|
var baseUrl = currentSrc.split('&t=')[0];
|
|
previewImg.src = baseUrl + '&t=' + new Date().getTime();
|
|
|
|
// Restore opacity when loaded
|
|
previewImg.onload = function() {
|
|
previewImg.style.opacity = '1';
|
|
};
|
|
}
|
|
</script>
|
|
|
|
|
|
|
|
<div style="display: none" id="wordpresshome"></div>
|
|
<div style="display: none" id="WPid">{{ wpsite.id }}</div>
|
|
|
|
<div ng-controller="WPsiteHome" class="container">
|
|
|
|
<div id="page-title">
|
|
<h2>{{ wpsite.title }}</h2>
|
|
<p>
|
|
<span>{{ wpsite.path }}</span>
|
|
<span class="status-badge">Active</span>
|
|
<img style="display: none" id="wordpresshomeloading" ng-hide="wordpresshomeloading"
|
|
src="{% static 'images/loading.gif' %}">
|
|
</p>
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<div class="panel-body">
|
|
<h3 class="content-box-header">
|
|
{% trans "WordPress Manager" %}
|
|
</h3>
|
|
|
|
<div class="example-box-wrapper">
|
|
<ul class="nav-responsive nav nav-tabs">
|
|
|
|
<li class="active"><a href="#tab1" data-toggle="tab"
|
|
aria-selected="true"><i class="fas fa-cog"></i> General</a></li>
|
|
<li class=""><a href="#tab2" ng-click="GetCurrentPlugins()"
|
|
data-toggle="tab"><i class="fas fa-plug"></i> Plugins</a></li>
|
|
<li class=""><a href="#tab3" ng-click="GetCurrentThemes()"
|
|
data-toggle="tab"><i class="fas fa-palette"></i> Themes</a></li>
|
|
<li><a href="#tab4" data-toggle="tab" ng-click="fetchstaging()"><i class="fas fa-clone"></i> Staging</a></li>
|
|
<li><a href="#tab5" data-toggle="tab"><i class="fas fa-download"></i> Backups</a></li>
|
|
<li><a ng-click="fetchDatabase()" href="#tab6" data-toggle="tab"><i class="fas fa-database"></i> Database</a></li>
|
|
</ul>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="tab1">
|
|
<!-- Quick Stats -->
|
|
<div class="quick-stats">
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<i class="fas fa-globe"></i>
|
|
</div>
|
|
<p class="stat-value">Active</p>
|
|
<p class="stat-label">Site Status</p>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<i class="fab fa-wordpress"></i>
|
|
</div>
|
|
<p class="stat-value" id="WPVersion">Loading...</p>
|
|
<p class="stat-label">WordPress Version</p>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<i class="fab fa-php"></i>
|
|
</div>
|
|
<p class="stat-value">{{ wpsite.owner.phpSelection }}</p>
|
|
<p class="stat-label">PHP Version</p>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<i class="fas fa-server"></i>
|
|
</div>
|
|
<p class="stat-value">LiteSpeed</p>
|
|
<p class="stat-label">Web Server</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Site Preview and Quick Actions -->
|
|
<div class="site-overview-section">
|
|
<h3 class="section-title">Site Overview</h3>
|
|
<div class="site-overview-grid">
|
|
<!-- Site Preview Card -->
|
|
<div class="site-preview-card">
|
|
<div class="preview-header">
|
|
<h6>🖼️ Live Preview</h6>
|
|
<button class="btn-refresh" onclick="refreshSitePreview()" title="Refresh preview">
|
|
<i class="fas fa-sync-alt"></i>
|
|
</button>
|
|
</div>
|
|
<div class="preview-container">
|
|
<img id="sitePreviewImage"
|
|
src="https://api.microlink.io/?url=http://{{ wpsite.FinalURL }}&screenshot=true&meta=false&embed=screenshot.url"
|
|
alt="{{ wpsite.title }}"
|
|
onerror="this.onerror=null; this.src='https://s.wordpress.org/style/images/about/WordPress-logotype-standard.png';">
|
|
<div class="preview-overlay">
|
|
<a href="http://{{ wpsite.FinalURL }}" target="_blank" class="preview-link">
|
|
<i class="fas fa-external-link-alt"></i>
|
|
Visit Live Site
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="preview-actions">
|
|
<a target="_blank" href="http://{{ wpsite.FinalURL }}" class="btn btn-sm btn-default">
|
|
<i class="fas fa-external-link-alt"></i> Open Site
|
|
</a>
|
|
<a target="_blank" href="{% url 'AutoLogin' %}?id={{ wpsite.id }}" class="btn btn-sm btn-primary">
|
|
<i class="fas fa-sign-in-alt"></i> WP Admin
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions Card -->
|
|
<div class="quick-actions-card">
|
|
<h5>Quick Actions</h5>
|
|
<div class="action-links-grid">
|
|
<a target="_blank" href="/filemanager/{{ wpsite.owner.domain }}?path={{ wpsite.path }}">
|
|
<i class="fas fa-folder-open"></i>
|
|
File Manager
|
|
</a>
|
|
<a target="_blank" href="/websites/{{ wpsite.owner.domain }}/manageGIT">
|
|
<i class="fab fa-git-alt"></i>
|
|
Git Manager
|
|
</a>
|
|
<a href="/dataBases/phpMyAdmin" target="_blank">
|
|
<i class="fas fa-database"></i>
|
|
phpMyAdmin
|
|
</a>
|
|
<a href="/websites/{{ wpsite.owner.domain }}">
|
|
<i class="fas fa-globe"></i>
|
|
Domain Settings
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Site Settings Section -->
|
|
<div class="settings-section">
|
|
<h3 class="section-title">Site Settings</h3>
|
|
<div class="settings-grid">
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-rocket"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>LSCache</h6>
|
|
<p>LiteSpeed caching for better performance</p>
|
|
</div>
|
|
<label class="checkbox-inline">
|
|
<input ng-click="UpdateWPSettings('lscache')"
|
|
type="checkbox"
|
|
id="lscache"
|
|
style="width: 18px; height: 18px; margin-right: 8px; cursor: pointer;">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-lock"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>Password Protection</h6>
|
|
<p>Restrict access with authentication</p>
|
|
</div>
|
|
<div id="prsswdprodata">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-bug"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>Debugging</h6>
|
|
<p>Display errors for development</p>
|
|
</div>
|
|
<label class="checkbox-inline">
|
|
<input ng-click="UpdateWPSettings('debugging')"
|
|
type="checkbox"
|
|
id="debugging"
|
|
style="width: 18px; height: 18px; margin-right: 8px; cursor: pointer;">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-search"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>Search Indexing</h6>
|
|
<p>Allow search engines to index site</p>
|
|
</div>
|
|
<label class="checkbox-inline">
|
|
<input type="checkbox"
|
|
id="searchIndex"
|
|
ng-click="UpdateWPSettings('searchIndex')"
|
|
ng-checked="searchIndex == 1"
|
|
style="width: 18px; height: 18px; margin-right: 8px; cursor: pointer;">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-tools"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>Maintenance Mode</h6>
|
|
<p>Show maintenance message to visitors</p>
|
|
</div>
|
|
<label class="checkbox-inline">
|
|
<input ng-click="UpdateWPSettings('maintenanceMode')"
|
|
type="checkbox"
|
|
id="maintenanceMode"
|
|
style="width: 18px; height: 18px; margin-right: 8px; cursor: pointer;">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="setting-item">
|
|
<div class="setting-icon">
|
|
<i class="fas fa-clock"></i>
|
|
</div>
|
|
<div class="setting-content">
|
|
<div class="setting-info">
|
|
<h6>WP Cron</h6>
|
|
<p>Disable built-in WordPress cron</p>
|
|
</div>
|
|
<label class="checkbox-inline">
|
|
<input ng-click="UpdateWPSettings('Wpcron')"
|
|
type="checkbox"
|
|
id="Wpcron"
|
|
style="width: 18px; height: 18px; margin-right: 8px; cursor: pointer;">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<span style="display: none" id="#checkjq"></span>
|
|
</div>
|
|
<div class="tab-pane" id="tab2">
|
|
<div class="tab-action-area">
|
|
<div>
|
|
<h4 style="margin: 0; font-weight: 600; color: var(--text-primary);">Installed Plugins</h4>
|
|
<p style="margin: 5px 0 0 0; color: var(--text-secondary); font-size: 14px;">Manage your WordPress plugins</p>
|
|
</div>
|
|
<div class="action-buttons">
|
|
<a ng-click="UpdatePlugins('all')"
|
|
href="javascript:void(0);"
|
|
class="btn btn-primary">
|
|
<i class="fas fa-sync-alt"></i>
|
|
Update All
|
|
</a>
|
|
<a ng-click="UpdatePlugins('selected')"
|
|
href="javascript:void(0);"
|
|
class="btn btn-default">
|
|
<i class="fas fa-check-circle"></i>
|
|
Update Selected
|
|
</a>
|
|
<button data-toggle="modal" data-target="#DeleteWebsite"
|
|
ng-click="DeletePlugins('selected')"
|
|
aria-label=""
|
|
class="btn btn-danger"
|
|
type="button">
|
|
<i class="fas fa-trash"></i>
|
|
Delete Selected
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<table class="table table-hover mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
{% comment %}<div class="custom-control custom-checkbox" style="padding-left: 0px">
|
|
<input type="checkbox" id="CheckAll">
|
|
<label for="CheckAll"></label>
|
|
</div>{% endcomment %}
|
|
</th>
|
|
<th>Plugin</th>
|
|
<th>State</th>
|
|
<th>Updates</th>
|
|
<th>Version</th>
|
|
<th>Delete</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="PluginBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="tab-pane" id="tab3">
|
|
<div class="tab-action-area">
|
|
<div>
|
|
<h4 style="margin: 0; font-weight: 600; color: var(--text-primary);">Installed Themes</h4>
|
|
<p style="margin: 5px 0 0 0; color: var(--text-secondary); font-size: 14px;">Manage your WordPress themes</p>
|
|
</div>
|
|
<div class="action-buttons">
|
|
<a ng-click="UpdateThemes('all')" href="javascript:void(0);"
|
|
class="btn btn-primary">
|
|
<i class="fas fa-sync-alt"></i>
|
|
Update All
|
|
</a>
|
|
<a ng-click="UpdateThemes('selected')"
|
|
href="javascript:void(0);"
|
|
class="btn btn-default">
|
|
<i class="fas fa-check-circle"></i>
|
|
Update Selected
|
|
</a>
|
|
<button data-toggle="modal" data-target="#DeleteWebsite"
|
|
ng-click="DeleteThemes('selected')"
|
|
aria-label=""
|
|
class="btn btn-danger"
|
|
type="button">
|
|
<i class="fas fa-trash"></i>
|
|
Delete Selected
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<table class="table table-hover mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
{% comment %}<div class="custom-control custom-checkbox" style="padding-left: 0px">
|
|
<input type="checkbox" id="CheckAll">
|
|
<label for="CheckAll"></label>
|
|
</div>{% endcomment %}
|
|
</th>
|
|
<th>Theme</th>
|
|
<th>State</th>
|
|
<th>Updates</th>
|
|
<th>Version</th>
|
|
<th>Delete</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="ThemeBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="tab-pane" id="tab4">
|
|
<div class="staging-section">
|
|
<div class="section-header">
|
|
<h4>Create Staging Site</h4>
|
|
<p class="text-muted">Create a copy of your WordPress site for testing and development</p>
|
|
</div>
|
|
|
|
<div ng-hide="stagingDetailsForm" class="create-staging-form">
|
|
<div class="form-card">
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 control-label">Staging Name</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="stagingName" placeholder="Enter staging site name (e.g., staging, dev, test)">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 control-label">Staging Domain</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="stagingDomainName"
|
|
ng-model="stagingDomainName"
|
|
placeholder="Enter staging domain (e.g., staging.example.com)"
|
|
required>
|
|
<small class="form-text text-muted">Enter the full domain name for your staging site</small>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group row">
|
|
<div class="col-sm-12 text-center">
|
|
<button ng-click="CreateStagingNow()" class="btn btn-primary btn-lg">
|
|
<i class="fas fa-clone"></i>
|
|
Create Staging Site
|
|
</button>
|
|
<div id="stagingStatus" style="margin-top: 15px; font-weight: 500;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="margin-top: 1%" ng-hide="installationProgress" class="form-group">
|
|
<div class="row">
|
|
<label class="col-sm-2 control-label"></label>
|
|
<div class="col-sm-7">
|
|
|
|
<div class="alert alert-success text-center">
|
|
<h2>{$ currentStatus $}</h2>
|
|
</div>
|
|
|
|
<div class="progress">
|
|
<div id="installProgress" class="progress-bar"
|
|
role="progressbar" aria-valuenow="70"
|
|
aria-valuemin="0" aria-valuemax="100"
|
|
style="width:0%">
|
|
<span class="sr-only">70% Complete</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-hide="errorMessageBox" class="alert alert-danger">
|
|
<p>{% trans "Error message:" %} {$ errorMessage $}</p>
|
|
</div>
|
|
|
|
<div ng-hide="success" class="alert alert-success">
|
|
<p>{% trans "Website succesfully created." %}</p>
|
|
</div>
|
|
|
|
|
|
<div ng-hide="couldNotConnect" class="alert alert-danger">
|
|
<p>{% trans "Could not connect to server. Please refresh this page." %}</p>
|
|
</div>
|
|
|
|
<div style="margin-top: 20px; text-align: center;">
|
|
<button type="button" ng-disabled="goBackDisable"
|
|
ng-click="goBack()"
|
|
class="btn btn-default">
|
|
<i class="fas fa-arrow-left"></i>
|
|
{% trans "Go Back" %}
|
|
</button>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Existing Staging Sites -->
|
|
<div class="existing-staging-section" style="margin-top: 40px; clear: both;">
|
|
<div class="section-header">
|
|
<h4>Existing Staging Sites</h4>
|
|
<p class="text-muted">Manage your staging environments</p>
|
|
</div>
|
|
<div class="form-card">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover staging-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Domain</th>
|
|
<th>Path</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="StagingBody">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="tab-pane" id="tab5">
|
|
<div class="backup-section">
|
|
<div class="section-header">
|
|
<h4>{% trans "Create Backup" %}</h4>
|
|
<a href="{% url 'RestoreBackups' %}" class="restore-link">
|
|
<i class="fas fa-undo"></i> {% trans "Restore Backups" %}
|
|
</a>
|
|
</div>
|
|
|
|
<div class="alert alert-info alert-modern">
|
|
<i class="fas fa-info-circle"></i>
|
|
<div>
|
|
<p>This feature will create a backup of your WordPress website.</p>
|
|
<p>For scheduled remote backups of your entire site, including email accounts and DNS records, <a href="/backup/OneClickBackups">click here</a>.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-hide="installationDetailsForm" class="backup-form">
|
|
<div class="form-card">
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 control-label">{% trans "Backup Type" %}</label>
|
|
<div class="col-sm-9">
|
|
<select id="backuptype" class="form-control">
|
|
<option value="1">Website and Database Both</option>
|
|
<option value="2">Only Website Data</option>
|
|
<option value="3">Only Database</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<div class="col-sm-12 text-center">
|
|
<button type="button" id="createbackupbutton"
|
|
ng-click="CreateBackup()"
|
|
class="btn btn-primary btn-lg">
|
|
<i class="fas fa-download"></i>
|
|
{% trans "Create Backup" %}
|
|
</button>
|
|
<div id="backupStatus" style="margin-top: 15px; font-weight: 500;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="margin-top: 1%" ng-hide="installationProgress"
|
|
class="form-group">
|
|
<label class="col-sm-2 control-label"></label>
|
|
<div class="col-sm-7">
|
|
|
|
<div class="alert alert-success text-center">
|
|
<h2>{$ currentStatus $}</h2>
|
|
</div>
|
|
|
|
<div class="progress">
|
|
<div id="installProgressbackup" class="progress-bar"
|
|
role="progressbar" aria-valuenow="70"
|
|
aria-valuemin="0" aria-valuemax="100"
|
|
style="width:0%">
|
|
<span class="sr-only">70% Complete</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-hide="errorMessageBox" class="alert alert-danger">
|
|
<p>{% trans "Error message:" %} {$ errorMessage $}</p>
|
|
</div>
|
|
|
|
<div ng-hide="success" class="alert alert-success">
|
|
<p>{% trans "Backup succesfully created." %}</p>
|
|
</div>
|
|
|
|
|
|
<div ng-hide="couldNotConnect" class="alert alert-danger">
|
|
<p>{% trans "Could not connect to server. Please refresh this page." %}</p>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<div ng-hide="installationProgress" class="form-group center-div">
|
|
<div class="col-sm-12">
|
|
<button type="button" ng-disabled="goBackDisable"
|
|
ng-click="goBack()"
|
|
class="btn btn-default center-div">
|
|
<i class="fas fa-arrow-left"></i>
|
|
{% trans "Go Back" %}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane" id="tab6">
|
|
<div class="panel-body" style="padding: 0;">
|
|
<h4 style="margin-bottom: 25px; color: var(--text-primary); font-weight: 600;">
|
|
{% trans "Database Information" %}
|
|
</h4>
|
|
<div class="example-box-wrapper">
|
|
<form action="/" class="form-horizontal bordered-row panel-body">
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label mb-5"
|
|
style="padding-top: 0px;">{% trans "Database Name" %}</label>
|
|
<div class="col-sm-1 mb-10">
|
|
<a target="_blank" href="/dataBases/phpMyAdmin">
|
|
<div id="DB_Name" class="mb-10 text-bold"></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label mb-5"
|
|
style="padding-top: 0px;">{% trans "Database User" %}</label>
|
|
<div class="col-sm-1 mb-10">
|
|
<div id="DB_User" class="mb-10 text-bold"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label mb-5"
|
|
style="padding-top: 0px;">{% trans "Table Prefix" %}</label>
|
|
<div class="col-sm-1 mb-10">
|
|
<div id="tableprefix" class="mb-10 text-bold"></div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="bottom-actions">
|
|
<div class="bottom-action-links">
|
|
<a href="/websites/{{ wpsite.owner.domain }}" class="bottom-action-link">
|
|
<i class="fas fa-th-large"></i>
|
|
<span>Manage Application</span>
|
|
</a>
|
|
<a data-toggle="modal"
|
|
data-target="#autoUpdateConfig"
|
|
href="javascript: void(0);"
|
|
class="bottom-action-link">
|
|
<i class="fas fa-sync-alt"></i>
|
|
<span>Autoupdate Configurations</span>
|
|
</a>
|
|
<a data-toggle="modal"
|
|
data-target="#securitymodel"
|
|
href="javascript: void(0);"
|
|
class="bottom-action-link">
|
|
<i class="fas fa-shield-alt"></i>
|
|
<span>Security</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!------------------MOdael for passwd protection-------->
|
|
<div id="Passwordprotection" class="modal fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<!-- Modal content-->
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">×
|
|
</button>
|
|
<h4 class="modal-title">Enable Password Protection
|
|
<img ng-hide="$parent.cyberPanelLoading"
|
|
src="/static/images/loading.gif"
|
|
style="display: none;">
|
|
</h4>
|
|
</div>
|
|
<div class="modal-body" style="height: 100px;">
|
|
|
|
<div>
|
|
<label class="col-sm-4">Username</label>
|
|
<input ng-model="$parent.PPUsername" required class="col-lg-8"
|
|
type="text" placeholder="Username">
|
|
|
|
</div>
|
|
<div style="margin-top: 36px;">
|
|
<label class="col-sm-4">Password</label>
|
|
<input ng-model="$parent.PPPassword" required class="col-lg-8"
|
|
type="password" placeholder="*******************">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-primary"
|
|
ng-click="UpdateWPSettings('PasswordProtection')">Yes
|
|
</button>
|
|
<button type="button" ng-disabled="savingSettings"
|
|
class="btn btn-default" data-dismiss="modal">
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!------------------End MOdael for passwd protection-------->
|
|
|
|
<!-------Start Model of AutoUpdateCongiguration-->
|
|
<div id="autoUpdateConfig" class="modal fade" tabindex="-1" role="dialog"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
|
|
<!-- Modal content-->
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">
|
|
×
|
|
</button>
|
|
<h4 class="modal-title">{% trans "Updates" %}</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form>
|
|
|
|
<h4 style="margin: 2%">Configure setting for automatic
|
|
updates.</h4>
|
|
<div class="row">
|
|
<label class="col-lg-6">Automatic Updates
|
|
(Currently:
|
|
{{ wpsite.AutoUpdates }})</label>
|
|
<div class="col-lg-6">
|
|
<select id="AutomaticUpdates"
|
|
style="padding: 10px">
|
|
<option>Disabled</option>
|
|
<option>Minor and Security Updates</option>
|
|
<option>All minor and major</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label class="col-lg-4">Plugins
|
|
(Currently: {{ wpsite.PluginUpdates }})</label>
|
|
<div class="col-lg-8">
|
|
<select id="Plugins"
|
|
|
|
style="padding: 10px">
|
|
<option>Enabled</option>
|
|
<option>Disabled</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<label class="col-lg-4">Themes
|
|
(Currently: {{ wpsite.ThemeUpdates }})</label>
|
|
<div class="col-lg-8">
|
|
<select id="Themes"
|
|
|
|
style="padding: 10px">
|
|
<option>Enabled</option>
|
|
<option>Disabled</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-primary"
|
|
ng-click="SaveUpdateConfig()">Save
|
|
</button>
|
|
<button type="button" ng-disabled="savingSettings"
|
|
class="btn btn-default" data-dismiss="modal">
|
|
Close
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<!-------End Model of AutoUpdateCongiguration-->
|
|
|
|
<!-------Start Model of Security-->
|
|
<div id="securitymodel" class="modal fade" tabindex="-1" role="dialog"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
|
|
<!-- Modal content-->
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">
|
|
×
|
|
</button>
|
|
<h4 class="modal-title">{% trans "Security" %}<img style="display: none"
|
|
id="wordpresshomeloadingsec"
|
|
ng-hide="wordpresshomeloading"
|
|
src="{% static 'images/loading.gif' %}"></h4>
|
|
</div>
|
|
<div class="modal-body center-div">
|
|
<div class="alert alert-warning">
|
|
<h4 class="alert-title">Status</h4>
|
|
<p id="SecurityResult"></p>
|
|
</div>
|
|
<button
|
|
data-toggle="modal"
|
|
data-target="#DeleteMember" aria-label=""
|
|
ng-click="dataintegrity()"
|
|
type="button" class="btn btn-outline-primary">
|
|
<i class="fas fa-check-circle"></i>
|
|
Data Integrity
|
|
</button>
|
|
<button
|
|
data-toggle="modal"
|
|
data-target="#DeleteMember" aria-label=""
|
|
ng-click="installwpcore()"
|
|
type="button" class="btn btn-outline-primary" style="margin-left: 10px;">
|
|
<i class="fas fa-redo"></i>
|
|
Re-Install WP Core
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<!-------End Model of Security-->
|
|
<div id="DeployToProduction" class="modal fade" role="dialog">
|
|
<div class="modal-dialog">
|
|
<!-- Modal content-->
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">×
|
|
</button>
|
|
<h4 class="modal-title">DeployToProduction
|
|
<img ng-hide="$parent.cyberPanelLoading"
|
|
src="/static/images/loading.gif"
|
|
style="display: none;">
|
|
</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p class="no-margin">When you deploy a
|
|
staging site to production, the main
|
|
site is completely restored with the
|
|
staging site, so if you have made
|
|
any changes to main site they will
|
|
be lost.</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-primary"
|
|
ng-click="FinalDeployToProduction()" data-dismiss="modal">Yes
|
|
</button>
|
|
<button type="button" ng-disabled="savingSettings"
|
|
class="btn btn-default" data-dismiss="modal">
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
{% endblock %} |