django phase2.3.4.

This commit is contained in:
IGNY8 VPS (Salman)
2025-12-14 15:10:41 +00:00
parent d161378bd9
commit eb88a0e12d
13 changed files with 2880 additions and 31 deletions

View File

@@ -1,13 +1,17 @@
/* ===================================================================
IGNY8 CUSTOM ADMIN STYLES
IGNY8 CUSTOM ADMIN STYLES - COMPLETE REDESIGN
===================================================================
Using IGNY8 brand colors from frontend design system
Using exact IGNY8 brand colors from frontend design system
=================================================================== */
/* IGNY8 Brand Color Variables */
/* IGNY8 Brand Color Variables - Matching Frontend App */
:root {
/* Primary Colors */
--igny8-primary: #0693e3; /* Primary brand blue */
--igny8-primary-dark: #0472b8; /* Primary dark */
--igny8-primary-light: #3da9e8; /* Primary light */
/* Accent Colors */
--igny8-success: #0bbf87; /* Success teal-green */
--igny8-success-dark: #08966b; /* Success dark */
--igny8-warning: #ff7a00; /* Warning orange */
@@ -16,34 +20,560 @@
--igny8-danger-dark: #d13333; /* Danger dark */
--igny8-purple: #5d4ae3; /* Purple accent */
--igny8-purple-dark: #3a2f94; /* Purple dark */
/* Neutral Colors */
--igny8-navy: #0d1b2a; /* Dark navy background */
--igny8-navy-light: #142b3f; /* Navy light */
--igny8-navy-light: #1a2e44; /* Navy light */
--igny8-surface: #f8fafc; /* Page background */
--igny8-panel: #ffffff; /* Panel background */
--igny8-text: #555a68; /* Main text */
--igny8-text-dim: #64748b; /* Dimmed text */
--igny8-text: #1e293b; /* Main text */
--igny8-text-light: #64748b; /* Light text */
--igny8-text-dim: #94a3b8; /* Dimmed text */
--igny8-stroke: #e2e8f0; /* Borders */
--igny8-stroke-dark: #cbd5e1; /* Dark borders */
}
/* ===================================================================
HEADER & BRANDING - IGNY8 Primary Blue with Gradient
GLOBAL RESETS
=================================================================== */
body {
background: var(--igny8-surface) !important;
color: var(--igny8-text) !important;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
/* ===================================================================
HEADER - Clean Professional Design
=================================================================== */
#header {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
padding: 0 !important;
}
#header a:link, #header a:visited {
#branding {
padding: 16px 30px !important;
}
#branding h1 {
margin: 0 !important;
font-size: 20px !important;
font-weight: 600 !important;
}
#branding h1 a:link,
#branding h1 a:visited {
color: white !important;
text-decoration: none !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
}
#header a:link,
#header a:visited {
color: white !important;
}
#branding h1, #branding h1 a:link, #branding h1 a:visited {
color: white !important;
/* ===================================================================
ADD RECORD BUTTON - Modern Accent Color
=================================================================== */
.object-tools {
margin-bottom: 24px !important;
float: right !important;
}
.header-user-tools a {
.object-tools li {
margin: 0 !important;
list-style: none !important;
}
.object-tools a.addlink {
background: linear-gradient(135deg, var(--igny8-success) 0%, var(--igny8-success-dark) 100%) !important;
color: white !important;
padding: 12px 28px !important;
border-radius: 8px !important;
font-weight: 600 !important;
font-size: 14px !important;
text-decoration: none !important;
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
box-shadow: 0 2px 6px rgba(11, 191, 135, 0.3) !important;
transition: all 0.2s ease !important;
border: none !important;
text-transform: none !important;
}
.object-tools a.addlink:before {
content: "\f067" !important;
font-family: "Font Awesome 6 Free" !important;
font-weight: 900 !important;
font-size: 14px !important;
margin-right: 0 !important;
background: none !important;
border: none !important;
width: auto !important;
height: auto !important;
}
.object-tools a.addlink:hover {
background: linear-gradient(135deg, var(--igny8-success-dark) 0%, #067354 100%) !important;
box-shadow: 0 4px 12px rgba(11, 191, 135, 0.4) !important;
transform: translateY(-2px) !important;
}
/* ===================================================================
EXPORT BUTTON - Purple Accent
=================================================================== */
a[href*="export"],
.export-button,
input[name="_export"] {
background: linear-gradient(135deg, var(--igny8-purple) 0%, var(--igny8-purple-dark) 100%) !important;
color: white !important;
padding: 10px 24px !important;
border-radius: 8px !important;
font-weight: 600 !important;
font-size: 13px !important;
text-decoration: none !important;
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
box-shadow: 0 2px 6px rgba(93, 74, 227, 0.3) !important;
transition: all 0.2s ease !important;
border: none !important;
cursor: pointer !important;
}
a[href*="export"]:hover,
.export-button:hover,
input[name="_export"]:hover {
background: linear-gradient(135deg, var(--igny8-purple-dark) 0%, #2a1f6b 100%) !important;
box-shadow: 0 4px 12px rgba(93, 74, 227, 0.4) !important;
transform: translateY(-2px) !important;
}
/* ===================================================================
SEARCH BAR & TOOLBAR - Professional Layout
=================================================================== */
#toolbar {
padding: 20px 24px !important;
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 12px !important;
margin-bottom: 24px !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
#toolbar form {
display: flex !important;
gap: 12px !important;
align-items: center !important;
}
#toolbar input[type="text"],
#searchbar {
flex: 1 !important;
min-width: 320px !important;
max-width: 500px !important;
padding: 12px 18px !important;
border: 1.5px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
font-size: 14px !important;
transition: all 0.2s ease !important;
background: var(--igny8-panel) !important;
color: var(--igny8-text) !important;
}
#toolbar input[type="text"]:focus,
#searchbar:focus {
border-color: var(--igny8-primary) !important;
outline: none !important;
box-shadow: 0 0 0 4px rgba(6, 147, 227, 0.1) !important;
}
#toolbar input[type="submit"],
#toolbar button[type="submit"] {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
padding: 12px 28px !important;
border: none !important;
border-radius: 8px !important;
font-weight: 600 !important;
font-size: 14px !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 6px rgba(6, 147, 227, 0.3) !important;
}
#toolbar input[type="submit"]:hover,
#toolbar button[type="submit"]:hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 12px rgba(6, 147, 227, 0.4) !important;
transform: translateY(-2px) !important;
}
/* ===================================================================
ACTIONS BAR - Better Styling
=================================================================== */
#changelist-form .actions {
padding: 20px 24px !important;
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 12px !important;
margin-bottom: 24px !important;
display: flex !important;
align-items: center !important;
gap: 16px !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
#changelist-form .actions label {
font-weight: 600 !important;
color: var(--igny8-text) !important;
font-size: 14px !important;
margin-right: 0 !important;
}
#changelist-form .actions select {
min-width: 240px !important;
padding: 12px 18px !important;
border: 1.5px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
font-size: 14px !important;
transition: all 0.2s ease !important;
background: var(--igny8-panel) !important;
color: var(--igny8-text) !important;
}
#changelist-form .actions select:focus {
border-color: var(--igny8-primary) !important;
outline: none !important;
box-shadow: 0 0 0 4px rgba(6, 147, 227, 0.1) !important;
}
#changelist-form .actions button,
#changelist-form .actions input[type="submit"] {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
padding: 12px 28px !important;
border: none !important;
border-radius: 8px !important;
font-weight: 600 !important;
font-size: 14px !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 6px rgba(6, 147, 227, 0.3) !important;
}
#changelist-form .actions button:hover,
#changelist-form .actions input[type="submit"]:hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 12px rgba(6, 147, 227, 0.4) !important;
transform: translateY(-2px) !important;
}
/* ===================================================================
FILTERS PANEL - Clear Organization
=================================================================== */
#changelist-filter {
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 12px !important;
padding: 0 !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
#changelist-filter h2 {
background: linear-gradient(135deg, var(--igny8-navy) 0%, var(--igny8-navy-light) 100%) !important;
color: white !important;
padding: 18px 24px !important;
margin: 0 !important;
font-size: 16px !important;
font-weight: 600 !important;
border-radius: 12px 12px 0 0 !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
}
#changelist-filter h2:before {
content: "\f0b0" !important;
font-family: "Font Awesome 6 Free" !important;
font-weight: 900 !important;
}
#changelist-filter h3 {
background: var(--igny8-surface) !important;
color: var(--igny8-text) !important;
padding: 14px 24px !important;
margin: 0 !important;
font-size: 14px !important;
font-weight: 600 !important;
border-top: 1px solid var(--igny8-stroke) !important;
border-bottom: 1px solid var(--igny8-stroke) !important;
}
#changelist-filter ul {
padding: 16px 24px !important;
margin: 0 !important;
}
#changelist-filter li {
padding: 0 !important;
margin: 0 0 8px 0 !important;
list-style: none !important;
}
#changelist-filter a {
color: var(--igny8-text) !important;
text-decoration: none !important;
display: block !important;
padding: 10px 16px !important;
border-radius: 6px !important;
transition: all 0.2s ease !important;
font-size: 14px !important;
}
#changelist-filter a:hover {
background: var(--igny8-surface) !important;
color: var(--igny8-primary) !important;
}
#changelist-filter a.selected {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
font-weight: 600 !important;
box-shadow: 0 2px 4px rgba(6, 147, 227, 0.2) !important;
}
#changelist-filter .quiet {
color: var(--igny8-text-dim) !important;
font-size: 13px !important;
}
/* ===================================================================
ADD RECORD BUTTON - Clean Professional Style
=================================================================== */
.object-tools {
margin-bottom: 20px !important;
}
.object-tools li {
margin: 0 !important;
}
.object-tools a.addlink {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
padding: 12px 24px !important;
border-radius: 8px !important;
font-weight: 600 !important;
font-size: 14px !important;
text-decoration: none !important;
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
box-shadow: 0 2px 4px rgba(6, 147, 227, 0.3) !important;
transition: all 0.2s ease !important;
border: none !important;
}
.object-tools a.addlink:before {
content: "+" !important;
font-size: 18px !important;
font-weight: bold !important;
margin-right: 0 !important;
background: none !important;
border: none !important;
width: auto !important;
height: auto !important;
}
.object-tools a.addlink:hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 8px rgba(6, 147, 227, 0.4) !important;
transform: translateY(-1px) !important;
}
/* Remove the background from the + icon */
.object-tools a.addlink:before {
background: none !important;
}
/* ===================================================================
SEARCH & ACTION BAR - Better Sizing and Layout
=================================================================== */
#toolbar {
padding: 16px 20px !important;
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
margin-bottom: 20px !important;
display: flex !important;
gap: 16px !important;
align-items: center !important;
flex-wrap: wrap !important;
}
#toolbar form {
display: flex !important;
gap: 12px !important;
align-items: center !important;
flex: 1 !important;
max-width: 600px !important;
}
#toolbar input[type="text"] {
flex: 1 !important;
min-width: 250px !important;
padding: 10px 16px !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 6px !important;
font-size: 14px !important;
transition: all 0.2s ease !important;
}
#toolbar input[type="text"]:focus {
border-color: var(--igny8-primary) !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(6, 147, 227, 0.1) !important;
}
#toolbar input[type="submit"],
#toolbar button[type="submit"] {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
padding: 10px 24px !important;
border: none !important;
border-radius: 6px !important;
font-weight: 600 !important;
font-size: 14px !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 4px rgba(6, 147, 227, 0.2) !important;
}
#toolbar input[type="submit"]:hover,
#toolbar button[type="submit"]:hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 8px rgba(6, 147, 227, 0.3) !important;
transform: translateY(-1px) !important;
}
/* Action dropdown */
#changelist-form .actions {
padding: 16px 20px !important;
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
margin-bottom: 20px !important;
}
#changelist-form .actions select {
min-width: 220px !important;
padding: 10px 16px !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 6px !important;
font-size: 14px !important;
margin-right: 12px !important;
transition: all 0.2s ease !important;
}
#changelist-form .actions select:focus {
border-color: var(--igny8-primary) !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(6, 147, 227, 0.1) !important;
}
#changelist-form .actions button,
#changelist-form .actions input[type="submit"] {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
padding: 10px 24px !important;
border: none !important;
border-radius: 6px !important;
font-weight: 600 !important;
font-size: 14px !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 4px rgba(6, 147, 227, 0.2) !important;
}
#changelist-form .actions button:hover,
#changelist-form .actions input[type="submit"]:hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 8px rgba(6, 147, 227, 0.3) !important;
transform: translateY(-1px) !important;
}
/* ===================================================================
FILTERS - Clear Labels and Better Organization
=================================================================== */
#changelist-filter {
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
padding: 0 !important;
}
#changelist-filter h2 {
background: linear-gradient(135deg, var(--igny8-navy) 0%, var(--igny8-navy-light) 100%) !important;
color: white !important;
padding: 16px 20px !important;
margin: 0 !important;
font-size: 16px !important;
font-weight: 600 !important;
border-radius: 8px 8px 0 0 !important;
}
#changelist-filter h3 {
background: var(--igny8-surface) !important;
color: var(--igny8-text) !important;
padding: 12px 20px !important;
margin: 0 !important;
font-size: 14px !important;
font-weight: 600 !important;
border-top: 1px solid var(--igny8-stroke) !important;
border-bottom: 1px solid var(--igny8-stroke) !important;
}
#changelist-filter ul {
padding: 12px 20px !important;
margin: 0 0 16px 0 !important;
}
#changelist-filter li {
padding: 8px 0 !important;
margin: 0 !important;
list-style: none !important;
}
#changelist-filter a {
color: var(--igny8-text) !important;
text-decoration: none !important;
display: block !important;
padding: 6px 12px !important;
border-radius: 4px !important;
transition: all 0.2s ease !important;
font-size: 14px !important;
}
#changelist-filter a:hover {
background: var(--igny8-surface) !important;
color: var(--igny8-primary) !important;
}
#changelist-filter a.selected {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
font-weight: 600 !important;
}
#changelist-filter .quiet {
color: var(--igny8-text-dim) !important;
font-size: 13px !important;
}
/* ===================================================================
@@ -271,6 +801,217 @@
background: var(--igny8-danger-dark) !important;
}
/* ===================================================================
SIDEBAR MODULE "ADD" LINKS - Icon Only with Theme Colors
=================================================================== */
.module .addlink,
.module a.addlink,
#content-main .module .addlink {
color: var(--igny8-text) !important;
text-decoration: none !important;
font-size: 0 !important;
padding: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
transition: all 0.2s ease !important;
}
.module .addlink:before,
.module a.addlink:before {
content: "\f067" !important;
font-family: "Font Awesome 6 Free" !important;
font-weight: 900 !important;
font-size: 12px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 24px !important;
height: 24px !important;
border-radius: 6px !important;
background: linear-gradient(135deg, var(--igny8-success) 0%, var(--igny8-success-dark) 100%) !important;
color: white !important;
margin: 0 !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 4px rgba(11, 191, 135, 0.2) !important;
}
.module .addlink:hover:before,
.module a.addlink:hover:before {
background: linear-gradient(135deg, var(--igny8-success-dark) 0%, #067354 100%) !important;
box-shadow: 0 4px 8px rgba(11, 191, 135, 0.3) !important;
transform: translateY(-1px) scale(1.05) !important;
}
/* Module navigation styling */
.module {
margin-bottom: 20px !important;
background: var(--igny8-panel) !important;
border: 1px solid var(--igny8-stroke) !important;
border-radius: 8px !important;
overflow: hidden !important;
}
.module h2 {
background: linear-gradient(135deg, var(--igny8-navy) 0%, var(--igny8-navy-light) 100%) !important;
color: white !important;
padding: 14px 16px !important;
font-size: 14px !important;
font-weight: 600 !important;
margin: 0 !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
}
.module table {
width: 100% !important;
}
.module tr {
border-bottom: 1px solid var(--igny8-stroke) !important;
}
.module tr:last-child {
border-bottom: none !important;
}
.module th,
.module td {
padding: 12px 16px !important;
text-align: left !important;
}
.module th {
background: var(--igny8-surface) !important;
color: var(--igny8-text) !important;
font-weight: 600 !important;
font-size: 13px !important;
}
.module a {
color: var(--igny8-primary) !important;
text-decoration: none !important;
transition: color 0.2s ease !important;
}
.module a:hover {
color: var(--igny8-primary-dark) !important;
}
/* ===================================================================
ALL BUTTONS - Consistent Theme Colors
=================================================================== */
.button,
input[type=submit],
input[type=button],
.submit-row input,
button:not(.close) {
background: linear-gradient(135deg, var(--igny8-primary) 0%, var(--igny8-primary-dark) 100%) !important;
color: white !important;
border: none !important;
padding: 12px 24px !important;
border-radius: 8px !important;
cursor: pointer !important;
font-weight: 600 !important;
font-size: 14px !important;
transition: all 0.2s ease !important;
box-shadow: 0 2px 6px rgba(6, 147, 227, 0.3) !important;
}
.button:hover,
input[type=submit]:hover,
input[type=button]:hover,
button:not(.close):hover {
background: linear-gradient(135deg, var(--igny8-primary-dark) 0%, #035a8f 100%) !important;
box-shadow: 0 4px 12px rgba(6, 147, 227, 0.4) !important;
transform: translateY(-2px) !important;
}
/* Save buttons - Success color */
input[name="_save"],
input[name="_continue"],
.submit-row input[type="submit"]:first-child {
background: linear-gradient(135deg, var(--igny8-success) 0%, var(--igny8-success-dark) 100%) !important;
box-shadow: 0 2px 6px rgba(11, 191, 135, 0.3) !important;
}
input[name="_save"]:hover,
input[name="_continue"]:hover {
background: linear-gradient(135deg, var(--igny8-success-dark) 0%, #067354 100%) !important;
box-shadow: 0 4px 12px rgba(11, 191, 135, 0.4) !important;
}
/* Delete buttons - Danger color */
.deletelink,
.deletelink-box a,
a.deletelink:link,
a.deletelink:visited,
input[name="_delete"],
.delete-confirmation input[type="submit"] {
background: linear-gradient(135deg, var(--igny8-danger) 0%, var(--igny8-danger-dark) 100%) !important;
color: white !important;
box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3) !important;
}
.deletelink:hover,
.deletelink-box a:hover,
input[name="_delete"]:hover {
background: linear-gradient(135deg, var(--igny8-danger-dark) 0%, #b82222 100%) !important;
box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4) !important;
}
/* ===================================================================
TABLE IMPROVEMENTS
=================================================================== */
#result_list {
border: 1px solid var(--igny8-stroke) !important;
border-radius: 12px !important;
overflow: hidden !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
#result_list thead th {
background: linear-gradient(135deg, var(--igny8-surface) 0%, #f1f5f9 100%) !important;
color: var(--igny8-text) !important;
padding: 16px 12px !important;
font-weight: 600 !important;
font-size: 13px !important;
text-transform: uppercase !important;
letter-spacing: 0.5px !important;
border-bottom: 2px solid var(--igny8-stroke-dark) !important;
}
#result_list thead th a {
color: var(--igny8-text) !important;
text-decoration: none !important;
}
#result_list tbody tr {
transition: background-color 0.2s ease !important;
}
#result_list tbody tr:nth-child(odd) {
background-color: white !important;
}
#result_list tbody tr:nth-child(even) {
background-color: var(--igny8-surface) !important;
}
#result_list tbody tr:hover {
background-color: rgba(6, 147, 227, 0.05) !important;
}
#result_list td {
padding: 14px 12px !important;
color: var(--igny8-text) !important;
font-size: 14px !important;
border-bottom: 1px solid var(--igny8-stroke) !important;
}
background: var(--igny8-danger-dark) !important;
}
/* ===================================================================
LINKS - IGNY8 Primary Blue
=================================================================== */
@@ -517,3 +1258,46 @@ fieldset.module h2 {
border-left-color: var(--igny8-success);
color: var(--igny8-success-dark);
}
/* ===================================================================
SIDEBAR MODULE ADD LINKS - Clean and Professional
=================================================================== */
.module .addlink,
.module a.addlink,
#content-main .module .addlink {
color: var(--igny8-primary) !important;
text-decoration: none !important;
font-size: 13px !important;
font-weight: 500 !important;
padding: 6px 10px !important;
display: inline-block !important;
border-radius: 4px !important;
transition: all 0.2s ease !important;
}
.module .addlink:before,
.module a.addlink:before {
content: "+" !important;
display: inline-block !important;
width: 18px !important;
height: 18px !important;
line-height: 18px !important;
text-align: center !important;
border-radius: 3px !important;
background: var(--igny8-primary) !important;
color: white !important;
margin-right: 6px !important;
font-size: 14px !important;
font-weight: bold !important;
}
.module .addlink:hover,
.module a.addlink:hover {
background: rgba(6, 147, 227, 0.1) !important;
color: var(--igny8-primary-dark) !important;
}
.module .addlink:hover:before,
.module a.addlink:hover:before {
background: var(--igny8-primary-dark) !important;
}