How to align console panel to right in codesandbox? - interface

I'd like to align the browser/test/console panel to the right side of the js panel.
First tried to drag them, but it didn't work.
Is there any way?

View > Editor Layout > Flip Full Layout

Moritz W's solution seems to do the trick but only temporarily. I noticed that when I close and re-open the sandbox - the location of the browser window goes back to it original bottom location.
One way to deal with this is to create a template with the browser window on the right.
Creating a template however does not mitigate the situation when you are forking someone else's code. To persist the location of the browser window you must change the settings like this: File / Preferences / CodeSandbox Settings > Open VSCode Settings > Workbench / Editor Management / Open Side By Side Direction > right
If you are confused - here is an imgur image to show you how to get there.
PSA - I am not entirely confident in this solution - please let me know in the comments if this worked for you.

Related

Is there a way to make the terminal in VSCode take up the entire width of the application even if the sidebar is open?

Is there a way to make terminal span the entire width of the application without closing the sidenav? I use it quite a bit, and often I have to hide the sidenav in order to see it in full width. It would be great if I could set it up so the sidenav is just alongside the editor, allowing terminal to take up the full width of the application.
This is in Stable v1.64 now.
Go to View/Appearance/Align Panel/Justify or use the Layout Control icon on the upper right mentioned below.
Other options for the Panel alignment are center/left/right.
Note that that the Layout icon on the upper right was recently added with this setting:
Workbench > Layout Control: Enabled
Also, as of v1.75 this can be done via the context menu for the Panel. Right-click on an open space of the Panel to the right of the View headers to open the context menu:
See Release Notes: Manage Panel Alignment
It's already available since version 1.64.
Let's switch to Justify option.
**Unfortunately, it is not possible at the moment.
There is a ticket for this feature in the VSCode repository - https://github.com/microsoft/vscode/issues/42149
UPDATE:
It's already available since version 1.64.
See other answers below for more information

VS code adds margin to editor groups

As you can see in the image VS code started to add margins to editor group. When I try to pull it to sides this is the biggest space that I can get.
Update: When I open files side by side still
can you try this?
press F1
type "Preferences: Open Settings (UI)"
click Window
under New Window Dimensions click default or other options.
I don't really know if this helps.
The selected answer is not the right answer. I got rid of the margins through View.. Appearance.. [turn off 'Centered Layout']
This problem is solved when I created a new workspace and add the same folder by using "File->Add Folder to Workspace..."

How to Display VS Code output window to side rather than below

In my VS Code set up I see the output/FSI frame below the main text editor pane like this:
whereas I would love it to appear to the right in the side-by-side view like it does on the images in this link: http://www.wintellect.com/devcenter/jwood/a-quick-look-at-f-in-visual-studio-code
Is there a config option I cannot find somewhere?
I tried Googling but drew a blank and cannot see anything obvious in the config options mentioned on the vs code site page describing the config options
as of version 1.51.1 right click in the right corner on the output panel. then select option 'move panel right'
I don't believe you can detach/move the output windows in Visual Studio Code. You can move the side bar to the left/right side, but that's it. There is no config option, sorry.
You could try posting a feature request on the GitHub page: https://github.com/Microsoft/vscode
EDIT: This was changed in VS Code 0.10.8, it was once on the side but was moved to the bottom. See this GitHub issue: https://github.com/Microsoft/vscode/issues/2806
This feature is not available yet in VS Code. However as of today (March 30, 2017) it's on 6 months roadmap so it should be done in a near feature.
This feature is available from version 1.18.0+
Simply click this icon to dock to the right:
Just follow the steps mentioned:
In Visual Studio Code -
View Tab > Appearance > Toggle Panel Position
That's it.
Your original link to the view your desire is obsolete, so it is a guess as to what you wanted. But here is a demo of setting up a terminal/output look side-by-side. It is a little tricky - you drag your Outline header over the Terminal header which will then allow you the option of putting it to the left or right of the Terminal:
its easy. just right-click on the terminal, select 'move panel right' like in the image below and voila
the image can be found here
Vertical Split:
From VS Code Menu bar:
View >> Appearance >> Move Panel Right
Version 1.47.0 of VS Code (at the moment of posting this, the latest one) allows you to drag output (or any other panel tab, e.g. terminal) to the activity bar. This way you can obtain output to the side of the editor.
Just right click on the panel of output section then select "Move panel left or right" as per your wish.
here your can see the move panel left option.
Press CTRL + SHIFT + P
Select Preferences: Open User Settings (JSON)
Insert (or change if it is there --search for it) the following config line:
"workbench.panel.defaultLocation": "right",
Save file.
That will work for new workspaces. VS-Code saves your preferences for each folder you start it in. So, if you navigate to a folder you previously called VS-Code in (I mean, from the terminal), it will open the output panel in the same location it was the last time you have used VS-Code from the same location.
After making the change above, go to a new place, like /opt and start VS-Code there to make a test.

How can I display project explorer side by side with editor in eclips?

I was running my app when suddenly the layout of eclips changed.Now, the project explorer is at the top and the editor below it.What I want is the explorer to be to the left side and the editor to the right.Just like it used to be.It might be simple issue but very annoying as I can't see the files without having to scroll down in the explorer window.I tried reset perspective but didn't work! Any ideas?
You can use the menu command Window > Reset Perspective to restore it to it's default layout. Otherwise, you can move Views around however you like to get a custom layout.

Editor in eclipse has vanished

I feel slightly like n00b encountering windows for the first time, but I have lost the editor window in Eclipse. I had dragged one of two tabs to one side such that I could view the two files side by side and it disappeared. Foolishly, I then dragged the remaining tab to the same position and found that it also disappeared.
When I select 'Windows' > 'Navigation' > 'Next editor' I can see that both files are still open. I have tried opening other files, and although they do open they are similarly invisible. I tried resetting the perspective, but the editor was left absent. I'm running out of ideas, so any contributions would be highly welcome! I'm using a mac by the way.
Perspective reset or window->new editor did not work for me. What worked though was to create a new window with Window->New Window, and then close the first one with editor hidden. Hope this help.
Just so this case be changed to 'answered':
I ended up using cmd-W to close the editors one by one, then was able to open a new editor. I still don't understand what caused the problem, but at least it is solved now. Many thanks for the suggestions though!
Pressing the F12 key normally focuses the Editor only if the Editor is not minimized.
Window -> New Editor is also disabled once the Editor view is minimized.
What's definitely going to work is resetting the perspective by doing Window -> Reset Perspective. That should bring the editor back into view.
Take a look at this screencast which shows how to do this.
They might have been in a separate window. Try right clicking on the Eclipse icon on your dock and see if the editors are there. If yes, drag them to your IDE.
I got the same problem today. I solved it just by Window > Reset perspective...
I have lost the editor too doing drag & drop. I try all here, and finally I used Window > New Widow and the second one comes with editor.