autonomic-cooperative/hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feature: mobile - classes added

Browse Source
This commit is contained in:
gaelle morin 2021-01-19 19:59:24 +01:00
parent ba9fe94ca7
commit f2f33073fc
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
28 changed files with 205 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package-lock.json generated
View File

@ -1159,9 +1159,9 @@
} }
}, },
"@startinblox/hubl-styling-framework": { "@startinblox/hubl-styling-framework": {
"version": "1.0.48", "version": "1.0.54",
"resolved": "https://registry.npmjs.org/@startinblox/hubl-styling-framework/-/hubl-styling-framework-1.0.48.tgz", "resolved": "https://registry.npmjs.org/@startinblox/hubl-styling-framework/-/hubl-styling-framework-1.0.54.tgz",
"integrity": "sha512-/bgu6Y2OZvnQhZ485knrgfFZZLm2UyxGcNiIQwtkze96feuJ91h5a0qa6vc6eRmKT4SBQSYHLoDtN4v/2Bcw4Q==" "integrity": "sha512-CSHt71PGCtlbTLp+DXoSVgB8hxYiUd/9Dhzof5KOVFbfEf4Tiwgp85DRkLfN8X0rMA+JFKL024Yw1z8MXlJKyg=="
}, },
"@types/q": { "@types/q": {
"version": "1.5.4", "version": "1.5.4",

2
package.json
View File

@ -45,7 +45,7 @@
] ]
}, },
"dependencies": { "dependencies": {
"@startinblox/hubl-styling-framework": "^1.0.48", "@startinblox/hubl-styling-framework": "^1.0.54",
"fs-extra": "^9.0.1", "fs-extra": "^9.0.1",
"normalize.css": "^8.0.1", "normalize.css": "^8.0.1",
"parcel-bundler": "^1.12.4", "parcel-bundler": "^1.12.4",

2
src/index.pug
View File

@ -50,7 +50,7 @@ html(lang="en")
nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.lg-quarter.jsLeftMenu nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.lg-quarter.jsLeftMenu
include views/partials/menu-left.pug include views/partials/menu-left.pug
main#content.segment.lg-three-quarter.text-top.notLoggedIn main#content.segment.lg-three-quarter.sm-full.text-top.notLoggedIn
if endpoints.get.dashboards if endpoints.get.dashboards
#dashboard(hidden, data-view="dashboard").scrollbar-content #dashboard(hidden, data-view="dashboard").scrollbar-content

4
src/styles/chat/_index.scss
View File

@ -1,3 +1,7 @@
.chat-view { .chat-view {
height: calc(100vh - 72px - 78px); height: calc(100vh - 72px - 78px);
@media (max-width: 768px) {
height: calc(100vh - 50px - 68px);
}
} }

51
src/styles/content/_index.scss
View File

@ -1,5 +1,9 @@
main { main {
height: calc(100vh - 72px); height: calc(100vh - 72px);
@media (max-width: 768px) {
height: calc(100vh - 50px);
}
} }
/* Styles of the right-hand menu + pages with that menu */ /* Styles of the right-hand menu + pages with that menu */
@ -11,17 +15,13 @@ main {
/*margin-top: 50px;*/ /*margin-top: 50px;*/
overflow: hidden; overflow: hidden;
/*@media(min-width: 1024px) {
margin-top: 0;
}*/
.views-container { .views-container {
flex: 1 0 0; flex: 1 0 0;
/*-webkit-backface-visibility: hidden;*/ /*-webkit-backface-visibility: hidden;*/
&.sidebar-is-closed { &.sidebar-is-closed {
@media(min-width: 1024px) { @media(min-width: 768.01px) {
margin-left: -152px; margin-left: -152px;
transform: translate(152px); transform: translate(152px);
} }
@ -38,6 +38,11 @@ main {
transition: all 0.5s; transition: all 0.5s;
width: 217px; width: 217px;
@media (max-width: 768px) {
height: calc(100vh - 50px);
width: 65px;
}
ul { ul {
li { li {
@ -65,35 +70,35 @@ main {
/* Styles use with JS to open/close the sidebar */ /* Styles use with JS to open/close the sidebar */
&.jsRightMenu { &.jsRightMenu {
display: none; display: block;
@media(min-width: 1024px) {
display: block;
}
} }
&.jsRightMenu:not([open]) { &.jsRightMenu:not([open]) {
transform: translate(152px); @media (min-width: 768.01px) {
transform: translate(152px);
}
/* Quick fix. When you got time, use animation on the span instead */
@media (max-width: 768px) {
ul>li:first-child>span,
ul>li:first-child>a {
visibility: hidden;
}
}
} }
&.jsRightMenu[open] { &.jsRightMenu[open] {
display: block;
bottom: 0;
right: 0;
@media(min-width: 1024px) { @media(max-width: 768px) {
display: block;
bottom: 0;
box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.12);
min-width: 60%; min-width: 60%;
position: fixed; position: fixed;
right: 0;
top: 50px; top: 50px;
z-index: 1; z-index: 1;
} }
@media(min-width: 1024px) {
box-shadow: none;
min-width: unset;
position: unset;
z-index: unset;
}
} }
} }
} }
@ -105,6 +110,10 @@ main {
height: calc(100vh - 72px); /* 72px == header's height */ height: calc(100vh - 72px); /* 72px == header's height */
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
-ms-overflow-style: none; -ms-overflow-style: none;
@media (max-width: 768px) {
height: calc(100vh - 50px);
}
} }
/* Custom scrollbar of the left-menu*/ /* Custom scrollbar of the left-menu*/

12
src/styles/header/_index.scss
View File

@ -33,7 +33,7 @@ header {
color: var(--color-heading); color: var(--color-heading);
align-self: center; align-self: center;
@media(min-width: 640px) { @media(min-width: 768.01px) {
margin-right: 23px; margin-right: 23px;
} }
@ -80,7 +80,7 @@ header {
.solid-notifications__triangle-shadow { .solid-notifications__triangle-shadow {
display: none; display: none;
@media(min-width: 1024px) { @media(min-width: 768.01px) {
background: white; background: white;
display: block; display: block;
position: absolute; position: absolute;
@ -118,7 +118,7 @@ header {
top: 2.5em; top: 2.5em;
width: 100vw; width: 100vw;
@media(min-width: 1024px) { @media(min-width: 768.01px) {
max-height: calc(100vh - 93px); max-height: calc(100vh - 93px);
position: absolute; position: absolute;
left: auto; left: auto;
@ -223,11 +223,7 @@ header {
line-height: 17px; line-height: 17px;
margin-top: 4px; margin-top: 4px;
@media(min-width: 640px) { @media(min-width: 768.01px) {
max-width: 226px;
}
@media(min-width: 1024px) {
max-width: 256px; max-width: 256px;
} }
} }

58
src/styles/index.scss
View File

@ -2,10 +2,6 @@
@import "@startinblox/hubl-styling-framework/dist/index.css"; @import "@startinblox/hubl-styling-framework/dist/index.css";
main {
background-color: pink;
}
solid-display>div { solid-display>div {
display: contents !important; display: contents !important;
} }
@ -22,11 +18,23 @@ solid-display>div {
line-height: 22px; line-height: 22px;
} }
.sm-whitespace-normal {
@media (max-width: 768px) {
white-space: normal;
}
}
.sm-text-center {
@media (max-width: 768px) {
text-align: center;
}
}
.send-display { .send-display {
position: absolute; position: absolute;
right: 20px; right: 20px;
top: 20px; top: 20px;
z-index: 1;
&::before { &::before {
margin-top: 4px; margin-top: 4px;
@ -39,19 +47,32 @@ solid-display>div {
bottom: 51px; bottom: 51px;
right: 30px; right: 30px;
z-index: 1; z-index: 1;
@media (max-width: 768px) {
right: 20px;
}
} }
.button-modify-profile { .button-modify-profile {
position: absolute; position: absolute;
right: 40px;
top: 40px; top: 40px;
right: 40px;
z-index: 1; z-index: 1;
@media (max-width: 768px) {
top: 20px;
right: 20px;
}
} }
.button-modify-skill { .button-modify-skill {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
right: 40px; right: 40px;
@media (max-width: 768px) {
right: 20px;
}
} }
.counter>div:nth-child(1) { .counter>div:nth-child(1) {
@ -154,7 +175,10 @@ solid-display>div {
#member-profile .member-bio, #member-profile .member-bio,
#profile .member-bio { #profile .member-bio {
max-width: 50%;
@media (min-width: 768.01px) {
max-width: 50%;
}
} }
.icon-location-pin::before, .icon-location-pin::before,
@ -162,6 +186,21 @@ solid-display>div {
margin-left: -3px; margin-left: -3px;
} }
#member-profile,
#solid-profile-my-profile {
.avatar {
margin-left: auto;
margin-right: auto;
}
@media (max-width: 768px) {
.member-bio {
max-width: none;
width: 100%;
}
}
}
/* Job-offers */ /* Job-offers */
.job-edit { .job-edit {
position: absolute; position: absolute;
@ -249,7 +288,12 @@ $small: "max-width: 768px";
} }
} }
/* Converse */
@media (max-width: 767.98px) {
#conversejs .converse-chatboxes .chatbox .box-flyout {
width: 100% !important;
}
}

4
src/styles/job-offers/_index.scss
View File

@ -1,3 +1,7 @@
#job-offers>div:first-of-type { #job-offers>div:first-of-type {
min-height: calc(100vh - 72px); min-height: calc(100vh - 72px);
@media (max-width: 768px) {
min-height: calc(100vh - 50px);
}
} }

4
src/styles/left-nav/_index.scss
View File

@ -1,6 +1,10 @@
nav#main__menu { nav#main__menu {
height: calc(100vh - 72px); height: calc(100vh - 72px);
@media (max-width: 768px) {
min-height: calc(100vh - 50px);
}
.unread { .unread {
font-weight: bolder; font-weight: bolder;
} }

4
src/styles/members/_index.scss
View File

@ -1,3 +1,7 @@
#members>div:first-of-type { #members>div:first-of-type {
min-height: calc(100vh - 72px); min-height: calc(100vh - 72px);
@media (max-width: 768px) {
min-height: calc(100vh - 50px);
}
} }

4
src/styles/profile/_index.scss
View File

@ -1,3 +1,7 @@
#profile>div:first-of-type { #profile>div:first-of-type {
min-height: calc(100vh - 72px); min-height: calc(100vh - 72px);
@media (max-width: 768px) {
min-height: calc(100vh - 50px);
}
} }

14
src/views/page-admin.pug
View File

@ -11,21 +11,21 @@
nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') nav.jsRightMenu.sidebar.whitespace-normal(role='navigation')
solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='admin-circles') solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='admin-circles')
ul ul
li.segment.lg-full.padding-small.text-right.text-normal.jsOffsiteToggle li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle
span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall
a(data-trans='admin.menuRight.fold') a(data-trans='admin.menuRight.fold')
if (endpoints.users || (endpoints.get && endpoints.get.users)) if (endpoints.users || (endpoints.get && endpoints.get.users))
solid-route.segment.lg-full(name='admin-communities') solid-route.segment.lg-full.sm-full(name='admin-communities')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-networking.icon-xlarge.margin-right-medium span.icon.ci-networking.icon-xlarge.margin-right-medium
a(data-trans='admin.menuRight.community') a(data-trans='admin.menuRight.community')
if endpoints.circles || (endpoints.get && endpoints.get.circles) if endpoints.circles || (endpoints.get && endpoints.get.circles)
solid-route.segment.lg-full(name='admin-circles') solid-route.segment.lg-full.sm-full(name='admin-circles')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-bubble-add.icon-xlarge.margin-right-medium span.icon.ci-bubble-add.icon-xlarge.margin-right-medium
a(data-trans='admin.menuRight.circles') a(data-trans='admin.menuRight.circles')
if endpoints.projects || (endpoints.get && endpoints.get.projects) if endpoints.projects || (endpoints.get && endpoints.get.projects)
solid-route.segment.lg-full(name='admin-projects') solid-route.segment.lg-full.sm-full(name='admin-projects')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-add.icon-xlarge.margin-right-medium span.icon.ci-add.icon-xlarge.margin-right-medium
a(data-trans='admin.menuRight.projects') a(data-trans='admin.menuRight.projects')

20
src/views/page-circle.pug
View File

@ -14,30 +14,30 @@
nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') nav.jsRightMenu.sidebar.whitespace-normal(role='navigation')
solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='circle-chat') solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='circle-chat')
ul ul
li.segment.lg-full.padding-small.text-right.text-normal.jsOffsiteToggle li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle
span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall
a(data-trans='circle.menuRight.fold') a(data-trans='circle.menuRight.fold')
solid-route.segment.lg-full(name='circle-chat') solid-route.segment.lg-full.sm-full(name='circle-chat')
li.segment.lg-full.padding-medium li.segment.lg-full.padding-medium
span.icon.ci-chat.icon-xlarge.margin-right-medium span.icon.ci-chat.icon-xlarge.margin-right-medium
a(data-trans='circle.menuRight.chat') a(data-trans='circle.menuRight.chat')
solid-route.segment.lg-full(name='circle-information') solid-route.segment.lg-full.sm-full(name='circle-information')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-information.icon-xlarge.margin-right-medium span.icon.ci-information.icon-xlarge.margin-right-medium
a(data-trans='circle.menuRight.information') a(data-trans='circle.menuRight.information')
if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes)) if (endpoints.resources || (endpoints.get && endpoints.get.resources)) && (endpoints.resourceskeywords || (endpoints.get && endpoints.get.resourceskeywords)) && (endpoints.resourcestypes || (endpoints.get && endpoints.get.resourcestypes))
solid-route.segment.lg-full(name='circle-resources' use-id) solid-route.segment.lg-full.sm-full(name='circle-resources' use-id)
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-networking.icon-xlarge.margin-right-medium span.icon.ci-networking.icon-xlarge.margin-right-medium
a(data-trans='circle.menuRight.resources') a(data-trans='circle.menuRight.resources')
if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents)) if (endpoints.events || (endpoints.get && endpoints.get.events)) && (endpoints.typeevents || (endpoints.get && endpoints.get.typeevents))
solid-route.segment.lg-full(name='circle-events' use-id) solid-route.segment.lg-full.sm-full(name='circle-events' use-id)
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-networking.icon-xlarge.margin-right-medium span.icon.ci-networking.icon-xlarge.margin-right-medium
a(data-trans='circle.menuRight.events') a(data-trans='circle.menuRight.events')
if endpoints.polls || (endpoints.get && endpoints.get.polls) if endpoints.polls || (endpoints.get && endpoints.get.polls)
solid-route.segment.lg-full(name='circle-polls' use-id) solid-route.segment.lg-full.sm-full(name='circle-polls' use-id)
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-networking.icon-xlarge.margin-right-medium span.icon.ci-networking.icon-xlarge.margin-right-medium
a(data-trans='circle.menuRight.polls') a(data-trans='circle.menuRight.polls')

