PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.5.0
Easy Elements for Elementor – Addons & Website Templates v1.5.0
1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.6 1.4.7 1.4.8 1.4.5 1.4.4 1.4.3 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.7 1.3.8 1.3.9 1.4.0 All 47 releases
easy-elements / widgets / heading / css / heading.scss

heading.scss in Easy Elements for Elementor – Addons & Website Templates 1.5.0, at widgets/heading/css/heading.scss

202 lines 4.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root {
2 --e-global-color-primary: #FFD012;
3 --e-global-color-secondary: #0B3665;
4 --body-color: #121212bf;
5 }
6
7 .e-e-title {
8 color: var(--e-global-color-secondary);
9 margin: 0;
10 }
11
12 .e-e-title a {
13 color: currentColor;
14 }
15
16 .e-e-title span {
17 color: var(--e-global-color-primary);
18 display: inline-block;
19 }
20
21 .e-e-description {
22 color: var(--body-color);
23 font-size: 20px;
24 line-height: 150%;
25 }
26
27 .eel-sub-heading {
28 img,
29 svg {
30 height: 1em;
31 width: auto;
32 }
33 &.top {
34 display: inline-block ;
35 span {
36 display: block;
37 }
38 }
39 &.left,
40 &.right {
41 display: inline-flex !important;
42 align-items: center;
43 gap: 8px;
44 }
45 &.right {
46 flex-direction: row-reverse;
47 }
48 }
49
50 .eel--separator-icon-wrap {
51 svg {
52 height: 1em;
53 }
54 }
55
56 .eel--separator-icon {
57 height: 4px;
58 width: 50px;
59 background: var(--e-global-color-primary);
60 border-radius: 2px;
61 position: relative;
62 margin: 0 auto;
63 display: inline-block;
64
65 &.dotted {
66 &::before {
67 content: "";
68 position: absolute;
69 top: 0;
70 right: -10px;
71 display: inline-block;
72 width: 4px;
73 height: 4px;
74 border-radius: 50%;
75 background-color: var(--e-global-color-primary);
76 color: var(--e-global-color-primary);
77 box-shadow: 9px 0 0 currentColor, 18px 0 0 currentColor;
78 }
79 }
80 }
81
82 .eel_full_title_start,
83 .eel_title_start .e-e-title {
84 border-left: 6px solid var(--e-global-color-primary);
85 display: inline-table;
86 padding-left: 10px;
87 width: 100%;
88 }
89
90 .eel_full_title_end,
91 .eel_title_end .e-e-title {
92 border-right: 6px solid var(--e-global-color-primary);
93 display: inline-table;
94 padding-right: 10px;
95 width: 100%;
96 }
97
98 .e-e-heading.has-watermark {
99 position: relative;
100 z-index: 1;
101 }
102
103 .eel-watermark {
104 position: absolute;
105 bottom: 10px;
106 left: 10px;
107 font-size: 120px;
108 font-weight: bold;
109 color: transparent;
110 -webkit-text-stroke: 1px rgba(0, 0, 0, 0.3);
111 text-stroke: 1px rgba(0, 0, 0, 0.3);
112 pointer-events: none;
113 -webkit-user-select: none;
114 -moz-user-select: none;
115 user-select: none;
116 white-space: nowrap;
117 z-index: 0;
118 transform: translateY(-50%);
119 line-height: 60%;
120 }
121
122 .eel-sub-heading.easy_gradiant_border {
123 display: inline-block;
124 }
125
126 .easy_gradiant_border {
127 position: relative;
128 padding: 4px 18px;
129 }
130
131
132 .easy_gradiant_border::before {
133 content: '';
134 position: absolute;
135 inset: 0;
136 padding: 1px;
137 background: linear-gradient(to right,
138 var(--grad-color-1, rgba(0, 0, 0, 0.15)) 15%,
139 var(--grad-color-2, rgba(0, 0, 0, 0.30)) 30%,
140 var(--grad-color-3, rgba(0, 0, 0, 0.50)) 50%,
141 var(--grad-color-2, rgba(0, 0, 0, 0.30)) 70%,
142 var(--grad-color-1, rgba(0, 0, 0, 0.15)) 85%);
143 -webkit-mask:
144 linear-gradient(#fff 0 0) content-box,
145 linear-gradient(#fff 0 0);
146 -webkit-mask-composite: xor;
147 mask-composite: exclude;
148 pointer-events: none;
149 z-index: -1;
150 border-radius: var(--grad-border-radius, 40px);
151 opacity: .5;
152 }
153
154 .easy-split-word,
155 .easy-split-letter {
156 font-style: normal;
157 }
158
159
160 .e-e-title {
161 &.e-e-gradient-title div,
162 &.e-e-gradient-title {
163 background: linear-gradient(68.75deg, #B0FF96 9.78%, #FFF1B5 92.67%);
164 -webkit-background-clip: text;
165 -webkit-text-fill-color: transparent;
166 background-clip: text;
167 text-fill-color: transparent;
168 line-height: 1.1;
169 }
170 }
171
172 .e-e-title.eel-text-reveal{
173 overflow: hidden;
174 display: inline-block;
175 .char {
176 transform: translateY(115px);
177 transition: transform .5s;
178 overflow: hidden;
179 }
180 }
181 .eel-lines-bottom-v2{
182 overflow: hidden;
183 }
184
185 .eel-text-bouncev2 {
186 display: inline-block;
187 transform-origin: 50% 100%;
188 will-change: transform, opacity;
189 }
190
191
192 .e-e-heading .e-e-title.e-e-image-fill div,
193 .e-e-heading .e-e-title.e-e-image-fill {
194 color: transparent;
195 -webkit-background-clip: text;
196 background-clip: text;
197 -webkit-text-fill-color: transparent;
198 background-repeat: no-repeat;
199 background-position: center;
200 background-size: cover;
201 }
202