<commit_before>.transition (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-transition: @value;
  -moz-transition: @value;
  -ms-transition: @value;
  -o-transition: @value;
  transition: @value;
}

.transform (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  transform:@value;
  -ms-transform:@value;
  -webkit-transform:@value;
  -o-transform:@value;
  -moz-transform:@value;
}

.border-box {
  box-sizing:border-box;
  -moz-box-sizing:border-box;
}

.box-shadow (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-box-shadow: @value;
  -moz-box-shadow: @value;
  -ms-box-shadow: @value;
  -o-box-shadow: @value;
  box-shadow: @value;
}

.border-radius (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-border-radius: @value;
  -moz-border-radius: @value;
  -ms-border-radius: @value;
  -o-border-radius: @value;
  border-radius: @value;
}



html,
body {
  font-family:Arial;
  font-size:14px;
  overflow-x:hidden;
  padding: 0;
  margin: 0;
  width: 100%;
  height:100%;
  
  @sidebar-width:250px;
  @sidebar-width-res:20px;
  @new-note-margin:20px;
  @shadow-color: #666666;
  @main-color: #d4ff2a;

  .sidebar {
    display:block;
    >div {
      position:absolute;
      z-index:2;
      top:0;
      width:@sidebar-width - 1px;
      height:100%;
      .border-box;
      .transition(-webkit-transform ease 250ms);
      .transition(transform ease 250ms);
      .box-shadow(1px 6px 6px @shadow-color);

      &.left {
        background: @main-color;
        left:(@sidebar-width - @sidebar-width-res)*-1;
      }
      &.visible.left {
        .transform(translateX(@sidebar-width - @sidebar-width-res));
      }
      
      >.menu-item {
        float:left;
	width:100%;
	margin:0;
	padding:10px 15px;
	border-bottom:solid 1px #555;
	cursor:pointer;
	.border-box;
	color: black;
        &:hover {
	  color: @shadow-color;
	}
        >span {
	  float:left;
	  color:inherit;
	}
      }
    }
  }

  .main {
    display:block;

    >div {
      position:absolute;
      padding-left: 10px;
      z-index:1;
      top:0;
      width: 100%;
      height:100%;
      .transition(-webkit-transform ease 250ms);
      .transition(transform ease 250ms);

      margin-left: @sidebar-width-res;

      &.shrunk {
        .transform(translateX(@sidebar-width - @sidebar-width-res));
	margin-right: @sidebar-width - @sidebar-width-res
      }

      header h1 {
        font-family: 'Helvetica Neue', Helvetica, sans-serif;
        font-size: 60px;
        font-weight: 100;
        margin: 0;
        padding: 0;
      }
    }
  }

  #new-note-btn {
    position: fixed;
    bottom: 0px;
    right: 0px;
    z-index: 1000;
    margin-bottom: @new-note-margin;
    margin-right: @new-note-margin+5px;

    #new-note-btn-img {
      .border-radius(24px);
      .box-shadow(0 3px 3px @shadow-color);
      .transition(all 150ms ease);

      &:hover {
        .box-shadow(0 5px 5px @shadow-color);
        .transition(all 250ms ease);
        .transform(translateY(-5px));
      }
    
      &:active {
        .box-shadow(0 9px 9px @shadow-color);
        .transition(all 30ms ease);
        .transform(translateY(-9px));
      }
    }
    
  }
}<commit_msg>CSS more material design<commit_after>.transition (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-transition: @value;
  -moz-transition: @value;
  -ms-transition: @value;
  -o-transition: @value;
  transition: @value;
}

.transform (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  transform:@value;
  -ms-transform:@value;
  -webkit-transform:@value;
  -o-transform:@value;
  -moz-transform:@value;
}

.border-box {
  box-sizing:border-box;
  -moz-box-sizing:border-box;
}

.box-shadow (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-box-shadow: @value;
  -moz-box-shadow: @value;
  -ms-box-shadow: @value;
  -o-box-shadow: @value;
  box-shadow: @value;
}

.border-radius (@value1,@value2:X,...) {
  @value: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
  -webkit-border-radius: @value;
  -moz-border-radius: @value;
  -ms-border-radius: @value;
  -o-border-radius: @value;
  border-radius: @value;
}



html,
body {
  font-family:Arial;
  font-size:14px;
  overflow-x:hidden;
  padding: 0;
  margin: 0;
  width: 100%;
  height:100%;
  
  @sidebar-width:250px;
  @sidebar-width-res:20px;
  @new-note-margin:20px;
  @shadow-color: #666666;
  @main-color: #d4ff2a;

  .sidebar {
    display:block;
    >div {
      position:absolute;
      z-index:2;
      top:0;
      width:@sidebar-width - 5px;
      .box-shadow(5px 5px 5px @shadow-color);
      height:100%;
      .border-box;
      .transition(-webkit-transform ease 250ms);
      .transition(transform ease 250ms);

      &.left {
        background: @main-color;
        left:(@sidebar-width - @sidebar-width-res)*-1;
      }
      &.visible.left {
        .transform(translateX(@sidebar-width - @sidebar-width-res));
      }
      
      >.menu-item {
        float:left;
	width:100%;
	margin:0;
	padding:10px 15px;
	border-bottom:solid 1px #555;
	cursor:pointer;
	.border-box;
	color: black;
        &:hover {
	  color: @shadow-color;
	}
        >span {
	  float:left;
	  color:inherit;
	}
      }
    }
  }

  .main {
    display:block;

    >div {
      position:absolute;
      padding-left: 10px;
      z-index:1;
      top:0;
      width: 100%;
      height:100%;
      .transition(-webkit-transform ease 250ms);
      .transition(transform ease 250ms);

      margin-left: @sidebar-width-res;

      &.shrunk {
        .transform(translateX(@sidebar-width - @sidebar-width-res));
	margin-right: @sidebar-width - @sidebar-width-res
      }

      header h1 {
        font-family: 'Helvetica Neue', Helvetica, sans-serif;
        font-size: 60px;
        font-weight: 100;
        margin: 0;
        padding: 0;
      }
    }
  }

  #new-note-btn {
    position: fixed;
    bottom: 0px;
    right: 0px;
    z-index: 1000;
    margin-bottom: @new-note-margin;
    margin-right: @new-note-margin+5px;

    #new-note-btn-img {
      .border-radius(24px);
      .box-shadow(3px 3px 3px @shadow-color);
      .transition(all 150ms ease);

      &:hover {
        .box-shadow(5px 5px 5px @shadow-color);
        .transition(all 250ms ease);
        .transform(translateY(-5px));
      }
    
      &:active {
        .box-shadow(9px 9px 9px @shadow-color);
        .transition(all 30ms ease);
        .transform(translateY(-9px));
      }
    }
    
  }
}
{'fraction_non_alphanumeric': 0.18959052047397632, 'fraction_numerical': 0.03389830508474576, 'mean_word_length': 2.334, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, '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': '4397792', 'n_tokens_mistral': 2715, 'n_tokens_neox': 2519, 'n_words': 403}