2
src/views/page-dashboard.pug
View File

@ -1,4 +1,4 @@
div.padding-top-xlarge.padding-right-xsmall.padding-bottom-xlarge.padding-left-xsmall.whitespace-normal div.padding-top-xlarge.padding-right-xsmall.padding-bottom-xlarge.padding-left-xsmall.sm-padding-top-medium.whitespace-normal
solid-dashboard( solid-dashboard(
data-src=`${endpoints.dashboards || endpoints.get.dashboards}` data-src=`${endpoints.dashboards || endpoints.get.dashboards}`
) )

1
src/views/page-directory.pug
View File

@ -2,5 +2,4 @@ div.bg-color-grey.padding-top-xlarge.padding-right-small.padding-bottom-xlarge.p
solid-directory( solid-directory(
data-src=`${endpoints.users || endpoints.get.users}` data-src=`${endpoints.users || endpoints.get.users}`
range-skills=`${endpoints.skills || endpoints.get.skills}` range-skills=`${endpoints.skills || endpoints.get.skills}`
paginate-by="1"
) )

6
src/views/page-messages.pug
View File

@ -1,4 +1,4 @@
div.segment.lg-full.padding-top-small.padding-right-large.padding-bottom-small.padding-left-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-top-small.padding-right-large.padding-bottom-small.padding-left-large.sm-padding-xsmall.border-bottom.border-color-grey.whitespace-normal
solid-display.labelled-avatar.small( solid-display.labelled-avatar.small(
bind-resources bind-resources
fields='segment1(account.picture), segment2(name, hyphen, at, username)' fields='segment1(account.picture), segment2(name, hyphen, at, username)'
@ -8,7 +8,7 @@ div.segment.lg-full.padding-top-small.padding-right-large.padding-bottom-small.p
class-segment1='segment' class-segment1='segment'
class-account.picture='avatar small' class-account.picture='avatar small'
class-segment2='segment margin-left-xsmall text-xxlarge text-letter-spacing-large' class-segment2='segment margin-left-xsmall text-xxlarge text-letter-spacing-large whitespace-normal'
class-name='text-color-heading text-uppercase text-semibold' class-name='text-color-heading text-uppercase text-semibold'
class-hypen='text-color-heading' class-hypen='text-color-heading'
class-at='' class-at=''
@ -17,7 +17,7 @@ div.segment.lg-full.padding-top-small.padding-right-large.padding-bottom-small.p
widget-account.picture='hubl-user-avatar' widget-account.picture='hubl-user-avatar'
) )
.chat-view.segment.lg-full.whitespace-normal .chat-view.segment.lg-full.sm-full.whitespace-normal
solid-xmpp-chat( solid-xmpp-chat(
data-authentication='login', data-authentication='login',
data-auto-login='true', data-auto-login='true',

10
src/views/page-project.pug
View File

@ -10,15 +10,15 @@
nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') nav.jsRightMenu.sidebar.whitespace-normal(role='navigation')
solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='project-chat') solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='project-chat')
ul ul
li.segment.lg-full.padding-small.text-right.text-normal.jsOffsiteToggle li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle
span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall
a(data-trans='project.menuRight.fold') a(data-trans='project.menuRight.fold')
solid-route.segment.lg-full(name='project-chat') solid-route.segment.lg-full.sm-full(name='project-chat')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-chat.icon-xlarge.margin-right-medium span.icon.ci-chat.icon-xlarge.margin-right-medium
a(data-trans='project.menuRight.chat') a(data-trans='project.menuRight.chat')
solid-route.segment.lg-full(name='project-information') solid-route.segment.lg-full.sm-full(name='project-information')
li.segment.lg-full.padding-medium li.segment.lg-full.sm-full.padding-medium
span.icon.ci-information.icon-xlarge.margin-right-medium span.icon.ci-information.icon-xlarge.margin-right-medium
a(data-trans='project.menuRight.information') a(data-trans='project.menuRight.information')
solid-route(name='project-picture' use-id) solid-route(name='project-picture' use-id)

