Skip to content

Oapaly Dark by vokuar

Screenshot of Oapaly Dark

Details

Authorvokuar

LicenseNo License

CategoryPapaly

Created

Updated

Size112 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

this is for papaly new tab page
see at Papaly

Notes

this is my first style
I'm mostly inexperienced in making styles so I hope you enjoy
I just copied the CSS from the site and changed the colours to dark
partly incomplete but mostly functional
you're welcome to modify and make it better

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           papaly Dark
@namespace      userstyles.world
@version        1.0.0
==/UserStyle== */
@-moz-document domain("papaly.com") {
.dropdown-button {
    font-size: .75rem
}
.dropdown-button {
    padding: 7px 12px;
    cursor: pointer
}
.dropdown-button {
    font-weight: 700;
    margin-top: 12px;
    text-align: center
}
body {
    background-color: #1c1c1c
}
.background-image-container {
    display: none
}
#main .theme-background-color,
#float-container .theme-background-color,
#dialog-container .theme-background-color,
#dialog-overlays .theme-background-color {
    background-color: #000
}
#main .theme-hover-background:hover,
#float-container .theme-hover-background:hover,
#dialog-container .theme-hover-background:hover,
#dialog-overlays .theme-hover-background:hover {
    background-color: #0f0e0d
}
#main .theme-background-color-lighter,
#float-container .theme-background-color-lighter,
#dialog-container .theme-background-color-lighter,
#dialog-overlays .theme-background-color-lighter {
    background-color: #12100f
}
#main .theme-card,
#float-container .theme-card,
#dialog-container .theme-card,
#dialog-overlays .theme-card {
    background-color: #1c1c1c;
    border-color: #222222
}
#main .theme-item-border-color:hover,
#float-container .theme-item-border-color:hover,
#dialog-container .theme-item-border-color:hover,
#dialog-overlays .theme-item-border-color:hover {
    border-color: #000000
}
#main .theme-text-color,
#float-container .theme-text-color,
#dialog-container .theme-text-color,
#dialog-overlays .theme-text-color {
    color: #bdb4b0
}
#main .theme-hover-text,
#float-container .theme-hover-text,
#dialog-container .theme-hover-text,
#dialog-overlays .theme-hover-text {
    color: #bdb4b0
}
#main .theme-border-color,
#float-container .theme-border-color,
#dialog-container .theme-border-color,
#dialog-overlays .theme-border-color {
    border-color: #332e2b !important
}
#main .theme-icon-color,
#float-container .theme-icon-color,
#dialog-container .theme-icon-color,
#dialog-overlays .theme-icon-color {
    background-color: #3f3834
}
#main .theme-right-outer-arrow,
#float-container .theme-right-outer-arrow,
#dialog-container .theme-right-outer-arrow,
#dialog-overlays .theme-right-outer-arrow {
    border-color: transparent transparent transparent #332e2b
}
#main .theme-right-outer-arrow .theme-right-inner-arrow,
#float-container .theme-right-outer-arrow .theme-right-inner-arrow,
#dialog-container .theme-right-outer-arrow .theme-right-inner-arrow,
#dialog-overlays .theme-right-outer-arrow .theme-right-inner-arrow {
    border-color: transparent transparent transparent #000000
}
#main .theme-up-outer-arrow,
#float-container .theme-up-outer-arrow,
#dialog-container .theme-up-outer-arrow,
#dialog-overlays .theme-up-outer-arrow {
    border-color: transparent transparent #332e2b transparent
}
#main .theme-up-outer-arrow .theme-up-inner-arrow,
#float-container .theme-up-outer-arrow .theme-up-inner-arrow,
#dialog-container .theme-up-outer-arrow .theme-up-inner-arrow,
#dialog-overlays .theme-up-outer-arrow .theme-up-inner-arrow {
    border-color: transparent transparent #000000 transparent
}
#main .theme-left-outer-arrow,
#float-container .theme-left-outer-arrow,
#dialog-container .theme-left-outer-arrow,
#dialog-overlays .theme-left-outer-arrow {
    border-color: transparent #332e2b transparent transparent
}
#main .theme-left-outer-arrow .theme-left-inner-arrow,
#float-container .theme-left-outer-arrow .theme-left-inner-arrow,
#dialog-container .theme-left-outer-arrow .theme-left-inner-arrow,
#dialog-overlays .theme-left-outer-arrow .theme-left-inner-arrow {
    border-color: transparent #000000 transparent transparent
}
#main .dialog-window,
#main .theme-dialog,
#float-container .dialog-window,
#float-container .theme-dialog,
#dialog-container .dialog-window,
#dialog-container .theme-dialog,
#dialog-overlays .dialog-window,
#dialog-overlays .theme-dialog {
    background-color: #000000;
    border-color: #332e2b;
    color: #bdb4b0
}
#main .theme-input,
#float-container .theme-input,
#dialog-container .theme-input,
#dialog-overlays .theme-input {
    padding: 0.5rem;
    height: auto;
    background-color: #000009;
    border-color: #332e2b;
    color: #bdb4b0
}
#main .theme-menu,
#float-container .theme-menu,
#dialog-container .theme-menu,
#dialog-overlays .theme-menu {
    background-color: #000000;
    border-color: #332e2b;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1)
}
#main .theme-menu .menu-button,
#float-container .theme-menu .menu-button,
#dialog-container .theme-menu .menu-button,
#dialog-overlays .theme-menu .menu-button {
    border-color: #090908;
    color: #bdb4b0
}
#main .theme-menu .menu-button:hover,
#float-container .theme-menu .menu-button:hover,
#dialog-container .theme-menu .menu-button:hover,
#dialog-overlays .theme-menu .menu-button:hover {
    background-color: #0f0e0d
}
#main .theme-button,
#float-container .theme-button,
#dialog-container .theme-button,
#dialog-overlays .theme-button {
    background-color: #000000;
    border-color: #332e2b;
    color: #bdb4b0;
    background-image: none
}
#main .theme-button:hover,
#float-container .theme-button:hover,
#dialog-container .theme-button:hover,
#dialog-overlays .theme-button:hover {
    background-color: #0f0e0d;
    background-repeat: no-repeat
}
#main .theme-button-primary,
#float-container .theme-button-primary,
#dialog-container .theme-button-primary,
#dialog-overlays .theme-button-primary {
    background-color: #34C780;
    border-color: #2fb373;
    color: #000000;
    background-image: none
}
#main .theme-button-primary:hover,
#float-container .theme-button-primary:hover,
#dialog-container .theme-button-primary:hover,
#dialog-overlays .theme-button-primary:hover {
    background-color: #34C780;
    background-repeat: no-repeat
}
#main .switch-container .toggle-switch,
#main .theme-switch .toggle-switch,
#float-container .switch-container .toggle-switch,
#float-container .theme-switch .toggle-switch,
#dialog-container .switch-container .toggle-switch,
#dialog-container .theme-switch .toggle-switch,
#dialog-overlays .switch-container .toggle-switch,
#dialog-overlays .theme-switch .toggle-switch {
    border-color: #332e2b
}
#main .switch-container .toggle-switch .onoffswitch-switch,
#main .theme-switch .toggle-switch .onoffswitch-switch,
#float-container .switch-container .toggle-switch .onoffswitch-switch,
#float-container .theme-switch .toggle-switch .onoffswitch-switch,
#dialog-container .switch-container .toggle-switch .onoffswitch-switch,
#dialog-container .theme-switch .toggle-switch .onoffswitch-switch,
#dialog-overlays .switch-container .toggle-switch .onoffswitch-switch,
#dialog-overlays .theme-switch .toggle-switch .onoffswitch-switch {
    background-color: #000000;
    border-color: #332e2b
}
#main .switch-container .toggle-switch .onoffswitch-inner:after,
#main .theme-switch .toggle-switch .onoffswitch-inner:after,
#float-container .switch-container .toggle-switch .onoffswitch-inner:after,
#float-container .theme-switch .toggle-switch .onoffswitch-inner:after,
#dialog-container .switch-container .toggle-switch .onoffswitch-inner:after,
#dialog-container .theme-switch .toggle-switch .onoffswitch-inner:after,
#dialog-overlays .switch-container .toggle-switch .onoffswitch-inner:after,
#dialog-overlays .theme-switch .toggle-switch .onoffswitch-inner:after {
    background-color: #0f0e0d;
    color: #bdb4b0
}
#main .hl-search,
#float-container .hl-search,
#dialog-container .hl-search,
#dialog-overlays .hl-search {
    border-color: #332e2b
}
#main .hl-search a,
#float-container .hl-search a,
#dialog-container .hl-search a,
#dialog-overlays .hl-search a {
    background-color: #0f0e0d
}
#main .edit-icon,
#float-container .edit-icon,
#dialog-container .edit-icon,
#dialog-overlays .edit-icon {
    background-image: url(/assets/ui_icons/edit-pencil-e41310b400c490590e7e53601a701b7f71c57c1d2c1d87367e488f4e8d2cb078.png)
}
#main .dropdown-label-selection:after,
#float-container .dropdown-label-selection:after,
#dialog-container .dropdown-label-selection:after,
#dialog-overlays .dropdown-label-selection:after {
    background-image: url(/assets/ui_icons/arrow_line_down-deb173dbdcc137ab291c73357b9fb7acdd72075fe3d82921c94cc4032632c63e.png)
}
#main #global-inner-section,
#main #master-search,
#main #right-section .inner-section,
#float-container #global-inner-section,
#float-container #master-search,
#float-container #right-section .inner-section,
#dialog-container #global-inner-section,
#dialog-container #master-search,
#dialog-container #right-section .inner-section,
#dialog-overlays #global-inner-section,
#dialog-overlays #master-search,
#dialog-overlays #right-section .inner-section {
    background-color: transparent
}
#main #global-header #right-section .inner-section > #notifications:hover,
#main #global-header #right-section .inner-section > #themes-settings:hover,
#main #global-header #right-section .inner-section > #user-options:hover,
#float-container #global-header #right-section .inner-section > #notifications:hover,
#float-container #global-header #right-section .inner-section > #themes-settings:hover,
#float-container #global-header #right-section .inner-section > #user-options:hover,
#dialog-container #global-header #right-section .inner-section > #notifications:hover,
#dialog-container #global-header #right-section .inner-section > #themes-settings:hover,
#dialog-container #global-header #right-section .inner-section > #user-options:hover,
#dialog-overlays #global-header #right-section .inner-section > #notifications:hover,
#dialog-overlays #global-header #right-section .inner-section > #themes-settings:hover,
#d...

Reviews

No reviews yet.