Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-09 14:21:42 -05:00
Code Issues Activity

fix user zone bug and grid WIP

Browse source
This commit is contained in:
Juan de la Cruz 2015-12-15 12:58:49 +01:00 • committed by Andrey Antukh
parent 5128410d82
commit b5bad3c785
8 changed files with 108 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
frontend/uxbox/ui/dashboard.cljs
View file

@ -248,12 +248,11 @@
(html (html
[:section.dashboard-grid [:section.dashboard-grid
[:h2 "Your projects"] [:h2 "Your projects"]
[:div.dashboard-grid-content
[:div.dashboard-grid-content [:div.dashboard-grid-content
[:div.grid-item.add-project {:on-click on-click} [:div.grid-item.add-project {:on-click on-click}
[:span "+ New project"]] [:span "+ New project"]]
(for [item (vals (:projects-by-id state))] (for [item (vals (:projects-by-id state))]
(rum/with-key (project-item item) (:id item)))]]])))) (rum/with-key (project-item item) (:id item)))]]))))
(def grid (def grid
(util/component (util/component

83
frontend/uxbox/ui/elements.cljs
View file

@ -2,6 +2,8 @@
(:require [sablono.core :as html :refer-macros [html]] (:require [sablono.core :as html :refer-macros [html]]
[rum.core :as rum] [rum.core :as rum]
[uxbox.ui.header :as ui.header] [uxbox.ui.header :as ui.header]
[uxbox.ui.icons.dashboard :as icons]
[uxbox.ui.icons :as i]
[uxbox.util :as util])) [uxbox.util :as util]))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
@ -13,7 +15,86 @@
(html (html
[:main.dashboard-main [:main.dashboard-main
(ui.header/header) (ui.header/header)
[:p "FOOO"]])) [:section.dashboard-content
[:section#dashboard-bar.dashboard-bar.library-bar
[:div.dashboard-info
[:span.dashboard-projects "20 elements"]
[:span "Sort by"]
#_(project-sort-selector (atom :name))]
[:div.dashboard-search
icons/search]]
[:section.dashboard-grid.library
[:h2 "Library name"]
[:div.dashboard-grid-content
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
[:div.grid-item.project-th
[:h3 "Custom element"]
[:div.project-th-actions
[:div.project-th-icon icons/search]
[:div.project-th-icon.delete icons/trash]]]
]
]
]
]))
(def elements (def elements
(util/component (util/component

8
frontend/uxbox/ui/header.cljs
View file

@ -15,13 +15,13 @@
(nav/link "/" i/logo)] (nav/link "/" i/logo)]
[:ul.main-nav [:ul.main-nav
[:li [:li
[:a {:href "/"} "PROJECTS"]] [:a {:href "/#/"} "PROJECTS"]]
[:li.current [:li.current
[:a {:href "/elements"} "ELEMENTS"]] [:a {:href "/#/elements"} "ELEMENTS"]]
[:li [:li
[:a {:href "/icons"} "ICONS"]] [:a {:href "/#/icons"} "ICONS"]]
[:li [:li
[:a {:href "/colors"} "COLORS"]]] [:a {:href "/#/colors"} "COLORS"]]]
(ui.u/user)])) (ui.u/user)]))
(def ^:static header (def ^:static header

1
resources/public/styles/base.scss
View file

@ -5,7 +5,6 @@ body {
flex-direction: column; flex-direction: column;
font-family: "sourcesanspro", sans-serif; font-family: "sourcesanspro", sans-serif;
height: 100%; height: 100%;
overflow: hidden;
user-select: none; user-select: none;
} }

15
resources/public/styles/layouts/main-layout.scss
View file

@ -3,13 +3,6 @@
height: 100%; height: 100%;
position: relative; position: relative;
.dashboard-content {
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
}
.workspace-content { .workspace-content {
display: flex; display: flex;
height: 100%; height: 100%;
@ -17,3 +10,11 @@
} }
} }
.dashboard-content {
box-sizing: border-box;
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
}

4
resources/public/styles/partials/dashboard-bar.scss
View file

@ -44,4 +44,8 @@
} }
&.library-bar {
padding: $small $medium $small 230px;
}
} }

8
resources/public/styles/partials/dashboard-grid.scss
View file

@ -11,9 +11,11 @@
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
min-height: 60vh; height: 100%;
justify-content: center; justify-content: center;
margin: $big; margin: $big;
max-height: 100%;
overflow: scroll;
width: 100%; width: 100%;
.grid-item { .grid-item {
@ -126,5 +128,9 @@
} }
} }
// STYLES FOR LIBRARIES
&.library {
padding: $medium $medium $medium 250px;
}
} }

3
resources/public/styles/partials/main-bar.scss
View file

@ -72,10 +72,11 @@
background-color: $color-white; background-color: $color-white;
border-radius: $br-small; border-radius: $br-small;
box-sizing: border-box; box-sizing: border-box;
left: 0; min-width: 150px;
padding: 0 $small; padding: 0 $small;
position: absolute; position: absolute;
top: 0; top: 0;
right: 0;
width: 100%; width: 100%;
z-index: 12; z-index: 12;
@include animation(0,.2s,fadeInDown); @include animation(0,.2s,fadeInDown);