Skip to content

FreeCodeCamp - Modern by CosmoCreeper

Screenshot of FreeCodeCamp - Modern
Write a review Install Get Stylus

Details

AuthorCosmoCreeper

LicenseNo License

Categoryfreecodecamp

Created

Updated

Code size2.6 kB

Code checksumf53cee3e

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Modernizes freecodecamp.org! This is the latest version. v1.1

We have now modernized the news and forum pages! Enjoy!

Notes

Modernizes news and forum pages.

  • Ticker for scrollbar under settings has some weird style issues.
  • Hover for projects under curriculum has some style issues.

Source code

/* ==UserStyle==
@name           FreeCodeCamp - Modern
@namespace      github.com/openstyles/stylus
@version        1.1.1
@description    Modernizes freecodecamp.org!
@author         RandomApps
==/UserStyle== */

@-moz-document url-prefix("https://www.freecodecamp.org"), url-prefix("https://forum.freecodecamp.org") {
    .btn.donate-button, .cta-button, a, #ember28-header, #ember12-header {
        border-radius: 8px !important;
    }
    
    .progress-wrapper, .progress-bar-percent, .map-grid-item, .cert-tag, .progress-bar-background, .relative.inline-block.border-solid.border-3, .relative.w-full, pre, .map-superblock-link, .btn, img, figure, .panel-display-tabs button:nth-child(1) {
        border-radius: 9px !important;
    }
    
    .ais-SearchBox-form, .ais-SearchBox-submit, input, input:focus, textarea, textarea:focus, .toggle-button-group button, #danger-zone, .description-container, .action-row-container, table, .search-input {
        border-radius: 5px !important;
    }
    
    .ais-SearchBox-input:focus, code, td a {
        border-radius: 2px !important;
    }
    
    .p-4.mb-6.border.border-solid.border-1.break-words.text-blue-700.bg-blue-50.border-blue-100.annual-donation-alert {
        box-shadow: 5px 10px !important;
    }
    
    .exposed-button-nav, .toggle-button-nav, .alert, .timeline-pagination_list_item button {
        border-radius: 10px !important;
    }
    
    .btn.link-btn.btn-lg, .block.block-grid, .monaco-editor-tabs button, .btn-cta-big.btn-block.signup-btn.btn-cta, .testimonial-card, .badge-card {
        border-radius: 15px !important;
    }
    
    .avatar-container.default-border, .avatar, .lang-button-nav, .tick {
        border-radius: 30px !important;
    }
    
    .bg-foreground-danger.text-background-danger {
        border-top-left-radius: 5px !important;
        border-top-right-radius: 5px !important;
    }
    
    .panel-display-tabs button:nth-child(2) {
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }
    
    .panel-display-tabs button:nth-child(3) {
        border-top-right-radius: 10px;
    }
    
    .tabs-row button[data-playwright-test-label="instructions-button"] {
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    
    .relative.inline-block.border-solid.border-3:active:before {
        background-color: var(--foreground-secondary) !important;
    }
    
    .author-profile-image {
        border-radius: 50% !important;
    }
    
    .badge-category__wrapper {
        border-radius: 4px !important;
    }
}

Reviews

No reviews yet.