Round corners etc....

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Pathum
    Senior Member
    • Apr 2012
    • 163
    • 4.1.x

    [vB4] Round corners etc....

    Hello there good people,

    Have got a few questions...

    1. How do you remove round corners ?
    2. How to customize the widget blocks, change border etc ?
    3. How to customize search box, make it more lengthy etc.... ?


    Thank you !!!!
  • Andy
    Senior Member
    • Jan 2002
    • 5886
    • 4.1.x

    #2
    To completely remove the drop shadows and corner radius, place this at the end of your additional.css template.

    Code:
    * { -moz-box-shadow: none !important; }
    * { -webkit-box-shadow: none !important; }
    
    * { -moz-border-radius: 0px !important; }
    * { -webkit-border-radius: 0px !important; }
    Last edited by Andy; Tue 1 May '12, 11:26am.

    Comment

    • Maurd
      Senior Member
      • Jun 2011
      • 672
      • 4.1.x

      #3
      ^ That does not take into account the standard box-shadow: and border-radius: rules. All three types are used in vB's CSS.

      additional.css would also probably be a better place since it's always the last sheet loaded.
      - Maurice Workin' in the Jira mine, goin' down, down, down

      Comment

      • Andy
        Senior Member
        • Jan 2002
        • 5886
        • 4.1.x

        #4
        Correct additional.css is where you put this sort of code. I did a copy from a post made before additional.css was created. I edited my post #2 to avoid confusion.

        Comment

        • Wayne Luke
          vBulletin Technical Support Lead
          • Aug 2000
          • 73976

          #5
          1) Set the stylevar border_radius to 0px.

          2) These are controlled by the sidebar_* stylevars. https://www.vbulletin.com/docs/html/stylevars_sidebar

          3) This would probably require a combination of HTML and CSS changes in the Navbar template and related stylevars.

          You can edit Stylevars in the Style Manager by selecting "Style Variable Editor" from the drop down. You can edit templates in the Style Manager by selecting "Edit Templates" from the drop down or clicking on the "<<>>" button.

          Styles & Templates -> Style Manager.
          Translations provided by Google.

          Wayne Luke
          The Rabid Badger - a vBulletin Cloud demonstration site.
          vBulletin 5 API

          Comment

          • dormopoco
            Member
            • May 2007
            • 60

            #6
            When put:

            * { -moz-box-shadow: none !important; box-shadow:none !important; }
            * { -webkit-box-shadow: none !important; }


            * { -moz-border-radius: 0px !important; }
            * { -webkit-border-radius: 0px !important; }

            Work very well in al browser not in firefox which continues to show rounded corners. Any idea?

            Comment

            • Wayne Luke
              vBulletin Technical Support Lead
              • Aug 2000
              • 73976

              #7
              If you are using a newer version of Firefox, you need to set border-radius and box-shadow to 0 as well. Newer Chrome and IE as well.
              Translations provided by Google.

              Wayne Luke
              The Rabid Badger - a vBulletin Cloud demonstration site.
              vBulletin 5 API

              Comment

              • Andy
                Senior Member
                • Jan 2002
                • 5886
                • 4.1.x

                #8
                Firefox changed the CSS for shadow and rounded corners. Here's the code to use to remove these two. Put this in additional.css

                * { box-shadow: none !important; }
                * { -webkit-box-shadow: none !important; }

                * { border-radius: 0px !important; }
                * { -webkit-border-radius: 0px !important; }

                Comment

                • Zachery
                  Former vBulletin Support
                  • Jul 2002
                  • 59097

                  #9
                  Actually, firefox now just conforms with the standard, assuming they're using an up to date browser.

                  Comment

                  Related Topics

                  Collapse

                  Working...