Die Schaltflächen werden an das Farbschema angepasst und sollen sich nicht überlappen, wenn es eng wird.
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
color: #737373;
background-color: transparent;
border: 1px solid #737373;
overflow: hidden;
text-overflow: ellipsis;
}
.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover,
input[type="button"]:hover, .button:focus, button:focus, input[type="submit"]:focus,
input[type="reset"]:focus, input[type="button"]:focus {
color: #ffffff;
border-color: #59B34D;
background-color: #59B34D;
outline: 0;
}
.button.button-primary, button.button-primary, input[type="submit"].button-primary,
input[type="reset"].button-primary, input[type="button"].button-primary
{
color: #FFF;
background-color: #59B34D;
border-color: #59B34D;
text-overflow: ellipsis;
}
.button.button-primary:hover, button.button-primary:hover, input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover, input[type="button"].button-primary:hover,
.button.button-primary:focus, button.button-primary:focus, input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus, input[type="button"].button-primary:focus
{
color: #FFF;
background-color: #737373;
border-color: #737373;
}
Eine Schaltfläche im Kontext der Ikonen für soziale Netzwerke soll sich optisch daran etwas anpassen, d.h. mit weniger padding auskommen.
.button.social, .button.button-primary.social {
padding: 0 5px;
}