<commit_before>//////////////////// MIXINS

// Minimal, well-documented, general-purpose CSS mixins.
// (Some are same as Bootstrap.)

////////// Box-Sizing: Border-Box

// Setting `box-sizing: border-box` on an element causes the CSS
// layout algorithm to interpret `width` and `height` declarations
// as referring to the size of the border box (outside the border),
// not the content box as usual (inside the padding).
//
// This is especially useful for stretching a form element to the
// width of its container even if the form element has arbitrary
// padding and borders, which can be done using `width: 100%`.
//
// Browser support is IE 8+ and all modern browsers, with the caveat
// that `-moz-box-sizing` in Firefox is considered to have some
// buggy or non-compliant behavior.  For example, min/max-width/height
// may not interact correctly.  Box-sizing is thus not a feature to
// base a major layout system around.
//
// See https://bugzilla.mozilla.org/show_bug.cgi?id=243412.
.box-sizing-by-border () {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

////////// Border-Radius

// These vendor prefixes should be sufficient.  For example, an Opera
// prefix is not necessary.

.border-radius(@radius) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
}

.border-top-left-radius(@radius) {
  -webkit-border-top-left-radius: @radius;
  -moz-border-radius-topleft: @radius;
  border-top-left-radius: @radius;
}

.border-top-right-radius(@radius) {
  -webkit-border-top-right-radius: @radius;
  -moz-border-radius-topright: @radius;
  border-top-right-radius: @radius;
}

.border-bottom-right-radius(@radius) {
  -webkit-border-bottom-right-radius: @radius;
  -moz-border-radius-bottomright: @radius;
  border-bottom-right-radius: @radius;
}

.border-bottom-left-radius(@radius) {
  -webkit-border-bottom-left-radius: @radius;
  -moz-border-radius-bottomleft: @radius;
  border-bottom-left-radius: @radius;
}

////////// Display: Inline-block

.display-inline-block () {
  display: inline-block;

  // IE 7 hacks:
  //*display: inline;
  //*zoom: 1;
}

//////////////////// LOGIN BUTTONS

@login-buttons-accounts-dialog-width: 178px;
#login-buttons {
  .display-inline-block();

  .login-header {
    float: left;
    padding-right: 2px;
    line-height: 1.5;
    font-family: 'Helvetica Neue', Helvetica, Arial, default;
  }
  .loading {
    width: 24px;
    height: 24px;
    background-image: url(data:image/gif;base64,R0lGODlhGAAYAKUAAAQGBISGhMTGxERGRKSmpOTm5CQmJGRmZJSWlNTW1DQ2NLS2tPT29BQWFHR2dFxeXIyOjMzOzExOTOzu7CwuLJyenNze3Dw+PLy+vBweHKyurGxubPz+/ISChAwODIyKjMzKzExKTKyqrOzq7CwqLGxqbJyanNza3Dw6PLy6vPz6/BwaHHx6fJSSlNTS1FRSVPTy9DQyNKSipOTi5ERCRMTCxCQiJP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBgA3ACwAAAAAGAAYAAAG/sCbcHhj1CqQD0IkmKmI0CHMJHk9So5Aq6LBOKPDSEhBk1yzW1GqlmCAFyQS2dyRiUT2hcB1chNB<KEY>);
  }
}

#login-buttons .login-button, .accounts-dialog .login-button {
    cursor: pointer;
    padding: 1px 4px;
    height: 20px;

    font-size: 80%;
    font-family: 'Helvetica Neue', Helvetica, Arial, default;
    line-height: 1.5;
    color: white;
    text-shadow: #062C50 0px 1px 0px;

    text-align: center;

    background: #79859D;
    border: 1px solid #062C50;
    border-top-color: #103372;
    border-left-color: #103372;
    .border-radius(3px);
}


#login-buttons .login-button-disabled, .accounts-dialog .login-button-disabled {
    color: #ccc;
}


