Notice: To Install styles, click the "Show Css Code" button first. The install button will work after that.
The devs are no longer actively involved in the forum, so any bug reports regarding the extension or website should be sent to them directly at contact@userstyles.org.

nothingness

edited September 2018 in Style Requests Chrome

nothingness

Comments

  • edited June 2018 Chrome

    quora had changed the icon of the 'upvote button' (bottom left corner) - any way to change it back to something that is much more visible?

    I do not know, maybe try override svg icon or change in JS.

    or ways to move the 'upvote info' on top of the 'profile icon' 'answer date' area ?

    Try this:

    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div {
        display: flex;
        flex-flow: column nowrap;
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(3) {
        order: 0
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(2) {
        order: 1
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(4) {
        order: 3
    }
    

    Break "fixed/sticky bar" when scrolling website (no show any more).

    http://caniuse.com/#feat=flexbox

    bold, increase font, and color the 'upvote numbers' a good green?

    Try this:

    .blue_icon .icon_action_bar-label .icon_action_bar-count {
        color: green !important;
        font-weight: bold;
        font-size: larger
    }
    

    Change color exisist upvote:

    .blue_icon .action_bar-inline_icon .icon_svg-stroke {
        stroke: green !important;
    }
    
    .icon_action_bar-button.pressed .action_bar-inline_icon .icon_svg-fill, .icon_action_bar-stacked_button.pressed .action_bar-inline_icon .icon_svg-fill {
        fill:  #00e800 !important;
    }
    .icon_action_bar-button.pressed, .icon_action_bar-stacked_button.pressed {
        color: #32ff4d;
    }
    

    or color the 'upvote numbers' based on what if it's > than a number? or is the color part a js thing?

    In my opinion should use JS, in HTML I do not see class / id / attribut to catch by use other color.


    All demo CSS:

    @-moz-document domain("www.quora.com") {
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div {
        display: flex;
        flex-flow: column nowrap;
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(3) {
        order: 0
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(2) {
        order: 1
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(4) {
        order: 3
    }
    .blue_icon .action_bar-inline_icon .icon_svg-stroke {
        stroke: green !important;
    }
    .icon_action_bar-button.pressed .action_bar-inline_icon .icon_svg-fill, .icon_action_bar-stacked_button.pressed .action_bar-inline_icon .icon_svg-fill {
        fill:  #00e800 !important;
    }
    .icon_action_bar-button.pressed, .icon_action_bar-stacked_button.pressed {
        color: #32ff4d;
    }
    .blue_icon .icon_action_bar-label .icon_action_bar-count {
        color: green !important;
        font-weight: bold;
        font-size: larger
    }
    }
    

    Result:

    Imgur

  • edited June 2018 Chrome

    this 'font-size: larger' code doesnt seem to be well

    isnt it better to use the more specific sizes mentioned in the other requests?


    does this code move all the stuff in that row?

    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div {
    display: flex;
    flex-flow: column nowrap;
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(3) {
    order: 0
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(2) {
    order: 1
    }
    .pagedlist_item > div > div > div > div > .Answer.AnswerBase > div > div:nth-of-type(4) {
    order: 3
    }

    or anyway to just move the number of the upvotes?


    'override svg icon'

    is that css or js? i duno


    'should use JS,'

    one vote for js

  • edited June 2018 Firefox

    does this code move all the stuff in that row?

    Run only row (upvote button and count number) with only CSS for my is to hard without more glitch.

    For example, anyhow fixed positioning can make all the buttons be under each other without vote correct answers / replies.


    isnt it better to use the more specific sizes mentioned in the other requests?

    Maybe yes, I did not want to shoot what number will be OK. As for me, "larger" has increased the number quite well.

    Changing to a number can help as someone manually enlarged the font in your browser settings.


    one vote for js

    In css alone, you can not distinguish between 80 and 800 text - :contains(...) pseudoclass/pseudoselector is gone in CSS and in my opionon no comeback to specification.

    Maybe 8,000 (8k) have an extra class to make it lighter / darker green - though I doubt it.


    'override svg icon'

    is that css or js? i duno

    I do not have any experience with it, so nothing specific.

  • edited June 2018 Chrome

    without more glitch.

    ok so this seems difficult


    manually enlarged the font in your browser settings

    this changes for all sites so wont be good (impractical)

Sign In or Register to comment.