mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-09 05:26:24 +09:00
Oleg Isonen
48b4980d12
## Description - Canvas behavior should be exactly as in Webflow now - responsive canvas. - No constraints for resizing, you can switch to different breakpoints when you change the canvas width just like in preview ## Not done in this PR - [ ] breakpoints dropdown menu redesign - [ ] on-canvas resizable handles - [ ] flash-animate breakpoints list when breakpoint is switched through resize - [ ] flash-animate left and right borders when breakpoint is switched - [ ] gravity of resize handle dragging when reaching next breakpoint - [ ] vertical labels with @media example that matches current breakpoint - [ ] migrate min-width 0 breakpoints to base? - [ ] hide outline while changing size - [ ] ensure there is never both min and max in one media ## Todo - [x] draggable positioning calc - [x] shortcuts for zoom - [x] sync width and selected breakpoint - [x] remove scale - [x] fix mobile-first breakpoints - [x] tabbable toolbar items - [x] icon for base - [x] fix flicker - [x] After breakpoint delete/add CascadeIndicator doesn't refresh - [x] fix when there is no base, min-width 0 should have still a full width ## Steps for reproduction 1. click button 3. expect xyz ## Code Review - [ ] hi @TrySound, @istarkov , I need you to do - conceptual review (architecture, feature-correctness) - detailed review (read every line) - test it on preview ## Before requesting a review - [ ] made a self-review - [ ] added inline comments where things may be not obvious (the "why", not "what") ## Before merging - [ ] tested locally and on preview environment (preview dev login: 5de6) - [ ] updated [test cases](https://github.com/webstudio-is/webstudio-builder/blob/main/apps/builder/docs/test-cases.md) document - [ ] added tests - [ ] if any new env variables are added, added them to `.env.example` and the `builder/env-check.js` if mandatory
CSS Engine
This package is designed to render effectively CSS in the format produced by Webstudio Builder. It is using CSS variables for all dynamic parts and can render at runtime as for usage on Live Canvas in the Builder as well as for extracting a fully static style sheet for production.