Modifying post/voting tools using css

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Carrfixr
    Senior Member
    • May 2017
    • 1364
    • 5.5.x

    #31
    Originally posted by NumNum

    add it to the end of your website home page url

    Thanks, here is what I got???? I'm on the cloud is that why???



    you do not have permission to access this page. This could be due to one of several reasons:
    1. Your user account may not have sufficient privileges to access this page. Are you trying to edit someone else's post, access administrative features or some other privileged system?
    2. If you are trying to post, the administrator may have disabled your account, or it may be awaiting activation.

    Comment


    • Wayne Luke
      Wayne Luke commented
      Editing a comment
      Cloud Administrators are missing a permission "Can Admin Templates." Something that I am pushing to rectify over time but there are some security issues involved.

      Cloud customers can see their sprite by clicking "Styles -> Edit CSS" then selecting the Sprite CSS from the dropdown. You can edit all of your sprite colors by editing the icon_* style variables in the AdminCP.

    • Carrfixr
      Carrfixr commented
      Editing a comment
      Wayne but that does not target a specific symbol or sprite. It changes the color on many more.

    • Carrfixr
      Carrfixr commented
      Editing a comment
      How can I target a specific symbol?
  • Carrfixr
    Senior Member
    • May 2017
    • 1364
    • 5.5.x

    #32
    Craig when you figure out the flag id can you post it up?
    thanks
    Last edited by Carrfixr; Thu 23 May '19, 11:55am.

    Comment

    • glennrocksvb
      Former vBulletin Developer
      • Mar 2011
      • 4011
      • 5.7.X

      #33
      Outline of flag icon is #vb-svg-flag-2 and fill is #vb-svg-fill


      Flag Icon Postbit Insert GIPHY Impersonate User BETTER INITIALS AVATAR Better Name Card Quote Selected Text Bookmark Posts Post Footer Translate Stop Links in Posts +MORE!

      Comment


      • Carrfixr
        Carrfixr commented
        Editing a comment
        Glenn I should be able to do that also. I went into inspect but get lost at that point. Where do I look once in inspect?

      • glennrocksvb
        glennrocksvb commented
        Editing a comment
        Right-click on a specific icon you want to change and Inspect and it will highlight the corresponding element.

      • Carrfixr
        Carrfixr commented
        Editing a comment
        I did that but where is the ID #
    • Craig
      Senior Member
      • Jan 2008
      • 996
      • 6.X

      #34
      Thanks to everyone's help I was able to achieve what I was looking for. Hopefully this helps others as well. Below is what I am using.

      Code:
      /* Outline of like icon*/
      #vb-svg-vote{
      fill: blue !important;
      }
      
      /* Fill of like icon*/
      #vb-svg-fill-4 {
      fill: antiquewhite !important;
      }
      /* Outline of Flag icon*/
      #vb-svg-flag-2 {
      fill: black !important;
      }
      
      /* Fill of Flag icon*/
      #vb-svg-fill {
      fill:red !important;
      }
      /* Outline of Quote icon*/
      #vb-svg-rdquo{
      fill: lime !important;
      }
      
      /* Fill of Quote icon*/
      #vb-svg-fill-2 {
      fill: lime !important;
      }
      /* Outline of Edit icon*/
      #vb-svg-pencil--gray{
      fill: blue !important;
      }
      
      /* Fill of Edit icon*/
      #vb-svg-fill-6 {
      fill:orange !important;
      }
      /* Outline of Comment icon*/
      #vb-svg-__speech-single--gray{
      fill: black !important;
      }
      
      /* Fill of Comment icon*/
      #vb-svg-fill-3 {
      fill: pink !important;
      }
      Click image for larger version  Name:	apco.PNG Views:	1 Size:	2.1 KB ID:	4415906
      Click image for larger version

Name:	comment.PNG
Views:	232
Size:	1.9 KB
ID:	4415908
      Last edited by Craig; Thu 23 May '19, 12:58pm.
      adktramping ~ my happy place.

      "Whoever said practice makes perfect was an idiot. Humans can't be perfect because we're not machines." ~ Sam Gardner.

      Vote for your favorite feature requests and the bugs you want to see fixed.

      Comment


      • Carrfixr
        Carrfixr commented
        Editing a comment
        Thank you nice job
    • glennrocksvb
      Former vBulletin Developer
      • Mar 2011
      • 4011
      • 5.7.X

      #35
      I did that but where is the ID #
      Carrfixr, for example, this is what I see when inspect the flag icon

      Click image for larger version  Name:	Capture.PNG Views:	0 Size:	27.7 KB ID:	4415965

      The id for the flag icon fill is vb-svg-fill. The id for the flag icon outline is vb-svg-flag-2 (element above the highlighted one).

      Flag Icon Postbit Insert GIPHY Impersonate User BETTER INITIALS AVATAR Better Name Card Quote Selected Text Bookmark Posts Post Footer Translate Stop Links in Posts +MORE!

      Comment

      • voyger
        Senior Member
        • Jun 2017
        • 381

        #36
        thanks to Num Num and to all who contributed
        lovele job little think make colourful difference

        Click image for larger version

Name:	Capture1_LI (3).jpg
Views:	342
Size:	19.7 KB
ID:	4415987




        voyger.: In Almighty God I trust, everyone else has to provide evidence."

        vBulletin Version 5.5.5

        Comment

        • voyger
          Senior Member
          • Jun 2017
          • 381

          #37
          mistake
          voyger.: In Almighty God I trust, everyone else has to provide evidence."

          vBulletin Version 5.5.5

          Comment

          • Carrfixr
            Senior Member
            • May 2017
            • 1364
            • 5.5.x

            #38
            Originally posted by Glenn Vergara
            Carrfixr, for example, this is what I see when inspect the flag icon

            Click image for larger version Name:	Capture.PNG Views:	0 Size:	27.7 KB ID:	4415965

            The id for the flag icon fill is vb-svg-fill. The id for the flag icon outline is vb-svg-flag-2 (element above the highlighted one).

            Glenn thanks for taking the time to post the example. When I right click on the flag and choose inspect this is what I see. What am I missing to find the screen shot that you showed?


            Click image for larger version

Name:	DA1E52B1-1947-48F0-B4A5-DE605858892B.jpeg
Views:	278
Size:	162.9 KB
ID:	4416015

            Comment

            • glennrocksvb
              Former vBulletin Developer
              • Mar 2011
              • 4011
              • 5.7.X

              #39
              Carrfixr, you have to open the SVG icon file in the browser and right-click from there not from the web page.

              In case of Craig, the SVG icon file URL is https://apco-atlantic.org/sprite.php...&ts=1558604815

              In your case it would be https://www.vintagefordforum.com/spr...&ts=1558696223

              Flag Icon Postbit Insert GIPHY Impersonate User BETTER INITIALS AVATAR Better Name Card Quote Selected Text Bookmark Posts Post Footer Translate Stop Links in Posts +MORE!

              Comment

              • Carrfixr
                Senior Member
                • May 2017
                • 1364
                • 5.5.x

                #40
                Glenn Vergara Thanks Glenn I got that part of it. Now the rest lol
                Last edited by Carrfixr; Sun 26 May '19, 3:44am.

                Comment

                Related Topics

                Collapse

                Working...