.accounts-dialog * { /* precendence of this selector is significant */
/*
A base for our dialog CSS, to reset browser styles and protect against
the app's CSS.  Dialogs include the dropdown, config modals, and the
reset password modal.  We can't completely isolate the dialogs from
the app's CSS, and that isn't the goal because the app can style them.
This rule is a compromise that should take precedence over some very
broad rules but be overridden by more specific ones.

Add more declarations here if they help the dialogs look good
out-of-the-box in more apps.
*/

  padding: 0;
  margin: 0;
  line-height: inherit;
  color: inherit;
  font: inherit;
}

.accounts-dialog .login-button {
    display: block;
    width: auto;
    margin-bottom: 4px;
}

#login-buttons {
  .login-header { margin-right: 4px; }
  .configure-button { background: red; }
  .login-link-text { margin-left: 5px; /* so that other elements aren't too close */ }

  .login-image {
    float: left;
    margin: 2px 5px 2px 0px;
    width: 16px;
    height: 16px;
  }

  .no-services { color: red; }

  .login-link-and-dropdown-list {
    right: 5px;
    position: relative;
  }
  .login-close-text {
    float: left;
    position: relative;
    left: 1px; /* = #login-buttons.border-width */
    padding-bottom: 3px;
  }

  .login-close-text-clear { clear: both; }

  .or { text-align: center; }
  .hline { text-decoration: line-through; color: lightgrey; }
  .or-text { font-weight: bold; }

  #signup-link { float: right; }
  #forgot-password-link { float: left; }
  #back-to-login-link { float: right; }
}

#login-buttons a, .accounts-dialog a {
    cursor: pointer;
    text-decoration: underline;
}

.login-buttons-dropdown-hangs-left #login-buttons .login-close-text {
    float: right;
}

@login-buttons-accounts-dialog-padding-left: 8px;

.accounts-dialog {
  border: 1px solid #666;
  z-index: 1000;
  background: white;

  -moz-box-shadow:    0 3px 6px 1px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 3px 6px 1px rgba(0, 0, 0, 0.3);
  box-shadow:         0 3px 6px 1px rgba(0, 0, 0, 0.3);

  .border-radius(3px);

  margin-top: -5px;
  padding-top: 4px; /* = border-width - margin-top */

  margin-right: -8px;
  padding-right: 8px; /* = -margin-right */

  padding-left: @login-buttons-accounts-dialog-padding-left;
  padding-bottom: 8px;

  margin-left: 0;
  margin-bottom: 0;

  width: @login-buttons-accounts-dialog-width + 9; /* not sure what this 9 is */

  font-size: 16px;
  color: #333;
  line-height: 1.6;

  label, .title {
    font-weight: bold;
    font-size: 80%;
  }
  input {
    // Be compatible with Bootstrap and apps that customize padding
    // and border on inputs.  Be pixel-accurate in IE 8+.
    .box-sizing-by-border();
    width: 100%;
    // Given that any `height` declaration will describe the total
    // height including padding, prop the text field open a little
    // bit if there is a small specified height.
    // This plays nice with Bootstrap.
    min-height: 30px;
  }

  .login-button-form-submit { margin-top: 8px; }
  .message { font-size: 80%; margin-top: 2px; }
  .error-message { color: red; }
  .info-message { color: green; }
  .additional-link { font-size: 60%; }

  #login-buttons-cancel-reset-password { float: right; }
  #login-buttons-cancel-enroll-account { float: right; }
}

#login-dropdown-list {
    position: absolute;
    top: 0px;
}

.login-buttons-dropdown-hangs-left #login-dropdown-list {
    right: 0px;
}

#login-buttons-message-dialog .message {
    /* we intentionally want it bigger on this dialog since it's the only thing displayed */
    font-size: 100%;
}

