Skip to content

OSTicket Redesign! by grahamsh-llk

Details

Authorgrahamsh-llk

LicenseNo License

CategoryOSTicket

Created

Updated

Size6.8 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Makes OSTicket UI 100x better.

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name           OSTicket Redesign!
@namespace      github.com/openstyles/stylus
@version        1.0.3
@description    Make OSTicket 100x better
@author         GrahamSH
==/UserStyle== */
@-moz-document domain("support.fossho.st") {
    #container {
        width: 100%;
        min-height: 100vh;
    }

    .basic-search {
        border: none!important;
        border-top: none!important;
        border-bottom: none!important;
    }

    #content {
        min-height: 100vh;
    }

    #nav li.active,
    #nav li.inactive {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 5px;
        padding-bottom: 5px;
        box-shadow: revert;
        border: revert;
    }

    div#pjax-container {
        background: #F9FAFB
    }

    #nav li.inactive:hover {
        box-shadow: revert;
    }

    #nav li.inactive > ul {
        box-shadow: revert;
        -webkit-box-shadow: revert;
        border: revert;
    }

    #header {
        padding: 10px;
        box-shadow: revert;
        -webkit-box-shadow: revert;
    }

    table {
        width: 100%;
        margin-bottom: 10 px;
    }

    .list {
        border-collapse: collapse;
        margin: 25px 0;
        font-size: 0.9em;
        font-family: sans-serif;
        min-width: 400px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    }

    .list thead tr {
        background-color: #009879!important;
        color: #ffffff;
        text-align: left;
    }

    .list th,
    .list td {
        padding: 12px 15px!important;
        height: 25px;
    }

    .list tbody tr {
        border-bottom: 1px solid #dddddd;
    }

    .list tbody tr:nth-of-type(even) {
        background-color: #f3f3f3;
    }

    .list tbody tr:last-of-type {
        border-bottom: 2px solid #009879;
    }

    #nav {
        height: auto;
        background: #fff;
    }

    #sub_nav {
        background: revert;
        border-bottom: revert;
        border-right: revert;
    }

    .jb-overflowmenu .jb-overflowmenu-container {
        border-left: revert;
    }

    p#info {
        border-radius: 1px;
        padding: 15px;
        border: revert;
        background: revert;
    }

    input.basic-search {
        height: 3rem;
    }

    .input.attached .button.attached {
        height: 3rem;
        border: none!important;
        border-top: none!important;
        border-bottom: none!important;
    }

    table.list thead th a {
        transition: background-color 0.1s;
        padding: 1rem;
        border-radius: 4px;
    }

    a.newTicket {
        background-size: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 13h6m-3-3v6m5 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z' /%3E%3C/svg%3E");
    }

    a.Ticket {
        background-size: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z' /%3E%3C/svg%3E");
    }

    a.teams {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z' /%3E%3C/svg%3E");
        background-size: 20px;
    }

    a.departments {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z' /%3E%3C/svg%3E%3C/svg%3E");
        background-size: 20px;
    }

    .Icon.apiTicket {
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z' /%3E%3C/svg%3E") 0 0 no-repeat;
    }

    a.logs {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z' /%3E%3C/svg%3E");
        background-size: 20px;
    }

    a.users {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-6 w-6' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5.121 17.804A13.937 13.937 0 0112 16c2.5 0 4.847.655 6.879 1.804M15 10a3 3 0 11-6 0 3 3 0 016 0zm6 2a9 9 0 11-18 0 9 9 0 0118 0z' /%3E%3C/svg%3E");
        background-size: 20px;
    }

    div.header {
        padding: 15px!important;
    }

    .response .header {
        background: #fee2e2!important;
        border-color: #fecaca!important;
    }

    .thread-entry .header.message {
        background-color: #dbeafe!important;
        border-color: #bfdbfe!important;
    }

    .thread-body {
        border-color: lightgray!important;
    }

    div#msg_warning {
        padding: 10px 20px 10px 36px;
        border-radius: 2px;
        border-color: #dc2626;
    }

    td {
        transition: background-color .1s;
    }

    table.list tbody tr:hover td,
    table.list tbody tr.highlight td {
        background: #DBEAFE;
    }

    table.list tbody tr:nth-child(2n + 1):hover td {
        background: #DBEAFE;
    }

    .input.attached {
        height: 3rem;
    }


    table ~ div {
        padding: 10px;
    }

    @import url('https://rsms.me/inter/inter.css');
    *:not(i) {
        font-family: 'Inter', sans-serif!important;
    }
}

Reviews

No reviews yet.