u/-__Supreme__-

I am fed up with Todoist Notifications not being delivered on time. I don't get the notification unless I turn the screen on my phone (not unlock, just pressing the power button once or tapping it to light it up).

You keep adding features and what not but the basic function is not working. What's the point of having a Reminder app if the reminders are not going through on time. Really disappointed.

Device: Vivo

I have set battery optimization to "allow in background" so that's not the issue either.

I made a visit to LP subreddit after the recent security incident. A person there had created a thread about inactive accounts getting deleted after two years. That is a scary situation to be in regarding a password manager. Imagine you can't access your pass manager account for a few years because of unforeseeable events and when you come back your whole digital life is gone.

I was curious if 1Password also has such a policy in place?

YouTube Link

So my increased subscription is paying AI in the product which should stay as away from AI assisted development as possible. ONE SHOT is the last thing you would want. It's not something to brag about in a security tool. If you are using AI to complete a line of code then sure go ahead. But don't just let it complete a feature and ONE SHOT it. So dumb.

https://preview.redd.it/br0j8lhm8i5h1.png?width=886&format=png&auto=webp&s=7982449e3d2567442cbe78fa14bb987cfb158d47

I used to use google keep for simple note taking. It was a good tool for just quick type and forget or maybe grocery lists. But I wanted to find an open source alternative to Keep.

That's when I stumbled upon Disorganized on one of the android app subreddits.

The app has come a long way since I started using it (around 4 months ago). The dev recently open sourced the app too.

It's an awesome app for making quick lists, note taking and it has a Mind map feature which is a really handy tool to create idea charts. Also, it includes a drawing tool.

GitHub: https://github.com/samhedin/disorganized-notes/tree/main

Website: https://www.getdisorganized.com/

The app is still in early phase. Hope it helps someone looking for such a tool.

I started using Thunderbird a year ago. It was good enough but didn't really look good. So I went looking for tweaks to make it look aesthetically pleasing.

I used three things:

1. Fluent bird: https://github.com/Deathbyteacup/fluentbird. Follow the instructions on the GitHub page to install it. It's extremely easy. Just copy the folder content and paste it into the chrome folder in Thrunderbird.
2. Themes I recommend: Sakura Blossoms & Birds by MaDonna (Light) and Thunderglobe (Dark)
3. Custom CSS (Claude wrote it): You will put the code in the custom.css file in the chrome folder.

​

/* =====================================================
   1. FLUENT UI VARIABLES (AUTO-ADAPTS TO LIGHT/DARK)
   ===================================================== */
:root, :root[lwtheme] {
    --fluent-bg-active: #ffffff;
    --fluent-bg-glass: rgba(255, 255, 255, 1); /* Made fully solid/opaque */
    --fluent-bg-capsule: rgba(255, 255, 255, 0.35);
    --fluent-bg-capsule-hover: rgba(255, 255, 255, 0.65);
    --fluent-bg-hover: rgba(0, 0, 0, 0.06);
    --fluent-bg-pressed: rgba(0, 0, 0, 0.08);
    --fluent-border: rgba(0, 0, 0, 0.15);
    --fluent-border-light: rgba(0, 0, 0, 0.08);
    --fluent-rim-light: rgba(255, 255, 255, 0.9);
    --fluent-shadow-sm: rgba(0, 0, 0, 0.08);
    --fluent-shadow-md: rgba(0, 0, 0, 0.12);
    --fluent-shadow-lg: rgba(0, 0, 0, 0.15);
    --fluent-text: #202020;
    --fluent-text-strong: #000000;
    --fluent-accent: #0060df; /* Thunderbird Blue */
}

/* Instantly swaps colors when Dark Mode is enabled */
 (prefers-color-scheme: dark) {
    :root, :root[lwtheme] {
        /* Brighter active background so it doesn't blend into the black canvas */
        --fluent-bg-active: #3d3d3d; 
        --fluent-bg-glass: rgba(40, 40, 40, 1); /* Made fully solid/opaque */
        --fluent-bg-capsule: rgba(255, 255, 255, 0.08); 
        --fluent-bg-capsule-hover: rgba(255, 255, 255, 0.15);
        --fluent-bg-hover: rgba(255, 255, 255, 0.1);
        --fluent-bg-pressed: rgba(255, 255, 255, 0.15);
        /* Stronger, crisper white borders to define edges in the dark */
        --fluent-border: rgba(255, 255, 255, 0.25); 
        --fluent-border-light: rgba(255, 255, 255, 0.12);
        --fluent-rim-light: rgba(255, 255, 255, 0.08);
        --fluent-shadow-sm: rgba(0, 0, 0, 0.4);
        --fluent-shadow-md: rgba(0, 0, 0, 0.6);
        --fluent-shadow-lg: rgba(0, 0, 0, 0.8);
        --fluent-text: #eaeaea;
        --fluent-text-strong: #ffffff;
        --fluent-accent: #58a6ff; /* Lighter, glowing blue for dark mode */
    }
}