17
src/views/partials/admin/page-admin-circles-create.pug
View File

@ -1,10 +1,7 @@
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey
div.segment.lg-half h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.create.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.create.title')
div.segment.lg-half.text-right
solid-link(class="backlink", next='admin-circle-list' data-trans='circle.create.backlink')
div.segment.lg-full.padding-large.whitespace-normal div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal
div#loader-circles-create.loader.loader-top div#loader-circles-create.loader.loader-top
div div
div div
@ -20,10 +17,10 @@ div.segment.lg-full.padding-large.whitespace-normal
required-description required-description
loader-id='loader-circles-create' loader-id='loader-circles-create'
class-status='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading whitespace-normal' class-status='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading whitespace-normal'
class-linebreak='segment lg-half' class-linebreak='segment lg-half sm-hidden'
class-name='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading' class-name='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
class-description='segment margin-bottom-medium lg-half padding-left-small text-small text-semibold text-uppercase text-color-heading' class-description='segment margin-bottom-medium lg-half sm-full padding-left-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
label-status='' label-status=''
label-name='' label-name=''

17
src/views/partials/admin/page-admin-circles.pug
View File

@ -28,13 +28,10 @@ solid-router(default-route='admin-circle-list', hidden)
value-at='@' value-at='@'
) )
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
div h2.lg-margin-none.sm-margin-none.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.list.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.list.title')
div.segment.lg-hidden
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='circle.list.buttonMobile')
div.segment.lg-full.padding-large.whitespace-normal div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-normal.whitespace-normal
div#loader-admin-circles.loader.loader-top div#loader-admin-circles.loader.loader-top
div div
@ -42,13 +39,13 @@ solid-router(default-route='admin-circle-list', hidden)
div div
div div
div.segment.lg-full.margin-bottom-xlarge div.segment.lg-full.sm-full.margin-bottom-xlarge.whitespace-normal
div.segment.lg-half div.segment.lg-half.sm-full
h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='circle.list.subTitle') h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='circle.list.subTitle')
div.segment.lg-half.text-right div.segment.lg-half.sm-full.text-right
solid-ac-checker(data-src=`${endpoints.circles || (endpoints.post && endpoints.post.circles)}`, permission='acl:Append') solid-ac-checker(data-src=`${endpoints.circles || (endpoints.post && endpoints.post.circles)}`, permission='acl:Append')
solid-link( solid-link(
class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-plus' class='segment sm-full button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-plus'
next='admin-circle-create' next='admin-circle-create'
data-trans='circle.list.buttonCreate' data-trans='circle.list.buttonCreate'
) )

