DEBUG: CSS path: /home/rankby5/public_html/wp-content/course-progress/course-progress.css Exists? yes Readable? yes Filesize: 12472 bytes Permissions: 0644 Contents: /* -CSS Custom Properties for Easy Customization - adjust the essential styles below. */ :root { /* Navigation Variables */ --ct-nav-link-color: #000; /* Default navigation link color */ --ct-nav-list-padding: 6px 0; /* Padding for list items (top/bottom only) */ --ct-nav-item-margin-bottom: 0; /* Margin bottom for nav list items */ --ct-nav-icon-text-gap: 8px; /* Space between nav icon and text */ --ct-nav-checkmark-color: green; /* Color of the checkmark for completed nav items */ --ct-nav-font-size: 16px; /* Font size for navigation links */ /* Complete Button Variables */ --ct-btn-align-items: center; --ct-btn-justify-content: center; --ct-btn-padding: 10px 20px; --ct-btn-bg-color: #2dc68a; --ct-btn-text-color: #fff; --ct-btn-border: none; --ct-btn-border-radius: 4px; --ct-btn-font-size: 1em; /* Lesson Nav Progress Text Variables */ --ct-text-font-size: 1.1em; --ct-text-align: center; } /* Navigation Container Reset */ .course-navigation { list-style: none; margin: 0 !important; padding: 0 !important; margin-left: 0 !important; padding-left: 0 !important; } /* Navigation List & Items Reset */ .course-navigation, .course-navigation li { list-style: none !important; margin-left: 0 !important; padding: var(--ct-nav-list-padding) !important; display: block !important; position: relative; } /* Navigation Links */ .course-navigation li a { display: inline-flex; align-items: center; text-decoration: none; font-size: var(--ct-nav-font-size); color: var(--ct-nav-link-color); margin: 0; padding-left: 0 !important; font-weight: 400; } /* ————————————————————— COURSE NAVIGATION BULLETS ——————————————————————————— */ /* 1) Hollow circle for leaf items */ .course-navigation li:not(.menu-item-has-children) > a::before { content: ""; display: inline-block; width: 20px; height: 20px; margin-right: var(--ct-nav-icon-text-gap); vertical-align: middle; background-repeat: no-repeat; background-position: center; background-size: contain; /* hollow circle SVG */ background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOCIgc3Ryb2tlPSJncmF5IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiLz48L3N2Zz4="); } /* 2) Shaded circle for the current page/ancestor */ .course-navigation li.current-menu-item > a::before, .course-navigation li.current_page_item > a::before, .course-navigation li.current-menu-ancestor > a::before { /* shaded circle SVG (#ccc) */ background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOCIgc3Ryb2tlPSJncmF5IiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9IiNjY2MiLz48L3N2Zz4="); } /* Completed state: green circle + smooth white checkmark */ .course-navigation li a.course_nav_completed::before { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+PGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iOCIgc3Ryb2tlPSJub25lIiBmaWxsPSIjMDBjODUzIi8+PHBvbHlsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHBvaW50cz0iNiAxMCA5IDEzIDE0IDciLz48L3N2Zz4="); background-repeat: no-repeat; background-position: center; background-size: contain; } /* Italicized text for completed items */ .course-navigation li a.course_nav_completed { font-style: italic; color: gray; } /* --- Navigation Styling for Parent Headers and Sub-menus --- */ /* Parent header items: no left indent */ .course-navigation > li.menu-item-has-children { padding-left: 0 !important; } /* Parent header links: */ .course-navigation > li.menu-item-has-children > a { pointer-events: none; cursor: default; text-decoration: none !important; font-weight: bold !important; color: #333 !important; padding-left: 0 !important; margin-left: 0; } /* Sub-menu container: no indentation or background */ .course-navigation ul.sub-menu { position: static !important; margin: 0 !important; padding: 0 !important; background: none !important; } /* Sub-menu items: uniform spacing, no extra indent */ .course-navigation ul.sub-menu li { display: block !important; margin: 0 !important; padding: 5px 0 !important; } .course-navigation ul.sub-menu li:last-child { border-bottom: none !important; } .course-navigation ul.sub-menu li a { display: block !important; text-decoration: none !important; color: #333 !important; } /* Container for the standalone navigation arrows */ .lesson-nav-arrows { display: flex; gap: 10px; align-items: center; margin: 10px 0; } /* Base styling for each standalone arrow button */ .lesson-nav-btn { width: 50px; height: 40px; border: 1px solid #ccc; border-radius: 4px; background-color: #fff; cursor: pointer; position: relative; } /* Draw an “open” arrowhead with CSS borders */ .lesson-nav-btn::after { content: ""; position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; border-top: 2px solid #000; border-right: 2px solid #000; transform: translate(-50%, -50%) rotate(45deg); } /* Flip for previous arrow */ .lesson-nav-prev::after { transform: translate(-50%, -50%) rotate(-135deg); } /* Next arrow orientation unchanged */ .lesson-nav-next::after { transform: translate(-50%, -50%) rotate(45deg); } /* Course progress bar wrapper */ .course-progress-bar-wrapper { border: 1px solid #e1e1e1; border-radius: 6px; padding: 10px; margin: 15px 0; background-color: #fff; } .course-progress-bar-text { font-size: var(--ct-text-font-size); margin-bottom: 10px; } .course-progress-bar-outer { position: relative; width: 100%; height: 10px; background-color: #e8e8e8; border-radius: 5px; overflow: hidden; margin-bottom: 10px; } .course-progress-bar-fill { position: absolute; height: 100%; width: 0%; background-color: #666; transition: width 0.4s ease; } .course-progress-bar-percent { font-size: 1em; text-align: right; color: #333; } /* Inline text navigation arrows (in the progress widget) */ .lesson-nav-progress-container { display: inline-flex; align-items: center; } .lesson-nav-progress-arrow { width: 20px; height: 20px; position: relative; cursor: pointer; background: none; border: none; } /* Draw open arrowheads in the progress widget */ .lesson-nav-progress-arrow::after { content: ""; position: absolute; top: 50%; left: 50%; width: 6px; height: 6px; border-top: 2px solid #000; border-right: 2px solid #000; transform: translate(-50%, -50%) rotate(45deg); } /* Flip for previous in progress widget */ .lesson-nav-progress-prev::after { transform: translate(-50%, -50%) rotate(-135deg); } /* Next orientation in progress widget */ .lesson-nav-progress-next::after { transform: translate(-50%, -50%) rotate(45deg); } .lesson-nav-progress-text { font-size: var(--ct-text-font-size); text-align: var(--ct-text-align); flex-grow: 1; } /* Complete Lesson Button */ .complete-lesson-btn { display: inline-flex; align-items: var(--ct-btn-align-items); justify-content: var(--ct-btn-justify-content); padding: var(--ct-btn-padding); background-color: var(--ct-btn-bg-color); color: var(--ct-btn-text-color); border: var(--ct-btn-border); border-radius: var(--ct-btn-border-radius); cursor: pointer; font-size: var(--ct-btn-font-size); } .complete-lesson-btn .clb-icon { display: inline-block; margin-left: 5px; vertical-align: middle; width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; } .complete-lesson-btn .clb-save { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTIxIDEySDVNMTEgNWw3IDctNyA3Ii8+PC9zdmc+"); width: 13px; height: 13px; } .complete-lesson-btn .clb-check { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBvbHlsaW5lIHBvaW50cz0iMjAgNiA5IDE3IDQgMTIiLz48L3N2Zz4="); width: 16px; height: 16px; } .complete-lesson-btn:active { animation: bounce 0.4s; } @keyframes bounce { 0% { transform: scale(1); } 30% { transform: scale(1.2); } 50% { transform: scale(0.95); } 70% { transform: scale(1.05); } 100% { transform: scale(1); } } /* Continue Lesson Button */ .continue-lesson-btn { display: inline-flex; align-items: center; justify-content: center; padding: 10px 20px; margin-bottom: 20px; background-color: #2dc68a; color: #fff; border: none; border-radius: 4px; cursor: pointer; font-size: 1em; } .continue-lesson-btn .clb-icon { display: inline-block; margin-left: 5px; vertical-align: middle; width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; } /* Base reminder bar */ .lesson-backup-alert { position: fixed; top: 0; left: 0; width: 100%; z-index: 10000; background: #fffae6; border-bottom: 3px solid #f0c040; color: #333; padding: 12px 48px 12px 12px; /* space for close button */ text-align: center; font-family: sans-serif; font-size: 15px; } /* Link styling */ .lesson-backup-alert a { color: #0073aa; text-decoration: underline; } /* Close button */ .lesson-backup-alert .lesson-backup-close { position: absolute; top: 8px; right: 12px; background: none; border: none; font-size: 20px; line-height: 1; cursor: pointer; color: #666; } .lesson-backup-alert .lesson-backup-close:hover { color: #000; } /* Push below the WP admin bar */ body.admin-bar .lesson-backup-alert { top: 32px; } /* Course Navigation Overview Table */ .course-nav-overview { width: 100%; border: 1px solid #ccc; border-radius: 8px; border-collapse: separate; border-spacing: 0; overflow: hidden; table-layout: fixed; } .course-nav-overview col.course-nav-col-left { width: 80%; } .course-nav-overview col.course-nav-col-right { width: 25%; } .course-nav-overview th, .course-nav-overview td { padding: 8px; border: none; } .course-nav-overview thead th { background-color: #f8f8f8; font-weight: bold; } .course-nav-header-left, .course-nav-cell-left { text-align: left; } .course-nav-header-right, .course-nav-cell-right { text-align: left; white-space: nowrap; } /* Make overview headers bold without inline tags */ .course-nav-overview .course-nav-module-headecourse-nav-cell-left { font-weight: bold; } /* Buttons (Backup & Restore) */ .course-progress-backup-restore button, .course-progress-backup-restore .cp-btn { background: #fff; color: #333; border: 1px solid darkgrey; padding: 10px 20px; border-radius: 4px; cursor: pointer; box-shadow: none; outline: none; transition: var(--bricks-transition); margin: 0; /* remove extra margins */ display: inline-block; /* shrink to fit text */ } /* Hover state */ .course-progress-backup-restore button:hover, .course-progress-backup-restore .cp-btn:hover { background: #f7f7f7; } /* File-chooser input: auto width, aligned left */ .course-progress-backup-restore input[type="file"] { display: inline-block; width: auto; /* let it size naturally */ margin: 0; /* no extra margin-left */ padding: 6px 0px; /* small padding for clickable area */ border-style :none !important; } /* Other form fields—not full width by default */ .course-progress-backup-restore input:not([type="file"]), .course-progress-backup-restore select, .course-progress-backup-restore textarea { display: inline-block; width: auto; margin: 0; padding: 6px 12px; line-height: 1.5; }