.accounts-centered-dialog {
    font-family: 'Helvetica Neue', Helvetica, Arial, default;

    z-index: 1000;
    position: fixed;

    left: 50%;
    margin-left: -(@login-buttons-accounts-dialog-width
                 + @login-buttons-accounts-dialog-padding-left) / 2;

    top: 50%;
    margin-top: -40px; /* = approximately -height/2, though height can change */
}

@configure-login-service-dialog-width: 530px;

#configure-login-service-dialog {
  width: @configure-login-service-dialog-width;
  margin-left: -(@configure-login-service-dialog-width
               + @login-buttons-accounts-dialog-padding-left) / 2;
  margin-top: -180px; /* = approximately -height/2, though height can change */

  table { width: 100%; }
  input {
    width: 100%;
    font-family: "Courier New", Courier, monospace;
  }
  ol {
    margin-top: 10px;
    margin-bottom: 10px;

    li { margin-left: 30px; }
  }
  .configuration_labels { width: 30%; }
  .configuration_inputs { width: 70%; }
  .new-section { margin-top: 10px; }
  .url { font-family: "Courier New", Courier, monospace; }
}

#configure-login-service-dialog-save-configuration {
  float: right;
}

#configure-login-service-dismiss-button {
  float: left;
}

#just-verified-dismiss-button, #messages-dialog-dismiss-button {
    margin-top: 4px;
}

.hide-background {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999;

    /* XXX consider replacing with DXImageTransform */
    background-color: rgb(0.2, 0.2, 0.2); /* fallback for IE7-8 */

    background-color: rgba(0, 0, 0, 0.7);
}
<commit_msg>Add nice colors and gradients to buttons<commit_after>//////////////////// MIXINS

// Minimal, well-documented, general-purpose CSS mixins.
// (Some are same as Bootstrap.)

////////// Box-Sizing: Border-Box

// Setting `box-sizing: border-box` on an element causes the CSS
// layout algorithm to interpret `width` and `height` declarations
// as referring to the size of the border box (outside the border),
// not the content box as usual (inside the padding).
//
// This is especially useful for stretching a form element to the
// width of its container even if the form element has arbitrary
// padding and borders, which can be done using `width: 100%`.
//
// Browser support is IE 8+ and all modern browsers, with the caveat
// that `-moz-box-sizing` in Firefox is considered to have some
// buggy or non-compliant behavior.  For example, min/max-width/height
// may not interact correctly.  Box-sizing is thus not a feature to
// base a major layout system around.
//
// See https://bugzilla.mozilla.org/show_bug.cgi?id=243412.
.box-sizing-by-border () {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

////////// Border-Radius

// These vendor prefixes should be sufficient.  For example, an Opera
// prefix is not necessary.

.border-radius(@radius) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
}

.border-top-left-radius(@radius) {
  -webkit-border-top-left-radius: @radius;
  -moz-border-radius-topleft: @radius;
  border-top-left-radius: @radius;
}

.border-top-right-radius(@radius) {
  -webkit-border-top-right-radius: @radius;
  -moz-border-radius-topright: @radius;
  border-top-right-radius: @radius;
}

.border-bottom-right-radius(@radius) {
  -webkit-border-bottom-right-radius: @radius;
  -moz-border-radius-bottomright: @radius;
  border-bottom-right-radius: @radius;
}

.border-bottom-left-radius(@radius) {
  -webkit-border-bottom-left-radius: @radius;
  -moz-border-radius-bottomleft: @radius;
  border-bottom-left-radius: @radius;
}

////////// Display: Inline-block

.display-inline-block () {
  display: inline-block;

  // IE 7 hacks:
  //*display: inline;
  //*zoom: 1;
}

//////////////////// LOGIN BUTTONS

@login-buttons-accounts-dialog-width: 178px;
#login-buttons {
  .display-inline-block();

  .login-header {
    float: left;
    padding-right: 2px;
    line-height: 1.5;
    font-family: 'Helvetica Neue', Helvetica, Arial, default;
  }
  .loading {
    width: 24px;
    height: 24px;
    background-image: url(data:image/gif;base64,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);
  }
}

