source: admin/style/scss/partials/_buttons.scss @ 3517:7db06cb5e221

/* Removes inner padding and border in FF3+  - Knacss */

button::-moz-focus-inner,
input[type=button]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner {
     border: 0;
     padding: 0;
}


/* tous les boutons */

button,
a.button,
input[type=button],
input[type=reset],
input[type=submit] {
     border: 1px solid #ccc;
     font-family: $sans-serif-input;
     padding: 3px 10px;
     line-height: normal !important;
     display: inline-block;
     font-size: 100%;
     text-align: center;
     text-decoration: none;
     cursor: pointer;
     position: relative;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
     border-style: solid;
     border-width: 1px;
}

a.button {
     vertical-align: middle;
}

/* Boutons javascript (dépliage/repliage, …) */

.void-btn {
     border: none;
     border-radius: 0;
     padding: 0;
}


/* validation */

input[type=submit],
button[type=submit],
a.button.submit,
button.submit,
input.button.start {
     color: #fff;
     background-color: #25a6e1;
     @include background-image(linear-gradient(to bottom, #25a6e1, #188bc0));
     border-color: #25a6e1;
}

input[type=submit]:hover,
input[type=submit]:focus,
button[type=submit]:hover,
button[type=submit]:focus,
input.button.start:hover,
input.button.start:focus,
button.submit:hover,
button.submit:focus,
a.button.submit:hover,
a.button.submit:focus {
     background-color: #188bc0;
     @include background-image(linear-gradient(to bottom, #188bc0, #25a6e1));
     border-color: #188bc0;
}


/* suppression, reset, "neutres" fond gris */

button,
input[type=button],
input.button,
input[type=reset],
input[type=submit].reset,
input.reset,
input[type=submit].delete,
input.delete,
a.button,
a.button.delete,
a.button.reset {
     color: #000;
     background-color: #eaeaea;
     @include background-image(linear-gradient(to bottom, #f9f9f9, #eaeaea));
     background-repeat: repeat-x;
     border-color: #dfdfdf #dfdfdf #c5c5c5;
}

button:hover,
input[type=button]:hover,
input.button:hover,
button:focus,
input[type=button]:focus,
input.button:focus,
input[type=reset]:hover,
input[type=submit].reset:hover,
input.reset:hover,
input[type=reset]:focus,
input[type=submit].reset:focus,
input.reset:focus,
input[type=submit].delete:hover,
input.delete:hover,
input[type=submit].delete:focus,
input.delete:focus,
a.button.delete:hover,
a.button.reset:hover,
a.button:hover,
a.button.delete:focus,
a.button.reset:focus,
a.button:focus {
     background-color: #dadada;
     @include background-image(linear-gradient(to bottom, #eaeaea, #dadada));
     background-repeat: repeat-x;
     border-color: #cccccc #cccccc #b5b5b5;
}


/* suppression */

input[type=submit].delete,
input.delete,
button[type=submit].delete,
button.delete,
a.button.delete {
     color: #900;
}

input[type=submit].delete:hover,
input.delete:hover,
button[type=submit].delete:hover,
button.delete:hover,
a.button.delete:hover,
input[type=submit].delete:focus,
input.delete:focus,
button[type=submit].delete:focus,
button.delete:focus,
a.button.delete:focus {
     color: #ffffff;
     background-color: #b33630;
     @include background-image(linear-gradient(to bottom, #dc5f59, #b33630));
     background-repeat: repeat-x;
     border-color: #cd504a;
}

#info-box a.button,
#info-box button {
     padding: 0 .5em;
     margin-left: 2em;
}

.button.add,
button.add {
     color: #000;
     background-color: #bee74b;
     @include background-image(linear-gradient(to bottom, #bee74b, #9bca1c));
     border-color: #bee74b;
     padding: .33em 1.33em .5em;
}

.button.add:hover,
.button.add:active,
.button.add:focus,
button.add:hover,
button.add:active,
button.add:focus {
     background-color: #9bca1c;
     @include background-image(linear-gradient(to bottom, #9bca1c, #bee74b));
     border-color: #9bca1c;
}

.button-add:focus {
     outline: dotted 1px;
}


/* paragraphe pour bouton Nouveau bidule */

p.top-add {
     text-align: right;
     margin: 0;
}


/* disabled */

input.disabled,
input[type=submit].disabled,
button.disabled,
button[type=submit].disabled {
     color: #676e78;
     background: #F5F5F5;
     border: 1px solid #CCC;
}

input.disabled:hover,
input[type=submit].disabled:hover,
button.disabled:hover,
button[type=submit].disabled:hover {
     color: #676e78;
     background: #eee;
     border: 1px solid #CCC;
}


/* specific buttons */

// Ajax or js buttons (action do not reload current page)
.checkbox-helper,
#gototop,
.metaGetList,
.metaGetMore,
a.checkbox-helper,
a#gototop,
a.metaGetList,
a.metaGetMore {
     font-size: 0.825em;
     color: #333;
     background: #fff;
     box-shadow: none;
     border: 1px solid #676e78;
     margin-bottom: .25em;
     text-align: center;
     &:hover {
          background: #a2cbe9;
          box-shadow: none;
          border: 1px solid #676e78;
     }
}

#gototop {
     display: none;
     z-index: 1000;
     position: fixed;
     bottom: 0;
     right: .5em;
     width: 10em;
     padding: .25em;
     border-radius: .25em;
     a,
     a:link,
     a:hover,
     a:active {
          color: #333;
          background: transparent;
          border: none;
     }
}

.metaRemove,
.addMeta button:not(.metaGetMore),
.addMeta a:not(.metaGetMore) {
     border: none;
     border-radius: 0;
     padding: 0;
     background: none;
}

.addMeta button:not(.metaGetMore),
.addMeta a:not(.metaGetMore) {
     box-shadow: initial;
     margin-bottom: 2px;
     &:hover,
     &:focus {
          background: #fc0;
     }
}