9
src/views/partials/admin/page-admin-communities.pug
View File

@ -15,13 +15,10 @@ solid-widget(name='hubl-action-community')
div.button.button-disabled(data-trans='communities.noPermission') div.button.button-disabled(data-trans='communities.noPermission')
#admin-communities-list(hidden, data-view="admin-communities-list") #admin-communities-list(hidden, data-view="admin-communities-list")
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
div h2.lg-margin-none.sm-margin-none.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title')
div.segment.lg-hidden
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='communities.menuMobile')
div.segment.lg-full.padding-large.whitespace-normal div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal
div.segment.lg-full.margin-bottom-xlarge div.segment.lg-full.margin-bottom-xlarge
h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='communities.subTitle') h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='communities.subTitle')

21
src/views/partials/admin/page-admin-projects-create.pug
View File

@ -1,17 +1,14 @@
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey
div.segment.lg-half h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='project.create.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='project.create.title')
div.segment.lg-half.text-right
solid-link(class="backlink", next='admin-project-list' data-trans='project.create.backlink')
div.segment.lg-full.padding-large div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal
div#loader-projects-create.loader.loader-top div#loader-projects-create.loader.loader-top
div div
div div
div div
div div
solid-form.segment.lg-full.whitespace-normal.form( solid-form.form(
data-src=`${endpoints.projects || endpoints.post.projects}` data-src=`${endpoints.projects || endpoints.post.projects}`
fields='status, customer.name, name, description, captain, linebreak' fields='status, customer.name, name, description, captain, linebreak'
@ -29,11 +26,11 @@ div.segment.lg-full.padding-large
label-description='Description' label-description='Description'
label-captain='' label-captain=''
class-customer.name='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading' class-customer.name='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
class-name='segment margin-bottom-medium lg-half padding-left-small text-small text-semibold text-uppercase text-color-heading' class-name='segment margin-bottom-medium lg-half sm-full padding-left-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
class-description='segment margin-bottom-medium lg-full text-small text-semibold text-uppercase text-color-heading' class-description='segment margin-bottom-medium lg-full sm-full text-small text-semibold text-uppercase text-color-heading'
class-captain='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading whitespace-normal' class-captain='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading whitespace-normal'
class-linebreak='segment lg-full' class-linebreak='segment lg-full sm-hidden'
widget-status='solid-form-hidden' widget-status='solid-form-hidden'
value-status='Private' value-status='Private'

17
src/views/partials/admin/page-admin-projects.pug
View File

@ -8,21 +8,18 @@ solid-router(default-route='admin-project-list', hidden)
#admin-project-list(hidden, data-view="admin-project-list") #admin-project-list(hidden, data-view="admin-project-list")
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
div h2.lg-margin-none.sm-margin-none.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='project.list.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='project.list.title')
div.segment.lg-hidden
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='project.list.buttonMobile')
div.segment.lg-full.padding-large.whitespace-normal div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal
div.segment.lg-full.margin-bottom-xlarge div.segment.lg-full.sm-full.margin-bottom-xlarge.whitespace-normal
div.segment.lg-half div.segment.lg-half.sm-full
h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='project.list.subTitle') h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='project.list.subTitle')
div.segment.lg-half.text-right div.segment.lg-half.sm-full.text-right
solid-ac-checker(data-src=`${endpoints.projects || (endpoints.post && endpoints.post.projects)}`, permission='acl:Append') solid-ac-checker(data-src=`${endpoints.projects || (endpoints.post && endpoints.post.projects)}`, permission='acl:Append')
solid-link( solid-link(
class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-plus' class='segment sm-full button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-plus'
next='admin-project-create' next='admin-project-create'
data-trans='project.list.buttonCreate' data-trans='project.list.buttonCreate'
) )

