|
|
| Line 18: |
Line 18: |
| background-color: #2161c0; | | background-color: #2161c0; |
| color: white; | | color: white; |
| }
| |
|
| |
| /* =========================
| |
| TOC IMPROVEMENTS
| |
| ========================= */
| |
| #toc.toc {
| |
| background-color: #f8f9fa;
| |
| border: 1px solid #eaecf0;
| |
| border-radius: 8px;
| |
| padding: 16px;
| |
| margin: 16px 0;
| |
| box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
| |
| }
| |
| #toc.toc .toctitle {
| |
| font-weight: bold;
| |
| color: #212121;
| |
| }
| |
| #toc.toc ul {
| |
| margin-left: 1em;
| |
| }
| |
| #toc.toc a {
| |
| color: #3577BD;
| |
| text-decoration: none;
| |
| }
| |
| #toc.toc a:hover {
| |
| text-decoration: underline;
| |
| color: #4C8DCE;
| |
| }
| |
|
| |
| /* Hide toolbox */
| |
| #p-tb {
| |
| display: none;
| |
| }
| |
|
| |
| /* =========================
| |
| MATERIAL UI–LIKE STYLES
| |
| ========================= */
| |
| /* Primary color: #3577BD; Hover: #4C8DCE */
| |
| .material-card {
| |
| background-color: #ffffff; /* surface */
| |
| border-radius: 8px;
| |
| box-shadow: 0px 2px 4px rgba(0,0,0,0.24);
| |
| padding: 16px;
| |
| margin: 16px 0;
| |
| }
| |
| .material-heading {
| |
| color: #212121; /* primary text */
| |
| margin-bottom: 8px;
| |
| font-weight: bold;
| |
| font-size: 1.25rem;
| |
| }
| |
| .material-body {
| |
| color: #404040; /* darker secondary text for better readability */
| |
| font-size: 0.95rem;
| |
| line-height: 1.5;
| |
| }
| |
|
| |
| /* Regular links styling */
| |
| .material-card a {
| |
| color: #3577BD;
| |
| text-decoration: none;
| |
| }
| |
| .material-card a:hover {
| |
| text-decoration: underline;
| |
| color: #4C8DCE;
| |
| }
| |
|
| |
| /* Regular external links */
| |
| a.external {
| |
| color: #3577BD;
| |
| text-decoration: none;
| |
| }
| |
| a.external:hover {
| |
| text-decoration: underline;
| |
| color: #4C8DCE;
| |
| }
| |
|
| |
| /* Style for both types of buttons */
| |
| .material-button,
| |
| a.material-button,
| |
| span.material-button,
| |
| a.external.material-button {
| |
| background-color: #3577BD;
| |
| color: #ffffff !important;
| |
| padding: 8px 16px;
| |
| border-radius: 4px;
| |
| text-decoration: none !important;
| |
| font-weight: bold;
| |
| display: inline-block;
| |
| box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
| |
| transition: background-color 0.2s;
| |
| margin: 8px 0;
| |
| }
| |
|
| |
| /* Make links inside material buttons have white text */
| |
| .material-button a,
| |
| span.material-button a {
| |
| color: #ffffff !important;
| |
| text-decoration: none !important;
| |
| }
| |
|
| |
| /* Hover state */
| |
| .material-button:hover,
| |
| a.material-button:hover,
| |
| span.material-button:hover,
| |
| a.external.material-button:hover {
| |
| background-color: #4C8DCE;
| |
| text-decoration: none !important;
| |
| }
| |
|
| |
| /* Image styling in cards */
| |
| .material-card .thumb {
| |
| border: none;
| |
| background-color: transparent;
| |
| margin: 8px auto;
| |
| }
| |
| .material-card .thumbinner {
| |
| border: none;
| |
| background-color: transparent;
| |
| }
| |
|
| |
| /* Make categories and references look nicer */
| |
| .catlinks {
| |
| background-color: #f8f9fa;
| |
| border: 1px solid #eaecf0;
| |
| border-radius: 8px;
| |
| padding: 12px;
| |
| margin: 16px 0;
| |
| }
| |
| ol.references {
| |
| font-size: 0.9em;
| |
| } | | } |
