Current oav website
This commit is contained in:
Charlie Root
289
dotclear._no/admin/style/scss/partials/_buttons.scss
Normal file
289
dotclear._no/admin/style/scss/partials/_buttons.scss
Normal file
@ -0,0 +1,289 @@
|
||||
/* 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 $button-border;
|
||||
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 $button-shadow;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
a.button {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* validation */
|
||||
|
||||
input[type=submit],
|
||||
button[type=submit],
|
||||
a.button.submit,
|
||||
button.submit,
|
||||
input.button.start {
|
||||
color: $submit-color;
|
||||
background-color: $submit-background;
|
||||
@include background-image(linear-gradient(to bottom, $submit-background, $submit-background-alt));
|
||||
border-color: $submit-background;
|
||||
}
|
||||
|
||||
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: $submit-background-alt;
|
||||
@include background-image(linear-gradient(to bottom, $submit-background-alt, $submit-background));
|
||||
border-color: $submit-background-alt;
|
||||
}
|
||||
|
||||
|
||||
/* 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: $reset-color;
|
||||
background-color: $reset-background;
|
||||
@include background-image(linear-gradient(to bottom, $reset-background-alt, $reset-background));
|
||||
background-repeat: repeat-x;
|
||||
border-color: $reset-border;
|
||||
}
|
||||
|
||||
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: $reset-background-ter;
|
||||
@include background-image(linear-gradient(to bottom, $reset-background, $reset-background-ter));
|
||||
background-repeat: repeat-x;
|
||||
border-color: $reset-border;
|
||||
}
|
||||
|
||||
|
||||
/* suppression */
|
||||
|
||||
input[type=submit].delete,
|
||||
input.delete,
|
||||
button[type=submit].delete,
|
||||
button.delete,
|
||||
a.button.delete {
|
||||
color: $delete-color;
|
||||
}
|
||||
|
||||
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: $delete-hover-color;
|
||||
background-color: $delete-hover-background;
|
||||
@include background-image(linear-gradient(to bottom, $delete-hover-background-alt, $delete-hover-background));
|
||||
background-repeat: repeat-x;
|
||||
border-color: $delete-hover-border;
|
||||
}
|
||||
|
||||
#info-box a.button,
|
||||
#info-box button {
|
||||
padding: 0 .5em;
|
||||
margin-left: 2em;
|
||||
}
|
||||
|
||||
.button.add,
|
||||
button.add {
|
||||
color: $add-color;
|
||||
background-color: $add-background;
|
||||
@include background-image(linear-gradient(to bottom, $add-background, $add-background-alt));
|
||||
border-color: $add-border;
|
||||
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: $add-background-alt;
|
||||
@include background-image(linear-gradient(to bottom, $add-background-alt, $add-background));
|
||||
border-color: $add-border-alt;
|
||||
}
|
||||
|
||||
.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: $button-disabled-color;
|
||||
background: $button-disabled-background;
|
||||
border: 1px solid $button-disabled-border;
|
||||
}
|
||||
|
||||
input.disabled:hover,
|
||||
input[type=submit].disabled:hover,
|
||||
button.disabled:hover,
|
||||
button[type=submit].disabled:hover {
|
||||
color: $button-disabled-color;
|
||||
background: $button-disabled-background-alt;
|
||||
border: 1px solid $button-disabled-border;
|
||||
}
|
||||
|
||||
/* Boutons javascript (dépliage/repliage, …) */
|
||||
|
||||
.void-btn {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
button.details-cmd {
|
||||
font-size: 0.9em;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
margin: 0 5px 0 0;
|
||||
color: currentColor;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: transparent;
|
||||
color: $input-focus;
|
||||
}
|
||||
}
|
||||
|
||||
/* 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: $ajax-color;
|
||||
background: $ajax-background;
|
||||
box-shadow: none;
|
||||
border: 1px solid $ajax-border;
|
||||
margin-bottom: .25em;
|
||||
text-align: center;
|
||||
&:hover {
|
||||
background: $ajax-background-alt;
|
||||
box-shadow: none;
|
||||
border: 1px solid $ajax-border;
|
||||
}
|
||||
}
|
||||
|
||||
#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: $gotop-color;
|
||||
background: $gotop-background;
|
||||
border: $gotop-border;
|
||||
}
|
||||
}
|
||||
|
||||
.metaRemove,
|
||||
.addMeta button:not(.metaGetMore),
|
||||
.addMeta a:not(.metaGetMore) {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
color: $addmeta-color;
|
||||
background: $addmeta-background;
|
||||
}
|
||||
|
||||
.addMeta button:not(.metaGetMore),
|
||||
.addMeta a:not(.metaGetMore) {
|
||||
box-shadow: initial;
|
||||
margin-bottom: 2px;
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $addmeta-focus-color;
|
||||
background: $addmeta-focus-background;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user