23
src/views/partials/admin/page-admin-users-create.pug
View File

@ -1,11 +1,8 @@
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.padding-large.border-bottom.border-color-grey
div.segment.lg-half h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title')
h2.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title')
div.segment.lg-half.text-right
solid-link(class="backlink", next='admin-communities-list' data-trans='user.create.backlink')
div.segment.lg-full.padding-large.whitespace-normal div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal
div#loader-users-title.loader.loader div#loader-users-title.loader.loader
div div
div div
@ -25,13 +22,13 @@ div.segment.lg-full.padding-large.whitespace-normal
solid-widget(name='hubl-email-field') solid-widget(name='hubl-email-field')
template template
div.segment.margin-bottom-medium.lg-half.padding-left-small.text-small.text-semibold.text-uppercase.text-color-heading div.segment.margin-bottom-medium.lg-half.sm-full.padding-left-small.sm-padding-none.text-small.text-semibold.text-uppercase.text-color-heading
label(data-trans='user.create.labelEmail') label(data-trans='user.create.labelEmail')
input(type="email" label='' data-trans='label=user.create.labelEmail' name="email" required value="\${value}" data-holder) input(type="email" label='' data-trans='label=user.create.labelEmail' name="email" required value="\${value}" data-holder)
div.segment.margin-bottom-medium.clearfix div.segment.margin-bottom-medium
div.segment.float-left div.segment
h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='user.create.title', loader-id='loader-users-title') p.text-color-heading.text-semibold.text-xlarge.text-letter-spacing-large(data-trans='user.create.title', loader-id='loader-users-title')
solid-form.form#selected-community( solid-form.form#selected-community(
bind-resources bind-resources
@ -44,9 +41,9 @@ div.segment.lg-full.padding-large.whitespace-normal
required-user.email required-user.email
loader-id='loader-users-create' loader-id='loader-users-create'
class-user.first_name='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading' class-user.first_name='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
class-user.last_name='segment margin-bottom-medium lg-half padding-left-small text-small text-semibold text-uppercase text-color-heading' class-user.last_name='segment margin-bottom-medium lg-half sm-full padding-left-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
class-user.username='segment margin-bottom-medium lg-half padding-right-small text-small text-semibold text-uppercase text-color-heading' class-user.username='segment margin-bottom-medium lg-half sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading'
label-user.first_name='' label-user.first_name=''
label-user.last_name='' label-user.last_name=''

