Skip to content

Simple Finobe Topbar [1.0.1] by specowos

Screenshot of Simple Finobe Topbar [1.0.1]

Details

Authorspecowos

LicenseMIT License

Categorypizzaboxer.xyz

Created

Updated

Size1.4 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

A simple snippet of CSS that makes your project polygon topbar to look like finobe.

Update log:
1.0.1 -
Friends icon + Friends badge
1.0.0 -
Made

Notes

  • Supports darkmode and lightmode.
  • Does not work well with 2014.
  • Only the topbar.

Source code

/* ==UserStyle==
@name           Simple finobe topbar
@namespace      polygon.pizzaboxer.xyz
@version        1.0.0
@description    Make your topbar look like finobe!
@author         spec
==/UserStyle== */

@-moz-document domain("pizzaboxer.xyz") {
    /* spec >w< */
    
    /* finobify topbar */
    .navbar-orange, .nav-item .dropdown-menu {
        background: linear-gradient(90deg,#348ac7,#7474bf);
        height: 60px;
        border-bottom: 1px solid hsla(0,0%,100%,.1);
    }

    .navbar-expand-lg .navbar-collapse {
        font-size: 14px;
    }

    .navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand {
        font-size: 1rem;
    }

    .bg-dark {
        background: linear-gradient(90deg, rgba(44,116,170,1) 0%, rgba(93,99,152,1) 100%);
        height: 40px;
    }

    /* remove tb button backgrounds */
    .btn-outline-light {
      border-color: #f8f9fa00;
    }
    
    /* get original friend icon */
    .fa, .fas {
      font-weight: 500;
    }   
    
    /* orignal friend badge */
    .navbar-nav .friend-requests-indicator {
      position: absolute;
      margin-left: 30px;
      margin-top: 11px;
      height: 17px;
      width: 15px;
      font-size: 10px;
      font-weight: 700;
      color: #fff;
      background-color: #e53e3e;
      border-color: #e53e3e;
      text-align: center;
    }
}

Reviews

No reviews yet.