diff options
author | Anatasof Wirapraja <anata@darapsa.co.id> | 2021-07-21 14:39:03 +0700 |
---|---|---|
committer | Anatasof Wirapraja <anata@darapsa.co.id> | 2021-07-21 14:39:03 +0700 |
commit | 81e7d76d215bcd4c56808e467516fc045812d4d2 (patch) | |
tree | 3051afe82f636c7a40eae0b81ad18a22ad55a0fd | |
parent | f5b68454fbbf5cbe5889a7591641d417b2c450b1 (diff) |
add card css
-rw-r--r-- | html/css/product.css | 139 |
1 files changed, 138 insertions, 1 deletions
diff --git a/html/css/product.css b/html/css/product.css index fbd709c..a4fb555 100644 --- a/html/css/product.css +++ b/html/css/product.css @@ -132,4 +132,141 @@ .cart-remove { color: #495057; font-size: .7875rem -}
\ No newline at end of file +} + + +/* +* Card +*/ +.card { + position: relative; + display: flex; + flex-direction: column; + min-width: 0; + word-wrap: break-word; + background-color: #fff; + background-clip: border-box; + border: 0 solid rgba(17, 17, 17, .125); +} +.card>hr { + margin-right: 0; + margin-left: 0; +} +.card-body { + flex: 1 1 auto; + min-height: 1px; + padding: 1.5rem; +} +.card-title { + margin-bottom: .75rem; +} +.card-subtitle { + margin-top: -.375rem; + margin-bottom: 0; +} +.card-text:last-child { + margin-bottom: 0; +} +.card-link:hover { + text-decoration: none; +} +.card-link+.card-link { + margin-left: 1.5rem; +} +.card-header { + padding: .75rem 1.5rem; + margin-bottom: 0; + background-color: rgba(17, 17, 17, .03); + border-bottom: 0 solid rgba(17, 17, 17, .125); +} +.card-header+.list-group .list-group-item:first-child { + border-top: 0; +} +.card-footer { + padding: .75rem 1.5rem; + background-color: rgba(17, 17, 17, .03); + border-top: 0 solid rgba(17, 17, 17, .125); +} +.card-header-tabs { + margin-right: -.75rem; + margin-bottom: -.75rem; + margin-left: -.75rem; + border-bottom: 0; +} +.card-header-pills { + margin-right: -.75rem; + margin-left: -.75rem; +} +.card-img-overlay { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + padding: 1.5rem; +} +.card-img, .card-img-bottom, .card-img-top { + flex-shrink: 0; + width: 100%} +.card-deck .card { + margin-bottom: 1rem; +} +@media (min-width:576px) { + .card-deck { + display: flex; + flex-flow: row wrap; + margin-right: -1rem; + margin-left: -1rem; +} +.card-deck .card { + flex: 1 0 0%; + margin-right: 1rem; + margin-bottom: 0; + margin-left: 1rem; +} +} +.card-group>.card { + margin-bottom: 1rem; +} +@media (min-width:576px) { + .card-group { + display: flex; + flex-flow: row wrap; +} +.card-group>.card { + flex: 1 0 0%; + margin-bottom: 0; +} +.card-group>.card+.card { + margin-left: 0; + border-left: 0; +} +} +.card-columns .card { + margin-bottom: .75rem; +} +@media (min-width:576px) { + .card-columns { + -moz-column-count: 3; + column-count: 3; + -moz-column-gap: 1.25rem; + column-gap: 1.25rem; + orphans: 1; + widows: 1; +} +.card-columns .card { + display: inline-block; + width: 100%} +} +.accordion>.card { + overflow: hidden; +} +.accordion>.card:not(:last-of-type) { + border-bottom: 0; +} +.accordion>.card>.card-header { + margin-bottom: 0; +} +/* +* End Card +*/
\ No newline at end of file |