3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-04 04:08:37 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Handsoff mode basic structure.

Browse source
This commit is contained in:
alonso.torres 2020-10-21 09:31:48 +02:00 • committed by Hirunatan
parent aaaf099a3f
commit 04f620ec00
24 changed files with 720 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/resources/styles/main-default.scss
View file

@ -29,6 +29,7 @@
@import 'main/layouts/main-layout';
@import "main/layouts/not-found";
@import "main/layouts/viewer";
@import "main/layouts/handoff";
//#################################################
// Commons
@ -80,3 +81,4 @@
@import 'main/partials/workspace-header';
@import 'main/partials/workspace-comments';
@import 'main/partials/color-bullet';
@import "main/partials/handoff";

33
frontend/resources/styles/main/layouts/handoff.scss Normal file
View file

@ -0,0 +1,33 @@
.handoff-layout {
display: grid;
grid-template-rows: 40px auto;
grid-template-columns: 1fr;
user-select: none;
&.fullscreen {
.viewer-header {
opacity: 0;
&:hover {
opacity: 1;
}
}
.viewer-content {
grid-row: 1 / span 2;
}
}
.viewer-header {
grid-column: 1 / span 1;
grid-row: 1 / span 1;
}
.viewer-content {
grid-column: 1 / span 1;
grid-row: 2 / span 1;
}
}
.handoff-layout .settings-bar.settings-bar-left {
left: 0;
}

16
frontend/resources/styles/main/partials/handoff.scss Normal file
View file

@ -0,0 +1,16 @@
// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
//
// This Source Code Form is "Incompatible With Secondary Licenses", as
// defined by the Mozilla Public License, v. 2.0.
//
// Copyright (c) 2020 UXBOX Labs SL
.handoff-svg-wrapper {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}

19
frontend/resources/styles/main/partials/sidebar.scss
View file

@ -115,6 +115,25 @@ $width-settings-bar: 16rem;
}
}
.tool-window-bar-icon {
height: 15px;
svg {
width: 15px;
height: 15px;
}
}
&.big {
height: 3rem;
padding-bottom: 1rem;
}
.tool-window-bar-title {
font-size: $fs14;
margin-left: 0.5rem;
}
.tool-window-icon {
margin-right: $small;
display: none;

32
frontend/resources/styles/main/partials/viewer-header.scss
View file

@ -4,7 +4,7 @@
border-bottom: 1px solid $color-gray-60;
display: flex;
height: 40px;
padding: $x-small $medium $x-small 55px;
padding: 0 $medium 0 55px;
position: relative;
z-index: 12;
justify-content: space-between;
@ -109,6 +109,36 @@
}
}
.mode-zone {
display: flex;
height: 100%;
.mode-zone-button {
background: inherit;
border: none;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 40px;
svg {
fill: $color-gray-20;
width: 24px;
height: 24px;
}
&.active {
background: $color-gray-60;
svg {
fill: $color-primary;
}
}
}
}
.options-zone {
align-items: center;
display: flex;