Skip to content

Jeff Balicki / imagination_library

Go to a project
Toggle navigation
Toggle navigation pinning
2a34d6bf by Jeff Balicki
Options

cal out 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 1253305b
Inline Side-by-side
Showing 7 changed files with 141 additions and 1 deletions
...@@ -14985,9 +14985,84 @@ a[target=_blank]::after { ...@@ -14985,9 +14985,84 @@ a[target=_blank]::after {
14985 width: 100%; 14985 width: 100%;
14986 } 14986 }
14987 14987
14988 .join-callout {
14989 background-color: #a3d55f;
14990 margin: 0px -25% 0px -25%;
14991 padding: 0px 25%;
14992 }
14993 @media screen and (max-width: 900px) {
14994 .join-callout {
14995 margin: 0px -20% 0px -20%;
14996 padding: 0px 20%;
14997 }
14998 }
14999 @media screen and (max-width: 600px) {
15000 .join-callout {
15001 margin: 0px -30px 0px -30px;
15002 padding: 0px 30px;
15003 }
15004 }
15005 .join-callout .wp-block-group__inner-container {
15006 margin-top: -120px;
15007 }
15008 @media screen and (max-width: 900px) {
15009 .join-callout .wp-block-group__inner-container {
15010 margin-top: -75px;
15011 }
15012 }
15013 @media screen and (max-width: 600px) {
15014 .join-callout .wp-block-group__inner-container {
15015 margin-top: -40px;
15016 }
15017 }
15018 .join-callout .wp-block-group__inner-container .wp-block-column {
15019 display: flex;
15020 }
15021 .join-callout .wp-block-group__inner-container .wp-block-image {
15022 margin-bottom: 0px;
15023 }
15024 .join-callout .wp-block-group__inner-container .wp-block-image img {
15025 margin-bottom: 0px;
15026 position: relative;
15027 z-index: 2;
15028 }
15029
15030 .join-callout::before {
15031 position: relative;
15032 z-index: 1;
15033 top: -120px;
15034 content: "";
15035 display: block;
15036 width: 150%;
15037 height: 120px;
15038 margin: 0 -25%;
15039 background-position: top left;
15040 background-size: cover;
15041 background-repeat: no-repeat;
15042 background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1369.39 118.32"><defs><style> .cls-1 { fill: %23a3d55f; stroke-width: 0px; } </style></defs><path id="Subtraction_3" data-name="Subtraction 3" class="cls-1" d="M1369.39,118.28L0,118.32C0,57.99,0,60.48,0,59.76l1.78-1.57c9.81-7.27,20.38-13.46,31.52-18.46,12.26-5.54,24.88-10.24,37.78-14.05,23.89-7.2,51.85-13.01,83.11-17.27C193.3,3.23,232.69.53,272.13.35c1.34,0,2.55,0,3.61.02h.06c9.46-.24,19.03-.36,28.43-.36,14.1,0,28.39.28,42.48.82,13.43.52,27.11,1.3,40.67,2.32,25.04,1.88,50.2,4.59,76.92,8.27,50.22,6.92,97.44,16.16,143.1,25.1h0l1.67.33h0c45.52,8.91,92.59,18.12,141.28,24.89,26.2,3.65,50.81,6.32,75.22,8.18,27.39,2.09,53.84,3.1,80.87,3.1,21.49,0,43.44-.67,65.24-2,82.01-5,158.29-7.53,226.7-7.53,26.88,0,52.6.4,76.43,1.18,19.07.62,36.99,1.5,53.25,2.59,27.46,1.85,40.14,3.6,40.69,3.68l.61,47.35Z"/></svg>');
15043 }
15044 @media screen and (max-width: 900px) {
15045 .join-callout::before {
15046 margin: 0px -20% 0px -20%;
15047 padding: 0px 20%;
15048 width: 140%;
15049 top: -75px;
15050 height: 75px;
15051 }
15052 }
15053 @media screen and (max-width: 600px) {
15054 .join-callout::before {
15055 top: -50px;
15056 height: 50px;
15057 width: calc(100% + 60px);
15058 margin: 0 -30px !important;
15059 }
15060 }
15061
14988 .nav-container { 15062 .nav-container {
14989 position: sticky; 15063 position: sticky;
14990 top: 0; 15064 top: 0;
15065 z-index: 999;
14991 } 15066 }
14992 15067
14993 .admin-bar .nav-container { 15068 .admin-bar .nav-container {
......
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
1 module.exports = { 1 module.exports = {
2 "proxy": "localhost/", 2 "proxy": "dpil.tes/",
3 "notify": false, 3 "notify": false,
4 "files": ["./css/*.min.css", "./js/*.min.js", "./**/*.php"] 4 "files": ["./css/*.min.css", "./js/*.min.js", "./**/*.php"]
5 }; 5 };
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -18,4 +18,68 @@ ...@@ -18,4 +18,68 @@
18 .container{ 18 .container{
19 width: 100%; 19 width: 100%;
20 } 20 }
21 }
22 .join-callout{
23 background-color: #a3d55f;
24 margin: 0px -25% 0px -25%;
25 padding: 0px 25%;
26 @media screen and (max-width: 900px) {
27 margin: 0px -20% 0px -20%;
28 padding: 0px 20%;
29 }
30 @media screen and (max-width: 600px) {
31 margin: 0px -30px 0px -30px;
32 padding: 0px 30px;
33 }
34
35 .wp-block-group__inner-container {
36 margin-top: -120px;
37 @media screen and (max-width: 900px) {
38 margin-top: -75px;
39 }
40 @media screen and (max-width: 600px) {
41 margin-top:-40px;
42 }
43
44 .wp-block-column{
45 display: flex;
46 }
47 .wp-block-image {
48 margin-bottom: 0px;
49 img{
50 margin-bottom: 0px;
51 position: relative;
52 z-index: 2;
53 }
54 }
55 }
56 }
57
58 .join-callout::before{
59 position: relative;
60 z-index: 1;
61 top: -120px;
62 content: "";
63 display: block;
64 width: 150%;
65 height: 120px;
66 margin: 0 -25%;
67 background-position: top left;
68 background-size: cover;
69 background-repeat: no-repeat;
70 background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1369.39 118.32"><defs><style> .cls-1 { fill: %23a3d55f; stroke-width: 0px; } </style></defs><path id="Subtraction_3" data-name="Subtraction 3" class="cls-1" d="M1369.39,118.28L0,118.32C0,57.99,0,60.48,0,59.76l1.78-1.57c9.81-7.27,20.38-13.46,31.52-18.46,12.26-5.54,24.88-10.24,37.78-14.05,23.89-7.2,51.85-13.01,83.11-17.27C193.3,3.23,232.69.53,272.13.35c1.34,0,2.55,0,3.61.02h.06c9.46-.24,19.03-.36,28.43-.36,14.1,0,28.39.28,42.48.82,13.43.52,27.11,1.3,40.67,2.32,25.04,1.88,50.2,4.59,76.92,8.27,50.22,6.92,97.44,16.16,143.1,25.1h0l1.67.33h0c45.52,8.91,92.59,18.12,141.28,24.89,26.2,3.65,50.81,6.32,75.22,8.18,27.39,2.09,53.84,3.1,80.87,3.1,21.49,0,43.44-.67,65.24-2,82.01-5,158.29-7.53,226.7-7.53,26.88,0,52.6.4,76.43,1.18,19.07.62,36.99,1.5,53.25,2.59,27.46,1.85,40.14,3.6,40.69,3.68l.61,47.35Z"/></svg>');
71 @media screen and (max-width: 900px) {
72 margin: 0px -20% 0px -20%;
73 padding: 0px 20%;
74 width: 140%;
75 top: -75px;
76 height: 75px;
77 }
78 @media screen and (max-width: 600px) {
79 top: -50px;
80 height: 50px;
81 width: calc(100% + 60px);
82 margin: 0 -30px !important;
83 }
84
21 } 85 }
...\ No newline at end of file ...\ No newline at end of file
......
1 .nav-container{ 1 .nav-container{
2 position: sticky; 2 position: sticky;
3 top: 0; 3 top: 0;
4 z-index: 999;
4 } 5 }
5 .admin-bar .nav-container{ 6 .admin-bar .nav-container{
6 top: 32px; 7 top: 32px;
......