PluginProbe
Smart Post – Post Grid, Post Carousel, Post Slider Gutenberg Blocks for Blog & News / 4.0.7
Smart Post – Post Grid, Post Carousel, Post Slider Gutenberg Blocks for Blog & News v4.0.7
4.0.8 4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 4.0.2 4.0.1 2.3.5 2.3.6 2.4.0 2.4.1 2.4.10 2.4.11 2.4.12 2.4.13 2.4.14 2.4.15 2.4.16 2.4.17 2.4.18 2.4.19 2.4.2 2.4.20 2.4.21 All 88 releases
post-carousel / src / blocks / smart-list / style.scss

style.scss in Smart Post – Post Grid, Post Carousel, Post Slider Gutenberg Blocks for Blog & News 4.0.7, at src/blocks/smart-list/style.scss

156 lines 4.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .sp-smart-post-list-svg-icon{
2 fill: none !important;
3 }
4
5 .sp-smart-post-smart-list-wrapper {
6
7 counter-increment: list-counter;
8 position: relative;
9
10 .sp-smart-post-list-link {
11 color: inherit;
12 text-decoration: none;
13 font-weight: normal;
14 outline: none;
15 cursor: pointer;
16 border-width: none;
17 display: flex;
18 align-items: center;
19 transition: all 0.3s ease;
20
21 display: flex;
22 order: 0;
23 &.editor-selector-hover:hover {
24 box-shadow: inset 0 0 0 1px #037fff;
25 }
26
27 .sp-smart-post-list-icon-container {
28 display: flex;
29 align-items: center;
30 justify-content: center;
31 overflow: hidden;
32
33 .sp-smart-post-list-icon-svg {
34
35 .sp-smart-post-list-icon,
36 .sp-smart-post-list-icon-img {
37 display: flex;
38 align-items: center;
39 justify-content: center;
40 }
41 &::before{
42 display: flex;
43 align-items: center;
44 justify-content: center;
45 }
46 }
47
48 .sp-smart-post-list-icon-img {
49 overflow: hidden;
50 display: flex;
51 position: relative;
52 img {
53 max-width: 100%;
54 display: block;
55 }
56
57 .sp-smart-post-list-overlay {
58 position: absolute;
59 top: 0;
60 left: 0;
61 height: 100%;
62 width: 100%;
63 mix-blend-mode: color;
64 opacity: 1;
65
66 }
67 }
68 }
69
70 .sp-smart-post-list-text {
71 display: flex;
72 flex-direction: column;
73 order: 0;
74 // padding-right: 8px;
75 flex-grow: 1;
76
77 .sp-smart-post-list-title-wrapper{
78 display: flex;
79 gap: 6px;
80
81 .sp-smart-post-list-title {
82 &.editor-selector-hover:hover{
83 box-shadow: inset 0 0 0 1px #037fff;
84 }
85 color: inherit;
86 font-family: Roboto;
87 font-size: 16px;
88 font-style: normal;
89 font-weight: 400;
90 line-height: 16px;
91 cursor: text;
92 margin: 0;
93 }
94 }
95
96 .sp-smart-post-list-description {
97 &.editor-selector-hover:hover{
98 box-shadow: inset 0 0 0 1px #037fff;
99 }
100 cursor: text;
101 margin: 0;
102 }
103 }
104 .sp-smart-post-list-badge {
105
106 display: inline-block;
107 &.editor-selector-hover:hover{
108 box-shadow: inset 0 0 0 1px #037fff;
109 }
110 }
111 }
112
113 }
114
115
116
117 .sp-smart-post-smart-list-front-end {
118 .sp-smart-post-smart-list-wrapper{
119 .sp-smart-post-list-link {
120 .sp-smart-post-list-text {
121 .sp-smart-post-list-title-wrapper {
122 .sp-smart-post-list-title {
123 cursor: pointer;
124 }
125 }
126 .sp-smart-post-list-description{
127 cursor: pointer;
128 }
129 }
130 }
131 }
132 }
133
134 .sp-smart-post-smart-lists-wrapper {
135 &.layout-one,
136 &.layout-two {
137 .sp-smart-post-list-link {
138 background: transparent;
139 }
140 }
141 &.layout-four,
142 &.layout-five {
143 .sp-smart-post-list-link {
144 background: #F2F2F2;
145 }
146 }
147 }
148
149
150
151
152
153
154
155
156