Skip to content

Tenzing / Tenzing-Web-2023

Go to a project
Toggle navigation
Toggle navigation pinning
85045dfc by Jeff Balicki
Options

ssss 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 80af029d
Expand all
Inline Side-by-side
Showing 10 changed files with 54 additions and 50 deletions
...@@ -15827,58 +15827,52 @@ body.understrap-no-sidebar .wp-block-cover.alignwide { ...@@ -15827,58 +15827,52 @@ body.understrap-no-sidebar .wp-block-cover.alignwide {
15827 } 15827 }
15828 15828
15829 .tiles { 15829 .tiles {
15830 -moz-column-count: 3; 15830 display: grid;
15831 column-count: 3; 15831 grid-template-columns: auto auto auto;
15832 -moz-column-width: 33%;
15833 column-width: 33%;
15832 -moz-column-gap: 0px; 15834 -moz-column-gap: 0px;
15833 column-gap: 0px; 15835 column-gap: 0px;
15836 grid-auto-flow: dense;
15837 grid-template-rows: masonry;
15834 } 15838 }
15835 15839
15836 .tile { 15840 .tile {
15837 display: grid; 15841 display: inline-grid;
15838 grid-template-rows: 1fr auto;
15839 grid-row: 1/-1;
15840 grid-column: 1;
15841 margin: 0px; 15842 margin: 0px;
15842 cursor: pointer; 15843 cursor: pointer;
15843 font-size: 40px; 15844 font-size: 40px;
15844 text-align: center; 15845 text-align: center;
15845 background-color: #eee; 15846 background-color: #eee;
15846 vertical-align: top; 15847 vertical-align: top;
15848 height: 220px;
15849 grid-column-end: span 1;
15850 grid-row-end: span 1;
15847 } 15851 }
15848 15852
15849 .tile:hover { 15853 .tile:hover {
15850 background-color: #f5f5cd; 15854 background-color: #f5f5cd;
15851 } 15855 }
15852 15856
15853 .tile span {
15854 display: block;
15855 font-size: 40px;
15856 line-height: 220px;
15857 text-align: center;
15858 }
15859
15860 .tile.expand { 15857 .tile.expand {
15861 background-color: #ccc; 15858 background-color: #ccc;
15862 grid-column-end: span 3; 15859 grid-column-end: span 2;
15863 grid-row-end: span 3; 15860 grid-row-end: span 2;
15864 grid-row: 2/-1; 15861 height: 440px;
15865 grid-column: 2;
15866 } 15862 }
15867 15863
15868 .tile.expand:hover { 15864 .tile.expand:hover {
15869 background-color: #999; 15865 background-color: #999;
15870 } 15866 }
15871 15867
15872 .tile.expand span { 15868 .last-expand .tile:nth-of-type(7) {
15873 line-height: 440px; 15869 grid-column-end: 4;
15874 } 15870 }
15875 15871 .last-expand .tile:nth-of-type(8) {
15876 @media (max-width: 767px) { 15872 grid-row-end: 4;
15877 .tile { 15873 grid-column-end: 4;
15878 float: none;
15879 width: auto;
15880 }
15881 } 15874 }
15875
15882 .wp-block-getwid-tabs__nav-link { 15876 .wp-block-getwid-tabs__nav-link {
15883 border-width: 0px; 15877 border-width: 0px;
15884 border-bottom: 8px solid #FFB547; 15878 border-bottom: 8px solid #FFB547;
......
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.
...@@ -14666,6 +14666,10 @@ ...@@ -14666,6 +14666,10 @@
14666 tiles.click(function () { 14666 tiles.click(function () {
14667 tiles.removeClass('expand'); 14667 tiles.removeClass('expand');
14668 $(this).addClass('expand'); 14668 $(this).addClass('expand');
14669 $(this).parent().removeClass('last-expand');
14670 if ($(this).hasClass('last')) {
14671 $(this).parent().addClass('last-expand');
14672 }
14669 }); 14673 });
14670 } 14674 }
14671 $(document).ready(function () { 14675 $(document).ready(function () {
......
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
...@@ -31,6 +31,10 @@ jQuery(document).ready(function($) { ...@@ -31,6 +31,10 @@ jQuery(document).ready(function($) {
31 tiles.click(function(){ 31 tiles.click(function(){
32 tiles.removeClass('expand'); 32 tiles.removeClass('expand');
33 $(this).addClass('expand'); 33 $(this).addClass('expand');
34 $(this).parent().removeClass('last-expand');
35 if($(this).hasClass('last')){
36 $(this).parent().addClass('last-expand');
37 }
34 }); 38 });
35 } 39 }
36 40
......
...@@ -298,47 +298,49 @@ ...@@ -298,47 +298,49 @@
298 } 298 }
299 } 299 }
300 .tiles{ 300 .tiles{
301 column-count: 3; 301 display: grid;
302 column-gap: 0px; 302 grid-template-columns: auto auto auto;
303 column-width: 33%;
304 column-gap: 0px;
305 grid-auto-flow: dense;
306 grid-template-rows: masonry;
303 } 307 }
304 .tile { 308 .tile {
305 display: grid; 309 display: inline-grid;
306 grid-template-rows: 1fr auto;
307 grid-row: 1 / -1;
308 grid-column: 1;
309 margin: 0px; 310 margin: 0px;
310 cursor: pointer; 311 cursor: pointer;
311 font-size: 40px; 312 font-size: 40px;
312 text-align: center; 313 text-align: center;
313 background-color: #eee; 314 background-color: #eee;
314 vertical-align: top; 315 vertical-align: top;
316 height: 220px;
317 grid-column-end: span 1;
318 grid-row-end: span 1;
315 } 319 }
316 .tile:hover { 320 .tile:hover {
317 background-color: #f5f5cd; 321 background-color: #f5f5cd;
318 } 322 }
319 .tile span { 323
320 display: block;
321 font-size: 40px;
322 line-height: 220px;
323 text-align: center;
324 }
325 .tile.expand { 324 .tile.expand {
326
327 background-color: #ccc; 325 background-color: #ccc;
328 grid-column-end: span 3; 326 grid-column-end: span 2;
329 grid-row-end: span 3; 327 grid-row-end: span 2;
330 grid-row: 2 / -1; 328 height: 440px;
331 grid-column: 2;
332 } 329 }
333 .tile.expand:hover { 330 .tile.expand:hover {
334 background-color: #999; 331 background-color: #999;
335 } 332 }
336 .tile.expand span { 333
337 line-height: 440px; 334 .last-expand{
338 } 335 .tile:nth-of-type(7){
339 @media (max-width: 767px) { 336 //grid-column-end: 3;
340 .tile { 337 // grid-row-end: 3;
341 float: none; 338 grid-column-end:4;
342 width: auto;
343 } 339 }
344 }
...\ No newline at end of file ...\ No newline at end of file
340
341 .tile:nth-of-type(8){
342 //grid-column-end: 3;
343 grid-row-end: 4;
344 grid-column-end:4;
345 }
346 }
......