[{"data":1,"prerenderedAt":195},["ShallowReactive",2],{"project-27048269":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":28,"sentiment":29,"stance_mix":30,"scored_comments":34,"aspects":35,"strip":39,"post_text":41,"what":42,"said":62,"maker_in_thread":123,"shape":126,"grid":129,"attempts":153,"same_week":158,"maker_shows":187,"maker_hidden":188,"reader_version":189,"card":190},"27048269","Split-Grid Generator","We're pushing the envelope with CSS grid in interesting ways to make it resizable along any dimension.","maker","Show HN: Split-Grid Generator","https:\u002F\u002Fsplit.js.org\u002F#\u002Fsplit-grid","split.js.org","nathancahill",1620210848,2021,89,9,581,2533,23,"notable","dev_tools","css layout generator","web_app",[24,25,26,27],"css grid","grid generator","resizable layout","css","mixed",0.2,{"positive":31,"neutral":31,"mixed":32,"critical":33},2,1,0,5,{"idea":36,"execution":37,"docs":38},{"positive":31,"critical":33},{"positive":33,"critical":33},{"positive":33,"critical":33},[33,34,33,33,33,40,40,40,34],3,null,{"problem":43,"audience":51,"pricing":41,"motivation":41,"time_to_build":41,"stack":60,"openness":61,"stage":61,"team_size":61},{"value":44,"source":45,"evidence":46},"Makes resizable CSS grid layouts without hand-writing code","commenter",[47],{"id":48,"by":49,"text":50},"27050517","aeoleonn","Fantastic, simple tool! Definitely saving it to my notes for future reference. Note: the min & max size settings... I don't quite understand. - What are the units? - does it…",{"value":52,"source":53,"evidence":54},"Developers building CSS grid layouts","inferred",[55,56],{"id":48,"by":49,"text":50},{"id":57,"by":58,"text":59},"27050996","rhacker","Love these tools. Any tools that help people use flex\u002Fgrid is A++++ in my book.",[],"unknown",{"praise":63,"objections":79,"requests":95,"questions":104,"alternatives":109},[64,68,75],{"value":65,"source":45,"evidence":66},"Simple, fast tool for setting up basic CSS grids",[67],{"id":48,"by":49,"text":50},{"value":69,"source":45,"evidence":70},"Helpful for understanding how CSS grid works",[71],{"id":72,"by":73,"text":74},"27049133","nameless912","Hey, just wanted to say thank you for this! I'm working on solving a similar problem for a side project (though in Clojurescript) and this is super helpful for understanding…",{"value":76,"source":45,"evidence":77},"Tools that help people use flex and grid are welcome",[78],{"id":57,"by":58,"text":59},[80,84,88],{"value":81,"source":45,"evidence":82},"Min and max size settings are confusing and unclear",[83],{"id":48,"by":49,"text":50},{"value":85,"source":45,"evidence":86},"Drag and drop UI gets buggy when min and max are used",[87],{"id":48,"by":49,"text":50},{"value":89,"source":45,"evidence":90},"Cannot add text to the example grid to test behaviour",[91],{"id":92,"by":93,"text":94},"27050724","Ciantic","I wish I could add text to the example grid inside, to test how it behaves. Grid has a problem with long texts without spaces. (Finnish language tend to have those and I find…",[96,100],{"value":97,"source":45,"evidence":98},"Let users add text to the example grid",[99],{"id":92,"by":93,"text":94},{"value":101,"source":45,"evidence":102},"Clearer documentation of min and max units and scope",[103],{"id":48,"by":49,"text":50},[105],{"value":106,"source":45,"evidence":107},"What units do the min and max settings use, and do they apply to a grid box or the screen?",[108],{"id":48,"by":49,"text":50},[110,116],{"value":111,"source":7,"evidence":112},"Split.js, the library this tool's predecessor came from",[113],{"id":114,"by":11,"text":115},"27049021","We're pushing the envelope with CSS grid in interesting ways to make it resizable along any dimension. The end result is content agnostic since we're only touching grid…",{"value":117,"source":45,"evidence":118},"Hand-written CSS grid with media queries",[119],{"id":120,"by":121,"text":122},"27050188","trinovantes","I think my favorite use of display:grid is being able to \"visually\" see how many columns I'm using on every media query as opposed to trying to do mental division on multiples of…",{"comments":32,"answered":33,"key":124},[125],{"id":114,"text":115},{"commenters":15,"max_depth":31,"maker_replies":32,"first_comment_mins":127,"lifespan_hours":128},114,6,[130,132,134,136,139,142,144,147,151],[114,33,33,131,11,32],"maker\u002Fneutral\u002Fidea",[72,33,34,133,73,33],"maker\u002Fpositive\u002Fidea",[120,32,33,135,121,33],"other\u002Fneutral\u002Fnone",[137,31,33,135,138,33],"27049342","mnw21cam",[140,31,33,135,141,33],"27051626","coding123",[92,40,40,143,93,33],"project\u002Fneutral\u002Fexecution",[48,145,40,146,49,33],4,"project\u002Fmixed\u002Fdocs",[148,34,40,149,150,33],"27051834","project\u002Fneutral\u002Fnone","maxwellwhite",[57,128,34,152,58,33],"project\u002Fpositive\u002Fidea",[154,157],{"id":155,"t":156,"points":31,"comments":33},"26664530",1617302944,{"id":4,"t":12,"points":14,"comments":15},[159,164,168,173,178,183],{"id":160,"name":161,"points":162,"category":163},"26998308","Second-Chance Pool",543,"consumer_social",{"id":165,"name":166,"points":167,"category":163},"27034904","Boze",450,{"id":169,"name":170,"points":171,"category":172},"27050801","Building Mobile Apps at Scale",357,"learning_science",{"id":174,"name":175,"points":176,"category":177},"27054357","CS Weapons",245,"games",{"id":179,"name":180,"points":181,"category":182},"27029776","I built Grafar",212,"languages",{"id":184,"name":185,"points":186,"category":20},"27007844","git-split-diffs",178,8,false,"v2",{"id":191,"name":5,"line":6,"ai":188,"cat":20,"year":13,"points":14,"comments":15,"rec":28,"s":29,"top":18,"kw":192,"maker":11,"domain":10,"tier":19,"attempts":31,"strip":193,"url":9,"mix":194,"praise":65,"objection":81,"sub":21},27048269,[24,25,26,27],"050003335",[31,31,32,33],1794036606421]