Support » Plugin: BadgeOS » BadgeOS WooCommerce Conflict

  • ResolvedPlugin Author learningtimes

    (@learningtimes)


    There is a known conflict of BadgeOS plugin with WooCommerce and due to which WooCommerce options are not displaying correctly on product edit page and have issues with screen options.

    Please remove below css from badgeos/css/autocomplete.css line #158. It fixes the issue.

    .hidden {
         display: none !important;
         visibility: hidden;
    }

    We will add this in our next update too.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Greetings,

    I deleted the code as instructed and cleared all caches. Still didn’t work. Could you provide the entire css file in Github so I can copy and paste in case there is some invisible characters that are preventing my modification from working.

    Thank you in advance.

    Here’s what the code looks like on my side.
    Your line 158 is my line 315. Not sure if this makes a difference.

    /* ==========================================================================

    HTML5 Boilerplate styles – h5bp.com (generated via initializr.com)

    ========================================================================== */

    html,

    button,

    input,

    select,

    textarea {

    color: #222;

    }

    body {

    font-size: 1em;

    line-height: 1.4;

    margin: 0;

    padding: 0;

    }

    ::-moz-selection {

    background: #b3d4fc;

    text-shadow: none;

    }

    ::selection {

    background: #b3d4fc;

    text-shadow: none;

    }

    hr {

    display: block;

    height: 1px;

    border: 0;

    border-top: 1px solid #ccc;

    margin: 1em 0;

    padding: 0;

    }

    img {

    vertical-align: middle;

    }

    fieldset {

    border: 0;

    margin: 0;

    padding: 0;

    }

    textarea {

    resize: vertical;

    }

    .chromeframe {

    margin: 0.2em 0;

    background: #ccc;

    color: #000;

    padding: 0.2em 0;

    }

    /* ==========================================================================

    Author’s custom styles

    ========================================================================== */

    .wrapper {

    margin: 20px auto;

    width: 400px;

    }

    #myAutocomplete {

    width: 100%;

    }

    .ui-autocomplete-multiselect.ui-state-default {

    display: block;

    background: #fff;

    border: 1px solid #ccc;

    padding: 3px 3px;

    padding-bottom: 0px;

    overflow: hidden;

    cursor: text;

    }

    .ui-autocomplete-multiselect .ui-autocomplete-multiselect-item .ui-icon {

    float: right;

    cursor: pointer;

    }

    .ui-autocomplete-multiselect .ui-autocomplete-multiselect-item {

    display: inline-block;

    border: 1px solid #ccc;

    border-radius: 4px;

    padding: 1px 3px;

    margin-right: 2px;

    margin-bottom: 3px;

    color: #333;

    background-color: #f6f6f6;

    }

    .ui-autocomplete-multiselect input {

    display: inline-block;

    border: none;

    outline: none;

    height: auto;

    margin: 2px;

    overflow: visible;

    margin-bottom: 5px;

    text-align: left;

    }

    .ui-autocomplete-multiselect.ui-state-active {

    outline: none;

    border: 1px solid #7ea4c7;

    -moz-box-shadow: 0 0 5px rgba(50,150,255,0.5);

    -webkit-box-shadow: 0 0 5px rgba(50,150,255,0.5);

    -khtml-box-shadow: 0 0 5px rgba(50,150,255,0.5);

    box-shadow: 0 0 5px rgba(50,150,255,0.5);

    }

    .ui-autocomplete {

    border-top: 0;

    border-top-left-radius: 0;

    border-top-right-radius: 0;

    }

    /* ==========================================================================

    Media Queries

    ========================================================================== */

    @media only screen and (min-width: 35em) {

    }

    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),

    only screen and (min-resolution: 144dpi) {

    }

    /* ==========================================================================

    Helper classes

    ========================================================================== */

    .ir {

    background-color: transparent;

    border: 0;

    overflow: hidden;

    *text-indent: -9999px;

    }

    .ir:before {

    content: “”;

    display: block;

    width: 0;

    height: 100%;

    }

    .hidden {

    display: none !important;

    visibility: hidden;

    }

    .visuallyhidden {

    border: 0;

    clip: rect(0 0 0 0);

    height: 1px;

    margin: -1px;

    overflow: hidden;

    padding: 0;

    position: absolute;

    width: 1px;

    }

    .visuallyhidden.focusable:active,

    .visuallyhidden.focusable:focus {

    clip: auto;

    height: auto;

    margin: 0;

    overflow: visible;

    position: static;

    width: auto;

    }

    .invisible {

    visibility: hidden;

    }

    .clearfix:before,

    .clearfix:after {

    content: ” “;

    display: table;

    }

    .clearfix:after {

    clear: both;

    }

    .clearfix {

    *zoom: 1;

    }

    a, a:hover{

    text-decoration: none;

    }

    /* ==========================================================================

    Print styles

    ========================================================================== */

    @media print {

    * {

    background: transparent !important;

    color: #000 !important; /* Black prints faster: h5bp.com/s */

    box-shadow: none !important;

    text-shadow: none !important;

    }

    a,

    a:visited {

    text-decoration: underline;

    }

    a[href]:after {

    content: ” (” attr(href) “)”;

    }

    abbr[title]:after {

    content: ” (” attr(title) “)”;

    }

    /*

    * Don’t show links for images, or javascript/internal links

    */

    .ir a:after,

    a[href^=”javascript:”]:after,

    a[href^=”#”]:after {

    content: “”;

    }

    pre,

    blockquote {

    border: 1px solid #999;

    page-break-inside: avoid;

    }

    thead {

    display: table-header-group; /* h5bp.com/t */

    }

    tr,

    img {

    page-break-inside: avoid;

    }

    img {

    max-width: 100% !important;

    }

    @page {

    margin: 0.5cm;

    }

    p,

    h2,

    h3 {

    orphans: 3;

    widows: 3;

    }

    h2,

    h3 {

    page-break-after: avoid;

    }

    }

    .ui-widget.ui-widget-content {

    z-index: 999999;

    }

    .ui-autocomplete-input{

    padding: 10px;

    width: 70%;

    }

    .badgeos-tools-page .ui-widget-content {

    z-index: 0 !important;

    }

    Plugin Author learningtimes

    (@learningtimes)

    Hi @djewelh72

    We have just released a new version of the plugin which has fixed this issue. Please update the plugin to the latest version.

    Thanks

    Plugin Author learningtimes

    (@learningtimes)

    Hi @djewelh72, @media, @page

    Since we have not heard from you in a while, we are now closing this thread. If you still need help, don’t hesitate to let us know.

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.