p006/api/jquery/plugins/an-skill-bar/docs/styles/an-skill-bar.css

11 lines
3.0 KiB
CSS
Executable File

/*
* Plugin : an-skill-bar
* Version: 1.0.1
* Description: A plugin that fills bars with a percentage you set.
* Author: Hasan Misbah
* Copyright 2018, Hasan Misbah
* Free to use and abuse under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/.skillbar{width:100%;padding:10px;margin:10px 0;position:relative;display:block;overflow:hidden;height:30px;background-color:#fff;border-radius:5px 0 0 5px}.skillbar.html .title{background-color:#c96300}.skillbar.html .filled{background-color:#ff8817}.skillbar.css .title{background-color:#0f5487}.skillbar.css .filled{background-color:#177fcb}.skillbar.js .title{background-color:#f0b109}.skillbar.js .filled{background-color:#f8ca4d}.skillbar.php .title{background-color:#3d4670}.skillbar.php .filled{background-color:#5864a2}.skillbar.jquery .title{background-color:#064a7a}.skillbar.jquery .filled{background-color:#0977c3}.skillbar.sass .title{background-color:#ba437d}.skillbar.sass .filled{background-color:#cf7aa4}.skillbar.less .title{background-color:#1f3861}.skillbar.less .filled{background-color:#31599b}.skillbar.react .title{background-color:#33c7f0}.skillbar.react .filled{background-color:#7adbf5}.skillbar.nodejs .title{background-color:#5e8f35}.skillbar.nodejs .filled{background-color:#83bf51}.skillbar.angular .title{background-color:#8f0023}.skillbar.angular .filled{background-color:#dc0035}.skillbar.vue .title{background-color:#2f8f67}.skillbar.vue .filled{background-color:#47c390}.skillbar.meteor .title{background-color:#cc2b2c}.skillbar.meteor .filled{background-color:#de6566}.skillbar.backbone .title{background-color:#005086}.skillbar.backbone .filled{background-color:#007dd3}.skillbar.ember .title{background-color:#c63d2d}.skillbar.ember .filled{background-color:#dc7064}.skillbar.mysql .title{background-color:#003e58}.skillbar.mysql .filled{background-color:#0073a5}.skillbar.python .title{background-color:#295479}.skillbar.python .filled{background-color:#3d7cb2}.skillbar.django .title{background-color:#010705}.skillbar.django .filled{background-color:#0e4731}.skillbar.agile .title{background-color:#198cb7}.skillbar.agile .filled{background-color:#37b6e4}.skillbar.photoshop .title{background-color:#211a56}.skillbar.photoshop .filled{background-color:#382c90}.skillbar.illustrator .title{background-color:#572e11}.skillbar.illustrator .filled{background-color:#98511d}.skillbar.indesign .title{background-color:#a42b69}.skillbar.indesign .filled{background-color:#d04c8f}.skillbar.laravel .title{background-color:#f0280f}.skillbar.laravel .filled{background-color:#f56856}.skillbar .title{background-color:rgba(0,0,0,.6);height:30px;width:85px;text-align:center;left:0;color:#f0f0f0;border-radius:5px 0 0 5px}.skillbar .percent,.skillbar .title{padding:5px;position:absolute;top:0;z-index:9}.skillbar .percent{right:0;color:#000;font-weight:700}.skillbar .filled{z-index:8;position:absolute;top:0;left:0;background-color:rgba(0,80,80,.3);height:100%;width:20px;border-radius:5px 0 0 5px}
/*# sourceMappingURL=an-skill-bar.css.map */