Skip to content

Instantly share code, notes, and snippets.

@sergiu-radu

sergiu-radu/Icon Box position absolute issue

Created June 2, 2023 09:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sergiu-radu/7dcdadd10687a74516696ec83939c4fb to your computer and use it in GitHub Desktop.
Save sergiu-radu/7dcdadd10687a74516696ec83939c4fb to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Icon Box position absolute issue
<!-- wp:greenshift-blocks/row {"id":"gsbp-bd418b2d-d7f3","gutterClassName":"gspb_row\u002d\u002dgutter-60","rowLayout":"2","displayStyles":false,"spacing":{"margin":{"values":{"top":[120],"bottom":[120]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{"top":[null],"bottom":[null]},"unit":["px","px","px","px"],"locked":false}},"gutterGap":["100px",null,null,null],"rowGap":["",null,null,null],"customWrap":["nowrap",null,null,null]} -->
<div id="gspb_row-id-gsbp-bd418b2d-d7f3" class="gspb_row gspb_row-id-gsbp-bd418b2d-d7f3 wp-block-greenshift-blocks-row gspb_row-id-gsbp-bd418b2d-d7f3 gspb_row--gutter-60"><div class="gspb_row__content"> <!-- wp:greenshift-blocks/row-column {"id":"gsbp-f0f7d072-8d3c","enableExtendedWidth":false,"width":[null],"gutterclass":"gspb_row\u002d\u002dgutter-60","gutterGap":["100px",null,null,null],"flexbox":{"type":"flexbox","flexDirection":["column"],"justifyContent":["center"]},"columnSize":"6","spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{"top":[0],"right":[0],"bottom":[0],"left":[0]},"unit":["px","px","px","px"],"locked":true}},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]},"widthType":"custom"}} -->
<div id="gspb_col-id-gsbp-f0f7d072-8d3c" class="gspb_row__col--6 wp-block-greenshift-blocks-row-column gspb_col-id-gsbp-f0f7d072-8d3c"><!-- wp:greenshift-blocks/heading {"id":"gsbp-ad7c509d-af80","headingTag":"h5","headingContent":"BEST INTERIORS","spacing":{"margin":{"values":{"top":[0],"bottom":[30]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"typography":{"textShadow":{},"size":["18px"],"transform":"uppercase","customweight":"custom","customweightnumber":600,"color":"var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dpalette-color-2, var(\u002d\u002dpaletteColor2, #053631))"},"headingSeparator":false,"headingSepSpacing":{"margin":{"values":{"right":[15]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"spacingBlock":{"margin":{"values":{"bottom":[30]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"headingSepWidth":[30,null,null,null],"headingSepColor":"var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dpalette-color-2, var(\u002d\u002dpaletteColor2, #053631))","headingSepStroke":2,"headingSepVJustify":"center","enablehighlight":false} -->
<h5 id="gspb_heading-id-gsbp-ad7c509d-af80" class="gspb_heading gspb_heading-id-gsbp-ad7c509d-af80 ">BEST INTERIORS</h5>
<!-- /wp:greenshift-blocks/heading -->
<!-- wp:greenshift-blocks/heading {"id":"gsbp-1bfb76e8-1ca9","headingContent":"Find Your Own Price Of Paradise","spacing":{"margin":{"values":{"bottom":[40],"top":[0]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"typography":{"textShadow":{},"size":["50px"],"customweight":null,"line_height":[null]},"enablesubTitle":false,"subTitleOutside":false} -->
<h2 id="gspb_heading-id-gsbp-1bfb76e8-1ca9" class="gspb_heading gspb_heading-id-gsbp-1bfb76e8-1ca9 ">Find Your Own Price Of Paradise</h2>
<!-- /wp:greenshift-blocks/heading -->
<!-- wp:greenshift-blocks/text {"id":"gsbp-a28a5e78-0820","textContent":"Dicta illum fugiat quaerat enim ratione quibusdam eius. Voluptates amet fugiat consectetur rerum magnam veritatis. Accusantium ut hic quidem voluptas. Ut itaque dolores amet et velit maiores odit ea non odio rerum voluptas velit.","spacing":{"margin":{"values":{"bottom":[50]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}},"typography":{"textShadow":{},"size":["18px"]}} -->
<div id="gspb_text-id-gsbp-a28a5e78-0820" class="gspb_text gspb_text-id-gsbp-a28a5e78-0820 ">Dicta illum fugiat quaerat enim ratione quibusdam eius. Voluptates amet fugiat consectetur rerum magnam veritatis. Accusantium ut hic quidem voluptas. Ut itaque dolores amet et velit maiores odit ea non odio rerum voluptas velit.</div>
<!-- /wp:greenshift-blocks/text -->
<!-- wp:greenshift-blocks/button {"id":"gsbp-04900e47-2ebd","buttonContent":"Explore","spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{"top":[12],"right":[40],"bottom":[12],"left":[40]},"unit":["px","px","px","px"],"locked":false}},"typography":{"textShadow":{},"size":["18px"]}} -->
<div id="gspb_button-id-gsbp-04900e47-2ebd" class="gspb_button_wrapper gspb_button-id-gsbp-04900e47-2ebd wp-block-greenshift-blocks-button"><a class="gspb-buttonbox" rel="noopener"><span class="gspb-buttonbox-textwrap"><span class="gspb-buttonbox-text"><span class="gspb-buttonbox-title">Explore</span></span></span></a></div>
<!-- /wp:greenshift-blocks/button --></div>
<!-- /wp:greenshift-blocks/row-column -->
<!-- wp:greenshift-blocks/row-column {"id":"gsbp-af409f98-75c4","enableExtendedWidth":false,"width":[null],"gutterclass":"gspb_row\u002d\u002dgutter-60","gutterGap":["100px",null,null,null],"flexbox":{"enable":false,"marginUnit":["px","px","px","px"],"marginLock":false,"marginTop":[null,null,null,null],"marginBottom":[null,null,null,null],"marginLeft":[null,null,null,null],"marginRight":[null,null,null,null],"type":"flexbox","flexDirection":["row"],"alignItems":["center"],"justifyContent":["center"]},"columnSize":"6","spacing":{"margin":{"values":{},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{"top":[0],"right":[0],"bottom":[0],"left":[0]},"unit":["px","px","px","px"],"locked":true}},"blockWidth":{"customWidth":{"value":[],"unit":["px","px","px","px"]},"customHeight":{"value":[],"unit":["px","px","px","px"]},"widthType":"custom"}} -->
<div id="gspb_col-id-gsbp-af409f98-75c4" class="gspb_row__col--6 wp-block-greenshift-blocks-row-column gspb_col-id-gsbp-af409f98-75c4"><!-- wp:greenshift-blocks/iconbox {"id":"gsbp-b17db224-264a","type":"regular","spacing":{"margin":{"values":{"top":[0],"right":[0],"bottom":[0],"left":[0]},"unit":["px","px","px","px"],"locked":true},"padding":{"values":{"top":[0],"right":[0],"bottom":[0],"left":[0]},"unit":["px","px","px","px"],"locked":true}},"containerLink":"#","background":{"color":"var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dpalette-color-4, var(\u002d\u002dpaletteColor4, #011412))"},"iconBox_icon":{"icon":{"font":"rhicon rhi-play","svg":"\u003csvg xmlns=\u0022http://www.w3.org/2000/svg\u0022 xml:space=\u0022preserve\u0022 style=\u0022enable-background:new 0 0 40 40\u0022 viewBox=\u00220 0 40 40\u0022\u003e\u003cpath d=\u0022M20 0C9 0 0 9 0 20s9 20 20 20 20-9 20-20S31 0 20 0zm6.8 20.3c0 .1-.1.1-.2.2l-10.5 6.4c-.3.2-.6.1-.8-.2-.1-.1-.1-.2-.1-.3V13.6c0-.3.2-.5.5-.5.1 0 .2 0 .3.1l10.5 6.4c.4.1.5.4.3.7z\u0022/\u003e\u003c/svg\u003e","image":""},"fill":"var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dpalette-color-8, var(\u002d\u002dpaletteColor8, #ffffff))","fillhover":"var(\u002d\u002dwp\u002d\u002dpreset\u002d\u002dcolor\u002d\u002dpalette-color-8, var(\u002d\u002dpaletteColor8, #ffffff))","type":"svg","iconSize":["70px"]},"position":{"positionType":["absolute","","",""],"positions":{"values":{}},"Zindex":1}} -->
<div id="gspb_iconBox-id-gsbp-b17db224-264a" class="gspb_iconBox gspb_iconBox-id-gsbp-b17db224-264a wp-block-greenshift-blocks-iconbox"><a class="gspb-containerlink" href="#" rel="noopener"><div class="gspb_iconBox__wrapper" style="display:inline-flex"><svg xmlns="http://www.w3.org/2000/svg" style="width:5rem;height:5rem;margin:10px" xml:space="preserve" viewBox="0 0 40 40"><path d="M20 0C9 0 0 9 0 20s9 20 20 20 20-9 20-20S31 0 20 0zm6.8 20.3c0 .1-.1.1-.2.2l-10.5 6.4c-.3.2-.6.1-.8-.2-.1-.1-.1-.2-.1-.3V13.6c0-.3.2-.5.5-.5.1 0 .2 0 .3.1l10.5 6.4c.4.1.5.4.3.7z"></path></svg></div></a></div>
<!-- /wp:greenshift-blocks/iconbox -->
<!-- wp:greenshift-blocks/image {"id":"gsbp-848d4e03-bdae","originalWidth":975,"originalHeight":1125,"mediaurl":"https://demo.creativethemes.com/blocksy/real-estate/wp-content/uploads/2023/05/home-page-video-cover.webp","mediaid":206,"alt":""} -->
<div id="gspb_image-id-gsbp-848d4e03-bdae" class="gspb_image gspb_image-id-gsbp-848d4e03-bdae wp-block-greenshift-blocks-image"><img src="https://demo.creativethemes.com/blocksy/real-estate/wp-content/uploads/2023/05/home-page-video-cover.webp" data-src="" alt="" width="975" height="1125"/></div>
<!-- /wp:greenshift-blocks/image --></div>
<!-- /wp:greenshift-blocks/row-column --> </div></div>
<!-- /wp:greenshift-blocks/row -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment