0

How can you define a custom class to create bootstrap buttons.

In my theme I have

  • Edit Button

    <a class='btn btn-flat bg-green btn-xs' href='...'>Edit</a>

  • Delete Button

    <a class='btn btn-flat bg-red btn-xs' href='...'>Edit</a>

Can I use a single class for each that imports the styles without having to redefine the style code.

ex:

<a class='btn-app-edit' href='...'>Edit</a>

Is there a css function that can do this ? ex:

.btn-app-edit:inherit('btn btn-flat bg-green');

Having a feature like this means that when the master theme is replaced or changes from bootstrap to another css framework, my custom classes can just link up to the new Css framework rather than having to change the implementation everywhere.

Siguza
  • 21,155
  • 6
  • 52
  • 89
user1827093
  • 87
  • 3
  • 11
  • 1
    How about using LESS? – Maroun Baydoun Aug 10 '15 at 01:06
  • Thought of that. I havnt used LESS as of yet. Just hoping for a simple Css3 function. If not may have to use LESS – user1827093 Aug 10 '15 at 01:18
  • There is no inheritance in css. Like Maroun suggested, use `less` to acheive. `less` uses js and has quite some handy functions like `import` and stuff and you can reuse class. Refer this : http://stackoverflow.com/a/1065476/2196341 – Polynomial Proton Aug 10 '15 at 01:19
  • thanks, I'm looking up less now. I can definitely see the benefits. Ill setup my environment for less and start converting my main theme file. blah – user1827093 Aug 10 '15 at 01:49
  • looking at less, would I use mixing? ex: `.mybutton {.btn .btn-flat}` – user1827093 Aug 10 '15 at 01:55
  • possible duplicate of [Can a CSS class inherit one or more other classes?](http://stackoverflow.com/questions/1065435/can-a-css-class-inherit-one-or-more-other-classes) – Vishnu Aug 10 '15 at 09:15

0 Answers0