<template>
  <el-pagination
    v-bind="$attrs"
    :page-sizes="[20, 40, 80, 100]"
    background
    layout="total, sizes, prev, pager, next, jumper"
  />
</template>

<script lang="ts" setup></script>

<style lang="less">
  .el-pagination {
    --el-input-focus-border-color: #3f794f !important;
  }
  .el-pagination.is-background .btn-next.is-active,
  .el-pagination.is-background .btn-prev.is-active,
  .el-pagination.is-background .el-pager li.is-active {
    background-color: #3f794f;
  }
  .el-pagination.is-background {
    --el-input-focus-border: #3f794f;
  }

  .el-select .el-input.is-focus .el-input__wrapper {
    box-shadow: 0 0 0 1px #3f794f inset !important;
  }
  .el-input__wrapper.is-focus {
    --el-select-input-focus-border-color: #3f794f;
  }
  .el-select-dropdown__item.selected {
    color: #3f794f;
  }
</style>