/* =====================================================
   2. ACTIVE SPACES TOOLBAR BUTTON
   ===================================================== */
:root[lwtheme] #spacesToolbar .spaces-toolbar-button.current {
    --spaces-button-active-bg-color: var(--fluent-bg-active) !important; 
    background-color: var(--fluent-bg-active) !important; 

    /* ADDED: A glowing accent line on the left side so it's unmistakable */
    box-shadow: inset 3px 0 0 var(--fluent-accent), 0 1px 3px var(--fluent-shadow-sm) !important;
    color: var(--fluent-text-strong) !important;
}

:root[lwtheme] #spacesToolbar .spaces-toolbar-button.current:hover {
    background-color: var(--fluent-bg-active) !important;
}

/* =====================================================
   3. MESSAGE HEADER BUTTONS - CAPSULE & POP-OUT
   ===================================================== */
:root[lwtheme] #messageHeader .toolbarbutton-1 {
    border-radius: 50px !important; 
    border: 1px solid var(--fluent-border) !important;
    background-color: var(--fluent-bg-active) !important; 
    box-shadow: 0 2px 5px var(--fluent-shadow-sm) !important; 
    margin: 2px 4px !important; 
    overflow: hidden !important; 
    transition: all 0.2s ease !important; 
    color: var(--fluent-text) !important;
}

:root[lwtheme] #messageHeader .toolbarbutton-1:hover {
    box-shadow: 0 5px 10px var(--fluent-shadow-lg) !important;
    transform: translateY(-2px) !important; 
}

/* Cleanup for split-buttons */
:root[lwtheme] #messageHeader .toolbarbutton-menubutton-button,
:root[lwtheme] #messageHeader .toolbarbutton-menubutton-dropmarker {
    border: none !important; 
    background-color: transparent !important;
    box-shadow: none !important;
}

:root[lwtheme] #messageHeader .toolbarbutton-menubutton-dropmarker {
    border-left: 1px solid var(--fluent-border-light) !important;
}

/* =====================================================
   4. MODERN FANCY POP-UP MENUS (SOLID STYLE)
   ===================================================== */
:root menupopup {
    appearance: none !important;
    background-color: var(--fluent-bg-glass) !important; 
    border: 1px solid var(--fluent-border-light) !important; 
    border-radius: 8px !important; 
    padding: 4px 0px !important; 
    box-shadow: 
        inset 0 1px 0 var(--fluent-rim-light), 
        0 12px 32px var(--fluent-shadow-md), 
        0 2px 6px var(--fluent-shadow-sm) !important; 
}

:root menuitem, :root menu {
    appearance: none !important;
    padding: 6px 12px !important;
    border-radius: 5px !important; 
    margin: 1px 4px !important; 
    color: var(--fluent-text) !important;
}

:root menuitem:hover, :root menu:hover,
:root menuitem[_moz-menuactive="true"], :root menu[_moz-menuactive="true"] {
    background-color: var(--fluent-bg-hover) !important; 
    color: var(--fluent-text-strong) !important;
}

/* Clean Separator Lines */
:root menuseparator {
    appearance: none !important;
    margin: 4px 12px !important; 
    border-top: 1px solid var(--fluent-border-light) !important; 
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    background: transparent !important; 
    background-color: transparent !important;
    height: 0px !important;
    padding: 0px !important;
}

:root menuseparator::before,
:root menuseparator::after {
    display: none !important;
    content: none !important;
}

/* =====================================================
   5. FANCY FLOATING TABS (FROSTED GLASS EFFECT)
   ===================================================== */
:root[lwtheme] .tabmail-tab {
    margin: 2px 4px !important; 
    border-radius: 8px !important; 
}

:root[lwtheme] .tab-background {
    border-radius: 8px !important;
    box-shadow: none !important;
    border: 1px solid transparent !important; 
    background-color: var(--fluent-bg-capsule) !important; 
    backdrop-filter: blur(4px) !important; 
    transition: background-color 0.2s ease, box-shadow 0.2s ease, border 0.2s ease !important; 
}

:root[lwtheme] .tabmail-tab:not([selected="true"]):hover .tab-background {
    background-color: var(--fluent-bg-capsule-hover) !important; 
    box-shadow: 0 2px 6px var(--fluent-shadow-sm) !important;
}

:root[lwtheme] .tabmail-tab[selected="true"] .tab-background {
    background-color: var(--fluent-bg-active) !important; 

    /* ADDED: A crisp top-border line to vividly mark the active tab */
    border-top: 2px solid var(--fluent-accent) !important; 
    border-left: 1px solid var(--fluent-border) !important;
    border-right: 1px solid var(--fluent-border) !important;
    border-bottom: 1px solid var(--fluent-border) !important;

    box-shadow: 0 6px 16px var(--fluent-shadow-lg) !important; 
}

