Numbering interferes with fontawesome icon CSS

Numbering interferes with fontawesome icon CSS



Comments

  1. Kirill Maximov (KIR)12 November 2017 at 02:58

    Thanks, we'll take a look. Possibly there is an alternative way to add an icon, to avoid a clash with numbering CSS. As a workaround you can use an explicit icon like .

    ReplyDelete
  2. Mark Dickens3 January 2018 at 05:03

    Kirill Maximov How would I use this ?

    ReplyDelete
  3. Kirill Maximov (KIR)5 January 2018 at 11:32

    Sorry for the delay. I'd like to ask, have you applied CSS rules from the https://checkvist.com/checklists/486715/tasks/16834507, the part about .numberedList styling?
    beta.checkvist.com - Checkvist customization (CSS samples) - outlined in Checkvist

    ReplyDelete
  4. Mark Dickens30 September 2018 at 07:07

    Kirill Maximov Better late than never :)

    No I haven't applied the numberedList CSS rules ... should I?

    ReplyDelete
  5. Kirill Maximov (KIR)5 October 2018 at 04:41

    Mark Dickens Sorry for the delay again. On the link I posted there is a fragment for custom icon usage when numberedLists are used, please check it out.

    ReplyDelete
  6. Mark Dickens19 December 2018 at 04:41

    Kirill Maximov thanks for this, it does something :)

    Almost there!

    Below is a snippet of the CSS I am using for showing an icon.

    The snippet also transforms the numbering (see attached screen clip) and I'm not sure how to prevent this. Any ideas?

    .fg1 .userContent:before {
    content: "\F132";
    font-family: FontAwesome;
    font-size: 24px;
    font-weight: 500;
    padding-right: 5px;
    color: #cccccc;
    display: inline-block;
    -webkit-transform: scale(1, -1);
    -moz-transform: scale(1, -1);
    -o-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1);
    text-shadow: 0.3px 0 0 #000, 0 -0.3px 0 #000, 0 0.3px 0 #000, -0.3px 0 0 #000;
    }

    /* The following section is required to fix case when icon is used with numbered lists /
    .numberedList .fg1 .userContent:before {
    * content: counters(section, ".") ". \F132"; /* Same icon code as in previous section */
    }



    https://lh3.googleusercontent.com/4rxCVe_w5QikBVjABAYzIZCnPgiEQeczR3t1Vp629fj-KJhMKGscXM9NSZgiwi_nigQeBbWNSnOAAZOuWAmjUGRNBOtoDlV-pUUA=s0

    ReplyDelete
  7. Kirill Maximov (KIR)21 December 2018 at 13:59

    Hi Mark Dickens,

    This is all tricky stuff :)

    Try this code instead:

    .fg1.editable:before {
    content: "\F132";
    font-family: FontAwesome;
    font-size: 24px;
    font-weight: 500;
    padding-right: 5px;
    color: #cccccc;
    display: inline-block;
    -webkit-transform: scale(1, -1);
    -moz-transform: scale(1, -1);
    -o-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1);
    text-shadow: 0.3px 0 0 #000, 0 -0.3px 0 #000, 0 0.3px 0 #000, -0.3px 0 0 #000;
    }

    Only one section is needed, no duplication.

    HTH,

    ReplyDelete
  8. Mark Dickens28 December 2018 at 06:45

    Kirill Maximov

    Gotcha! That's fab.

    Thanks Kirill.

    I hope Christmas has been good and have a great New Year!

    ReplyDelete

Post a Comment

Popular posts from this blog

Hello friends!

Hello friends! I'd like to ask for your opinion regarding multi-line text editing. This suggestion comes from one of our Russian-speaking customers Dolina Zamkova so here is a translated abstract of our email conversation. Current problem: When you write multi-line text, you must press 'Shift-Enter' first, then use 'Enter' to start a new line, then 'Ctrl-Enter' to submit the text. Wouldn't it be easier to have a setting that will allow using Enter to always write multi-line texts, and always submit on 'Ctrl-Enter', like you do it in text messengers? So we could add a new account-wide setting, on the Settings page: () Finish editing by pressing 'Ctrl-Enter' (convenient for multi-line text) What do you think? Do you write multi-line texts in Checkvist at all? Other thoughts of how we could make it better? :)
Read more

It would be very handy to have a single operation to move an item to another list, and then replace the item with a...

It would be very handy to have a single operation to move an item to another list, and then replace the item with a link to that new location. Something like 'extract to existing list' as opposed to the current 'extract as an new list' My use case: I make a distinction between lists which contain mostly action/todo items (in which every item is a candidate for completion), and which are largely for reference/record. Sometimes I move at item from the former type of list to the latter, but want a link left behind. It's quite likely this is far too niche a feature to be worth implementing, but "if you don't ask you don't get" ;)
Read more