Basic Partial Bootstrap Theme

Theme.css

:root {
    --accentColor : #6562B7;
    --accentHighlightColor : #6562B7;
    --textColor : #6562B7;
    --accentOpaqueColor : rgba(0, 73, 144, 0.15);
}

.shadow-primary {
    box-shadow: 0 7px 40px rgba(0, 73, 144, 0.15);
}

body {
    font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;
    color: #606266;
    background-color: rgb(251, 251, 251);
    width: 100%;
}

.bg-primary {
    background-color: var(--accentColor) !important;
}

.text-primary {
    color: var(--textColor) !important;
}

.navbar-dark .navbar-toggler {
    border-color: transparent !important;
}

.navbar {
    padding: 1rem 1rem;
}

.quick-actions-menu .quick-action {
    padding: 10px 0px;
    width: 100%;
    display: block;
    color: var(--accentColor);
}

.quick-action > i {
    padding: 0px 10px;
}

.tag-margin  {
    margin-top : 20px;
}

.card {
    border: 0px solid transparent;
    border-radius : 7px;
    overflow: hidden;
}

span.tag {
    padding : 5px 15px;
    color : #FFF;
    border-radius : 5px;
    font-size : 14px;
    font-weight : bold;
}

span.float-on-card  {
    float : right;
    margin-top : -35px
}

a {
    color: var(--accentColor);
    text-decoration: none !important;
}

.btn-primary {
    color: #fff;
    background-color: var(--accentColor);
    border-color: var(--accentColor);
}

.btn-primary:hover {
    color: #fff;
    background-color:  var(--accentHighlightColor);
    border-color:  var(--accentHighlightColor);
    opacity: 0.8;
}


.form-control:focus {
    border-color: var(--accentHighlightColor) !important;
    box-shadow: none; 
}

.color-card {
    padding: 20px;
}