Resolve "Change buttons colors"

Closes #82 (closed)

src/css/buttons.css

+/***** BUTTON *****/
+.button {
+    margin: 10px;
+    border-color: var(--ifm-color-success);
+    color: var(--ifm-color-frame);
+    border-style: none;
+    white-space : initial;
+    font-family: var(--ifm-font-family-base);
+}
+
+.button--beta {
+    background-color: var(--ifm-color-success);
+    border-color: var(--ifm-color-success);
+    color: var(--ifm-color-frame);
+    border-style: none;
+}
+
+.button--beta:hover {
+    color: var(--ifm-color-secondary);
+    background-color: var(--ifm-color-info);
+    border-style: none;
+}
+
+/* btn note */
+.button--note {
+    background-color: var(--ifm-color-gray-300);
+    color: var(--ifm-color-gray-800);
+    border: 1px solid var(--ifm-color-gray-800);
+}
+
+.button--note:not(.button--outline) {
+    background-color: var(--ifm-color-gray-300);
+    color: var(--ifm-color-gray-800);
+    text-decoration: none;
+    border: 1px solid var(--ifm-color-gray-800);
+}
+
+.button--note:hover, .button--note:not(.button--outline):hover {
+    color: var(--ifm-color-gray-800);
+    background-color: var(--ifm-color-gray-100);
+    border-style: none;
+    border: 1px solid var(--ifm-color-gray-800);
+}
+
+/* btn success */
+.button--success {
+    background-color: var(--ifm-color-success-darkest);
+    color: var(--ifm-color-white);
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--success:not(.button--outline) {
+    background-color: var(--ifm-color-success-darkest);
+    color: var(--ifm-color-white);
+    text-decoration: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--success:hover, .button--success:not(.button--outline):hover {
+    color: var(--ifm-color-secondary);
+    background-color: var(--ifm-color-success);
+    border-style: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+/* btn info */
+.button--info {
+    background-color: var(--ifm-color-info-darkest);
+    color: var(--ifm-color-white);
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--info:not(.button--outline) {
+    background-color: var(--ifm-color-info-darkest);
+    color: var(--ifm-color-white);
+    text-decoration: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--info:hover, .button--info:not(.button--outline):hover {
+    color: var(--ifm-color-secondary);
+    background-color: var(--ifm-color-info-dark);
+    border-style: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+/* btn warning */
+.button--warning {
+    background-color: var(--ifm-color-warning-darkest);
+    color: var(--ifm-color-white);
+}
+
+.button--warning:not(.button--outline) {
+    background-color: var(--ifm-color-warning-darkest);
+    color: var(--ifm-color-white);
+    text-decoration: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--warning:hover, .button--warning:not(.button--outline):hover {
+    color: var(--ifm-color-secondary);
+    background-color: var(--ifm-color-warning-darker);
+    border: 1px solid var(--ifm-color-white);
+}
+
+/* btn danger */
+.button--danger {
+    background-color: var(--ifm-color-danger-darkest);
+    color: var(--ifm-color-white);
+}
+
+.button--danger:not(.button--outline) {
+    background-color: var(--ifm-color-danger-darkest);
+    color: var(--ifm-color-white);
+    text-decoration: none;
+    border: 1px solid var(--ifm-color-white);
+}
+
+.button--danger:hover, .button--danger:not(.button--outline):hover {
+    color: var(--ifm-color-secondary);
+    background-color: var(--ifm-color-danger);
+    border: 1px solid var(--ifm-color-white);
+}
+
+/* button "La doc de Froggit" */
+.breadcrumbs__item--active .breadcrumbs__link {
+    background: var(--ifm-breadcrumb-item-background-active);
+    color: var(--ifm-color-warning);
+}