4
src/views/partials/circle/page-circle-chat.pug
View File

@ -1,4 +1,4 @@
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
solid-display.text-xxlarge.text-letter-spacing-large( solid-display.text-xxlarge.text-letter-spacing-large(
bind-resources bind-resources
fields='name, dash, description' fields='name, dash, description'
@ -9,7 +9,7 @@ div.segment.lg-full.padding-large.border-bottom.border-color-grey
class-dash='text-color-heading text-bold' class-dash='text-color-heading text-bold'
) )
.chat-view.segment.lg-full.whitespace-normal .chat-view.segment.lg-full.sm-full.whitespace-normal
solid-xmpp-chat( solid-xmpp-chat(
data-authentication='login', data-authentication='login',
data-auto-login='true', data-auto-login='true',

25
src/views/partials/circle/page-circle-profile.pug
View File

@ -4,7 +4,7 @@ solid-router(default-route='circle-profile', hidden)
#circle-profile(hidden, data-view="circle-profile") #circle-profile(hidden, data-view="circle-profile")
solid-ac-checker.block(permission='acl:Read', bind-resources) solid-ac-checker.block(permission='acl:Read', bind-resources)
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
solid-display.text-xxlarge.text-letter-spacing-large( solid-display.text-xxlarge.text-letter-spacing-large(
bind-resources bind-resources
fields='name, dash, description' fields='name, dash, description'
@ -14,14 +14,12 @@ solid-router(default-route='circle-profile', hidden)
class-name='text-color-heading text-bold' class-name='text-color-heading text-bold'
class-dash='text-color-heading text-bold' class-dash='text-color-heading text-bold'
) )
div.segment.lg-hidden
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='circle.menuRight.buttonMobile')
solid-widget(name='hubl-circle-team-contact') solid-widget(name='hubl-circle-team-contact')
template template
solid-link.icon.icon-secondary.hover.icon-speech.margin-left-xsmall(data-src='\${value}', next='messages') solid-link.icon.icon-secondary.hover.icon-speech.margin-left-xsmall(data-src='\${value}', next='messages')
div.segment.lg-full.padding-large div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-xlarge
div#loader-circle-profile.loader div#loader-circle-profile.loader
div div
div div
@ -29,7 +27,7 @@ solid-router(default-route='circle-profile', hidden)
div div
div.whitespace-normal div.whitespace-normal
solid-display.segment.lg-half( solid-display.segment.lg-half.sm-full.sm-margin-bottom-medium(
bind-resources bind-resources
fields='creationDateSet(title, creationDate)' fields='creationDateSet(title, creationDate)'
loader-id='loader-circle-profile' loader-id='loader-circle-profile'
@ -39,15 +37,16 @@ solid-router(default-route='circle-profile', hidden)
widget-creationDate='solid-display-value-date' widget-creationDate='solid-display-value-date'
) )
solid-ac-checker.segment.lg-half.text-right.margin-bottom-large(permission='acl:Append', bind-resources, nested-field='members')
solid-ac-checker(permission='acl:Delete', bind-resources)
solid-link(class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-pencil' next='circle-edit' bind-resources data-trans='circle.profile.buttonModify')
solid-ac-checker(no-permission='acl:Delete', bind-resources)
solid-link(class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-pencil' next='circle-edit' bind-resources data-trans='circle.profile.buttonAdd')
solid-ac-checker.segment.lg-full.text-right.margin-bottom-large(permission='acl:Delete', bind-resources) solid-ac-checker.segment.lg-half.sm-full.text-right.margin-bottom-large(permission='acl:Append', bind-resources, nested-field='members')
solid-ac-checker(permission='acl:Delete', bind-resources)
solid-link(class='segment sm-full margin-bottom-large sm-margin-bottom-medium button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-pencil' next='circle-edit' bind-resources data-trans='circle.profile.buttonModify')
solid-ac-checker(no-permission='acl:Delete', bind-resources)
solid-link(class='segment sm-full margin-bottom-large sm-margin-bottom-medium button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-pencil' next='circle-edit' bind-resources data-trans='circle.profile.buttonAdd')
solid-ac-checker.segment.lg-full.sm-full.text-right.margin-bottom-large.sm-margin-bottom-medium(permission='acl:Delete', bind-resources)
solid-delete( solid-delete(
class='button text-xsmall text-bold text-uppercase color-secondary bordered' class='segment sm-full button text-xsmall text-bold text-uppercase text-uppercase text-center color-secondary bordered'
bind-resources bind-resources
data-label='' data-label=''
data-trans='data-label=circle.profile.buttonDelete' data-trans='data-label=circle.profile.buttonDelete'
@ -99,7 +98,7 @@ solid-router(default-route='circle-profile', hidden)
solid-widget(name='hubl-circle-user-admin') solid-widget(name='hubl-circle-user-admin')
template ${value ? "Administrateur" : ""} template ${value ? "Administrateur" : ""}
solid-display.segment.lg-full.labelled-avatar.two-lines.whitespace-normal.children.lg-children-full.children-margin-bottom-medium( solid-display.segment.lg-full.sm-full.labelled-avatar.two-lines.whitespace-normal.children.lg-children-full.sm-children-full.children-margin-bottom-medium(
bind-resources bind-resources
nested-field='members' nested-field='members'
loader-id='loader-circle-profile' loader-id='loader-circle-profile'

2
src/views/partials/header.pug
View File

@ -9,7 +9,7 @@ div
span.tag.reversed.text-semibold(data-trans='header.beta') span.tag.reversed.text-semibold(data-trans='header.beta')
div div
solid-notifications.segment.notLoggedIn( solid-notifications.segment.sm-margin-right-xlarge.notLoggedIn(
nested-field="inbox" nested-field="inbox"
bind-user bind-user
) )

4
src/views/partials/project/page-project-chat.pug
View File

@ -1,4 +1,4 @@
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
solid-display.text-xxlarge.text-letter-spacing-large( solid-display.text-xxlarge.text-letter-spacing-large(
bind-resources bind-resources
fields='const-title1, number, customer.name, dash, name' fields='const-title1, number, customer.name, dash, name'
@ -13,7 +13,7 @@ div.segment.lg-full.padding-large.border-bottom.border-color-grey
value-dash=' - ' value-dash=' - '
) )
.chat-view.segment.lg-full.whitespace-normal .chat-view.segment.lg-full.sm-full.whitespace-normal
solid-xmpp-chat( solid-xmpp-chat(
data-authentication='login', data-authentication='login',
data-auto-login='true', data-auto-login='true',

20
src/views/partials/project/page-project-profile.pug
View File

@ -4,7 +4,7 @@ solid-router(default-route='project-profile', hidden)
#project-profile(hidden, data-view="project-profile") #project-profile(hidden, data-view="project-profile")
solid-ac-checker.block(permission='acl:Read', bind-resources) solid-ac-checker.block(permission='acl:Read', bind-resources)
div.segment.lg-full.padding-large.border-bottom.border-color-grey div.segment.lg-full.sm-full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
solid-display.text-xxlarge.text-letter-spacing-large( solid-display.text-xxlarge.text-letter-spacing-large(
bind-resources bind-resources
fields='const-title1, number, customer.name, dash, name' fields='const-title1, number, customer.name, dash, name'
@ -18,14 +18,12 @@ solid-router(default-route='project-profile', hidden)
value-const-title1='N°' value-const-title1='N°'
value-dash=' - ' value-dash=' - '
) )
div.segment.lg-hidden
button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='project.menuRight.buttonMobile')
solid-widget(name='hubl-project-team-contact') solid-widget(name='hubl-project-team-contact')
template template
solid-link.icon.icon-secondary.hover.icon-speech.margin-left-xsmall(data-src='\${value}', next='messages') solid-link.icon.icon-secondary.hover.icon-speech.margin-left-xsmall(data-src='\${value}', next='messages')
div.segment.lg-full.padding-large div.segment.lg-full.sm-full.padding-large.sm-padding-xsmall.sm-padding-top-xlarge
div#loader-project-profile.loader div#loader-project-profile.loader
div div
div div
@ -33,7 +31,7 @@ solid-router(default-route='project-profile', hidden)
div div
div.whitespace-normal div.whitespace-normal
solid-display.segment.lg-half( solid-display.segment.lg-half.sm-full.sm-margin-bottom-medium(
bind-resources bind-resources
fields='creationDateSet(title, creationDate)' fields='creationDateSet(title, creationDate)'
loader-id='loader-project-profile' loader-id='loader-project-profile'
@ -46,15 +44,15 @@ solid-router(default-route='project-profile', hidden)
widget-creationDate='solid-display-value-date' widget-creationDate='solid-display-value-date'
) )
solid-ac-checker.segment.lg-half.text-right.margin-bottom-large(permission='acl:Append', bind-resources, nested-field='members') solid-ac-checker.segment.lg-half.sm-full.text-right(permission='acl:Append', bind-resources, nested-field='members')
solid-ac-checker(permission='acl:Delete', bind-resources) solid-ac-checker(permission='acl:Delete', bind-resources)
solid-link(class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-pencil' next='project-edit' bind-resources data-trans='project.profile.buttonModify') solid-link(class='segment sm-full margin-bottom-large sm-margin-bottom-medium button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-pencil' next='project-edit' bind-resources data-trans='project.profile.buttonModify')
solid-ac-checker(no-permission='acl:Delete', bind-resources) solid-ac-checker(no-permission='acl:Delete', bind-resources)
solid-link(class='button text-xsmall text-bold text-uppercase reversed color-secondary bordered icon icon-pencil' next='project-edit' bind-resources data-trans='project.profile.buttonAdd') solid-link(class='segment sm-full margin-bottom-large sm-margin-bottom-medium button text-xsmall text-bold text-uppercase text-center reversed color-secondary bordered icon icon-pencil' next='project-edit' bind-resources data-trans='project.profile.buttonAdd')
solid-ac-checker.segment.lg-full.text-right.margin-bottom-large(permission='acl:Delete', bind-resources) solid-ac-checker.segment.lg-full.sm-full.text-right.margin-bottom-large.sm-margin-bottom-medium(permission='acl:Delete', bind-resources)
solid-delete( solid-delete(
class='button text-xsmall text-bold text-uppercase color-secondary bordered' class='segment sm-full button text-xsmall text-bold text-uppercase text-center color-secondary bordered'
bind-resources bind-resources
data-label='' data-label=''
data-trans='data-label=project.profile.buttonDelete' data-trans='data-label=project.profile.buttonDelete'
@ -97,7 +95,7 @@ solid-router(default-route='project-profile', hidden)
h3.text-color-heading.text-bold.text-letter-spacing-large(data-trans='project.profile.subTitle') h3.text-color-heading.text-bold.text-letter-spacing-large(data-trans='project.profile.subTitle')
solid-display.segment.lg-full.labelled-avatar.two-lines.whitespace-normal.children.lg-children-full.children-margin-bottom-medium( solid-display.segment.lg-full.sm-full.labelled-avatar.two-lines.whitespace-normal.children.lg-children-full.sm-children-full.children-margin-bottom-medium(
bind-resources bind-resources
nested-field='members' nested-field='members'
fields='segment1(user.account.picture), segment2(line1(user.name, user), line2(atom, user.communities))' fields='segment1(user.account.picture), segment2(line1(user.name, user), line2(atom, user.communities))'