:root[lwtheme] .tabmail-tab .tab-text {
    font-weight: normal !important; 
    color: var(--fluent-text) !important;
}

:root[lwtheme] .tabmail-tab[selected="true"] .tab-text {
    color: var(--fluent-text-strong) !important;
}

:root[lwtheme] .tabmail-tab .tab-close-button {
    display: flex !important; 
    visibility: visible !important;
    opacity: 1 !important;
    border-radius: 50px !important; 
    transition: background-color 0.15s ease !important;
}

:root[lwtheme] .tabmail-tab .tab-close-button:hover {
    background-color: #ff4d4d !important; 
    color: white !important;
    fill: white !important;
}

/* =====================================================
   6. UNIFIED TOOLBAR & GLOBAL SEARCH BAR
   ===================================================== */
:root[lwtheme] global-search-bar {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

:root[lwtheme] #searchInput {
    appearance: none !important;
    background-color: var(--fluent-bg-capsule) !important;
    border: 1px solid var(--fluent-border) !important;
    border-radius: 20px !important; 
    padding: 2px 12px !important;
    box-shadow: none !important;
    backdrop-filter: blur(10px) !important;
    transition: all 0.2s ease !important;
    min-height: 28px !important;
}

:root[lwtheme] #searchInput input,
:root[lwtheme] .search-textbox-input {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--fluent-text) !important;
}

:root[lwtheme] #searchInput:hover {
    background-color: var(--fluent-bg-capsule-hover) !important;
}

:root[lwtheme] #searchInput[focused="true"] {
    background-color: var(--fluent-bg-active) !important;
    border-color: var(--fluent-accent) !important; 
    box-shadow: 0 0 0 2px var(--fluent-border-light) !important;
}

:root[lwtheme] #unifiedToolbar .toolbarbutton-1,
:root[lwtheme] #tabs-toolbar .toolbarbutton-1 {
    border-radius: 6px !important; 
    border: 1px solid transparent !important;
    background-color: transparent !important;
    margin: 0px 2px !important;
    transition: all 0.15s ease !important;
    color: var(--fluent-text) !important;
}

:root[lwtheme] #unifiedToolbar .toolbarbutton-1:hover,
:root[lwtheme] #tabs-toolbar .toolbarbutton-1:hover {
    background-color: var(--fluent-bg-hover) !important; 
    border: 1px solid var(--fluent-border-light) !important;
    box-shadow: 0 2px 6px var(--fluent-shadow-sm) !important;
    backdrop-filter: blur(5px) !important;
}

:root[lwtheme] #unifiedToolbar .toolbarbutton-menubutton-dropmarker {
    border-left: 1px solid var(--fluent-border-light) !important;
}
/* =====================================================
   7. RESPONSIVE MESSAGE HEADER BUTTONS
      - Shows icon + text when space allows (≤2 lines)
      - Shows icon only when space is tight (>2 lines)
      - Hides problematic "More" button
   ===================================================== */

/* Enable container query */
:root[lwtheme] #messageHeader {
    container-type: inline-size;
    container-name: msgheader;
}

/* =========================
   NARROW MODE (icons only)
   ========================= */
 msgheader (max-width: 600px) {

    /* Hide text labels */
    :root[lwtheme] #messageHeader .toolbarbutton-text {
        display: none !important;
        width: 0 !important;
        overflow: hidden !important;
    }

    /* Center buttons */
    :root[lwtheme] #messageHeader .toolbarbutton-1 {
        padding-inline: 10px !important;
        min-width: unset !important;
        justify-content: center !important;
    }

    /* Center icons cleanly */
    :root[lwtheme] #messageHeader .toolbarbutton-icon {
        margin: 0 auto !important;
    }

    /* Remove "More" button completely */
    :root[lwtheme] #messageHeader #otherActionsButton {
        display: none !important;
    }
}

/* =========================
   FALLBACK (no container queries)
   ========================= */
u/media (max-width: 800px) {

    :root[lwtheme] #messageHeader .toolbarbutton-text {
        display: none !important;
        width: 0 !important;
        overflow: hidden !important;
    }

    :root[lwtheme] #messageHeader .toolbarbutton-1 {
        padding-inline: 10px !important;
        min-width: unset !important;
        justify-content: center !important;
    }

    :root[lwtheme] #messageHeader .toolbarbutton-icon {
        margin: 0 auto !important;
    }

    :root[lwtheme] #messageHeader #otherActionsButton {
        display: none !important;
    }
}

Note: I still haven't finished the customization but it felt good enough so I am sharing with the community. Would love to know some custom.css you guys are using.

Edit: Posted Screenshots ↓

---

Light Theme

Dark Theme