#login-buttons .login-button, .accounts-dialog .login-button {
    cursor: pointer;
    padding: 1px 4px;
    height: 20px;

    font-size: 80%;
    font-family: 'Helvetica Neue', Helvetica, Arial, default;
    line-height: 1.5;
    color: white;
    text-shadow: #062C50 0px 1px 0px;

    text-align: center;

    background: #79859D;
    border: 1px solid #062C50;
    border-top-color: #103372;
    border-left-color: #103372;
    .border-radius(3px);

    text-shadow: 0px -1px 0px #3b64bd; color: #ffffff; background-color: #5982DB; background-image: -moz-linear-gradient(top, #77a0f9, #3b64bd); background-image: -ms-linear-gradient(top, #77a0f9, #3b64bd); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#77a0f9), to(#3b64bd)); background-image: -webkit-linear-gradient(top, #77a0f9, #3b64bd); background-image: -o-linear-gradient(top, #77a0f9, #3b64bd); background-image: linear-gradient(top, #77a0f9, #3b64bd); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a0f9', endColorstr='#3b64bd', GradientType=0); border-color: #5982DB #3b64bd #3b64bd #5982DB; border-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.25);
}

#login-buttons .login-button-disabled, .accounts-dialog .login-button-disabled {
    color: #ccc;
}


.accounts-dialog * { /* precendence of this selector is significant */
/*
A base for our dialog CSS, to reset browser styles and protect against
the app's CSS.  Dialogs include the dropdown, config modals, and the
reset password modal.  We can't completely isolate the dialogs from
the app's CSS, and that isn't the goal because the app can style them.
This rule is a compromise that should take precedence over some very
broad rules but be overridden by more specific ones.

Add more declarations here if they help the dialogs look good
out-of-the-box in more apps.
*/

  padding: 0;
  margin: 0;
  line-height: inherit;
  color: inherit;
  font: inherit;
}

.accounts-dialog .login-button {
    display: block;
    width: auto;
    margin-bottom: 4px;
}

#login-buttons {
  .login-header { margin-right: 4px; }
  .configure-button { text-shadow: 0px -1px 0px #e12600; color: #ffffff; background-color: #FF4409; background-image: -moz-linear-gradient(top, #ff6227, #e12600); background-image: -ms-linear-gradient(top, #ff6227, #e12600); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff6227), to(#e12600)); background-image: -webkit-linear-gradient(top, #ff6227, #e12600); background-image: -o-linear-gradient(top, #ff6227, #e12600); background-image: linear-gradient(top, #ff6227, #e12600); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff6227', endColorstr='#e12600', GradientType=0); border-color: #FF4409 #e12600 #e12600 #FF4409; border-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.25); }
  .login-link-text { margin-left: 5px; /* so that other elements aren't too close */ }

  .login-image {
    float: left;
    margin: 2px 5px 2px 0px;
    width: 16px;
    height: 16px;
  }

  .no-services { color: red; }

  .login-link-and-dropdown-list {
    right: 5px;
    position: relative;
  }
  .login-close-text {
    float: left;
    position: relative;
    left: 1px; /* = #login-buttons.border-width */
    padding-bottom: 3px;
  }

  .login-close-text-clear { clear: both; }

  .or { text-align: center; }
  .hline { text-decoration: line-through; color: lightgrey; }
  .or-text { font-weight: bold; }

  #signup-link { float: right; }
  #forgot-password-link { float: left; }
  #back-to-login-link { float: right; }
}

#login-buttons a, .accounts-dialog a {
    cursor: pointer;
    text-decoration: underline;
}

.login-buttons-dropdown-hangs-left #login-buttons .login-close-text {
    float: right;
}

@login-buttons-accounts-dialog-padding-left: 8px;

