Portfolio Design CSS + Blur Effect
1. Astra Portfolio Plugin
. Custom CSS
.site-single.ast-col-md-4.iframe {
width: 33%;
overflow: hidden;
transition: 1s;
}
.site-single.ast-col-md-4.iframe:hover{
z-index: 2;
filter: blur(0px) !important;
transition: 4s;
}
.astra-portfolio-shortcode-wrap.astra-portfolio-grid.astra-portfolio.ast-row {
display: flex;
flex-basis: 33%;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: space-evenly;
transition: 4s;
}
.astra-portfolio-shortcode-wrap.astra-portfolio-grid.astra-portfolio.ast-row:hover .site-single.ast-col-md-4.iframe{
filter: blur(5px);
transition: 4s;
}
.astra-portfolio-wrap .site-single .inner, .et_divi_builder #astra-portfolio .site-single .inner {
display: inline-block;
width: 100%;
border-radius: 10px;
background: #e8b21e;
transition: 4s;
}
.template-meta {
border-radius: 10px;
color: #3841d5;
font-family:tahoma;
letter-spacing: 1px;
font-size: 20px;
border-bottom: 6px solid #e8b21e;
}
.astra-portfolio-wrap .site-single .inner, .et_divi_builder #astra-portfolio .site-single .inner:hover .template-meta{
border-bottom: 6px solid #000;
}
.site-single.ast-col-md-4.iframe {
transition: 0.3s;
}
.site-single.ast-col-md-4.iframe:hover {
}
এখানে ব্লগ লেখার উদ্দেশ্য হলো, যেন আমাদের কাজ কে আরো দ্রুত ভাবে করতে পারি ।
ReplyDeletevai ami jodi ei code ta copy kore amar orotfolio te ccs a giya paste kori tahle eita ki kaj korbe?
ReplyDeleteapni portfolio er opor click kore custom css a giye paste korben
DeleteHa amio etai bolchilam ok vaiya thank you
Delete