<commit_before>/*
Buttons

Buttons represent taking an action in OpenLMIS, juxoposed to a link which
represents navigating through OpenLMIS. Most of the buttons should be the
default color presented in section 1.1, with the exception of an edit action,
cancel, warning and disabled buttons. Disabled buttons are a little bit faded
in comparison with their enabled equivalents. They usually contain text, but
may also consist of the image and text.

Buttons should marked up using semantic HTML, where the HTML element is button.

*Note:* `<input type="submit" />` and `<input type="button" />` elements will also be styled as buttons.

### Button Groups
Buttons that change the state of an object or screen in the UI should always be
on the right side of the screen. All other buttons should be pulled to the left.
There should only be a single primary button per screen or pane.

<div class="button-group">
  <button type="button">Default Button</button>
  <button disabled="true" type="button">Default Button</button>
  <button class="primary" type="button">Default Button</button>
  <button class="danger" type="button">Remove Button</button>
  <button class="add" type="button">Add Button</button>
</div>

Button groups are semantic grouping of actions for a specific task or item, if
buttons don't act on the same object, they should not be grouped together.
Unless marked as part of a button group, all buttons are block level and take
up their own vertical space.

<div class="button-group">
  <div class="button-group primary">
    <button class="primary">Primary Button</button>
    <button class="danger">Delete Button</button>
  </div>
  <div class="button-group">
    <button>Cancel Button</button>
    <a>Inline Link</a>
  </div>
  <div class="button-group primary">
    <button>Another Action</button>
  </div>
</div>

### Close Button
<aside>
  <button class="close">Close</button>
  The only exception to these rules is the close button that must always be shown
  in the right hand corner of popovers and modal windows (if they are closable).
</aside>

### Button Icons
Only add icons to buttons through CSS. All buttons must have text that is
accessiable by a screen reader, see button grammar guidelines for rules about
how button text should be phrased. See `button.close` for an example.

Styleguide 1.3
*/

$button-color-default: $light-gray !default;
$button-color-primary: $link-color !default;
$button-color-danger: $brand-danger !default;

button {
    @include button($button-color-default);

    &.primary {
        @include button($button-color-primary);
    }

    &.danger {
        @extend button.primary;
        @include button($button-color-danger);
    }

    &.add {
        @include button-icon('plus');
    }
}

button.close {
    @include button-icon-only("times");
    background: transparent;
    color: $text-color;
}

.button-group {
    @extend .clearfix;
    margin-left: -0.5em;
    margin-right: -0.5em;

    > *,
    > button {
        display: block;
        margin: 0px 0.5em;
        float: left;
    }

    > .button-group.primary,
    > button.primary {
        float: right;
    }

    > a {
        padding: 0.5em 0em;
    }

    > .button-group {
        margin: 0px;
    }
}

.btn,
input[type=button] {
    @extend button;
}

.btn-primary,
input[type=submit] {
    @extend button.primary;
}

.btn-add,
input[type=submit].add {
    @extend button.add;
}
<commit_msg>OLMIS-2444: fixed some styles in add button class<commit_after>/*
Buttons

Buttons represent taking an action in OpenLMIS, juxoposed to a link which
represents navigating through OpenLMIS. Most of the buttons should be the
default color presented in section 1.1, with the exception of an edit action,
cancel, warning and disabled buttons. Disabled buttons are a little bit faded
in comparison with their enabled equivalents. They usually contain text, but
may also consist of the image and text.

Buttons should marked up using semantic HTML, where the HTML element is button.

*Note:* `<input type="submit" />` and `<input type="button" />` elements will also be styled as buttons.

### Button Groups
Buttons that change the state of an object or screen in the UI should always be
on the right side of the screen. All other buttons should be pulled to the left.
There should only be a single primary button per screen or pane.

<div class="button-group">
  <button type="button">Default Button</button>
  <button disabled="true" type="button">Default Button</button>
  <button class="primary" type="button">Default Button</button>
  <button class="danger" type="button">Remove Button</button>
  <button class="add" type="button">Add Button</button>
</div>

Button groups are semantic grouping of actions for a specific task or item, if
buttons don't act on the same object, they should not be grouped together.
Unless marked as part of a button group, all buttons are block level and take
up their own vertical space.

<div class="button-group">
  <div class="button-group primary">
    <button class="primary">Primary Button</button>
    <button class="danger">Delete Button</button>
  </div>
  <div class="button-group">
    <button>Cancel Button</button>
    <a>Inline Link</a>
  </div>
  <div class="button-group primary">
    <button>Another Action</button>
  </div>
</div>

### Close Button
<aside>
  <button class="close">Close</button>
  The only exception to these rules is the close button that must always be shown
  in the right hand corner of popovers and modal windows (if they are closable).
</aside>

### Button Icons
Only add icons to buttons through CSS. All buttons must have text that is
accessiable by a screen reader, see button grammar guidelines for rules about
how button text should be phrased. See `button.close` for an example.

Styleguide 1.3
*/

$button-color-default: $light-gray !default;
$button-color-primary: $link-color !default;
$button-color-danger: $brand-danger !default;

button {
    @include button($button-color-default);

    &.primary {
        @include button($button-color-primary);
    }

    &.danger {
        @extend button.primary;
        @include button($button-color-danger);
    }

    &.add {
        @extend button.primary;
        @include button($button-color-default);
        @include button-icon('plus');
    }
}

button.close {
    @include button-icon-only("times");
    background: transparent;
    color: $text-color;
}

.button-group {
    @extend .clearfix;
    margin-left: -0.5em;
    margin-right: -0.5em;

    > *,
    > button {
        display: block;
        margin: 0px 0.5em;
        float: left;
    }

    > .button-group.primary,
    > button.primary {
        float: right;
    }

    > a {
        padding: 0.5em 0em;
    }

    > .button-group {
        margin: 0px;
    }
}

.btn,
input[type=button] {
    @extend button;
}

.btn-primary,
input[type=submit] {
    @extend button.primary;
}

.btn-add,
input[type=submit].add {
    @extend button.add;
}

{'fraction_non_alphanumeric': 0.11117494972708991, 'fraction_numerical': 0.004883654122378627, 'mean_word_length': 3.4406887755102042, 'pattern_counts': {'":': 0, '<': 75, '<?xml version=': 0, '>': 87, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5029776', 'n_tokens_mistral': 2082, 'n_tokens_neox': 2019, 'n_words': 771}