.accounts-dialog {
  border: 1px solid #666;
  z-index: 1000;
  background: white;

  -moz-box-shadow:    0 3px 6px 1px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 3px 6px 1px rgba(0, 0, 0, 0.3);
  box-shadow:         0 3px 6px 1px rgba(0, 0, 0, 0.3);

  .border-radius(3px);

  margin-top: -5px;
  padding-top: 4px; /* = border-width - margin-top */

  margin-right: -8px;
  padding-right: 8px; /* = -margin-right */

  padding-left: @login-buttons-accounts-dialog-padding-left;
  padding-bottom: 8px;

  margin-left: 0;
  margin-bottom: 0;

  width: @login-buttons-accounts-dialog-width + 9; /* not sure what this 9 is */

  font-size: 16px;
  color: #333;
  line-height: 1.6;

  label, .title {
    font-weight: bold;
    font-size: 80%;
  }
  input {
    // Be compatible with Bootstrap and apps that customize padding
    // and border on inputs.  Be pixel-accurate in IE 8+.
    .box-sizing-by-border();
    width: 100%;
    // Given that any `height` declaration will describe the total
    // height including padding, prop the text field open a little
    // bit if there is a small specified height.
    // This plays nice with Bootstrap.
    min-height: 30px;
  }

  .login-button-form-submit { margin-top: 8px; }
  .message { font-size: 80%; margin-top: 2px; }
  .error-message { color: red; }
  .info-message { color: green; }
  .additional-link { font-size: 60%; }

  #login-buttons-cancel-reset-password { float: right; }
  #login-buttons-cancel-enroll-account { float: right; }
}

#login-dropdown-list {
    position: absolute;
    top: 0px;
}

.login-buttons-dropdown-hangs-left #login-dropdown-list {
    right: 0px;
}

#login-buttons-message-dialog .message {
    /* we intentionally want it bigger on this dialog since it's the only thing displayed */
    font-size: 100%;
}

.accounts-centered-dialog {
    font-family: 'Helvetica Neue', Helvetica, Arial, default;

    z-index: 1000;
    position: fixed;

    left: 50%;
    margin-left: -(@login-buttons-accounts-dialog-width
                 + @login-buttons-accounts-dialog-padding-left) / 2;

    top: 50%;
    margin-top: -40px; /* = approximately -height/2, though height can change */
}

@configure-login-service-dialog-width: 530px;

#configure-login-service-dialog {
  width: @configure-login-service-dialog-width;
  margin-left: -(@configure-login-service-dialog-width
               + @login-buttons-accounts-dialog-padding-left) / 2;
  margin-top: -180px; /* = approximately -height/2, though height can change */

  table { width: 100%; }
  input {
    width: 100%;
    font-family: "Courier New", Courier, monospace;
  }
  ol {
    margin-top: 10px;
    margin-bottom: 10px;

    li { margin-left: 30px; }
  }
  .configuration_labels { width: 30%; }
  .configuration_inputs { width: 70%; }
  .new-section { margin-top: 10px; }
  .url { font-family: "Courier New", Courier, monospace; }
}

#configure-login-service-dialog-save-configuration {
  float: right;
}

#configure-login-service-dismiss-button {
  float: left;
}

#just-verified-dismiss-button, #messages-dialog-dismiss-button {
    margin-top: 4px;
}

.hide-background {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 999;

    /* XXX consider replacing with DXImageTransform */
    background-color: rgb(0.2, 0.2, 0.2); /* fallback for IE7-8 */

    background-color: rgba(0, 0, 0, 0.7);
}

{'fraction_non_alphanumeric': 0.10673424514590243, 'fraction_numerical': 0.05381433309730556, 'mean_word_length': 4.906669601584856, 'pattern_counts': {'":': 0, '<': 4, '<?xml version=': 0, '>': 4, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 13, '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': '6187795', 'n_tokens_mistral': 13438, 'n_tokens_neox': 12228, 'n_words': 1666}