diff --git a/Makefile b/Makefile
index ea0ad7f..fbd0490 100644
--- a/Makefile
+++ b/Makefile
@@ -1,6 +1,8 @@
+DIST_DIR := www
+
SCRIPT_SRC := $(wildcard src/scripts/*.js)
-SCRIPT_DEST := $(SCRIPT_SRC:src/%=www/%)
+SCRIPT_DEST := $(SCRIPT_SRC:src/%=$(DIST_DIR)/%)
default: build
@@ -14,7 +16,7 @@ submodules:
git submodule init
git submodule update
-build: www/index.html www/styles/index.css $(SCRIPT_DEST)
+build: $(DIST_DIR)/index.html $(DIST_DIR)/styles/index.css $(SCRIPT_DEST)
watch:
@echo 'watching for change'
@@ -36,21 +38,22 @@ copy_lib:
@node copy_lib.js
# pug
-www/index.html: src/index.pug $(wildcard src/*.pug src/*/*.pug)
+$(DIST_DIR)/index.html: src/index.pug $(wildcard src/*.pug src/*/*.pug)
@echo pug: $< ➜ $@
@node_modules/.bin/pug --pretty $< --out $(dir $@) || touch $@
# sass
-www/styles/index.css: src/styles/index.scss $(wildcard src/*.scss src/*/*.scss)
+$(DIST_DIR)/styles/index.css: src/styles/index.scss $(wildcard src/*.scss src/*/*.scss)
@echo sass: $< ➜ $@
- @node_modules/.bin/node-sass $< $@ --source-map true || touch $@
+ @node_modules/.bin/node-sass $< $@ --source-map true --source-map-contents || touch $@
# babel
-www/%.js: src/%.js
+$(DIST_DIR)/%.js: src/%.js
@echo babel: $< ➜ $@
@mkdir -p $(dir $@)
@node_modules/.bin/babel $< --out-file $@ --source-maps || touch $@
-.PHONY: default install submodules copy_lib build watch serve clean
-
+sync:
+ rsync -rv www/* staging-app@ssh-staging-app.happy-dev.fr:~/staging-app.happy-dev.fr/
+.PHONY: default install submodules copy_lib build watch serve clean
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index afd2d93..8e6f5e9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3424,6 +3424,11 @@
"integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E=",
"dev": true
},
+ "include-media": {
+ "version": "1.4.9",
+ "resolved": "https://registry.npmjs.org/include-media/-/include-media-1.4.9.tgz",
+ "integrity": "sha1-0AILe+PrLVSGiiCUNZXOOA4LxDs="
+ },
"indent-string": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
diff --git a/package.json b/package.json
index 3cddfa8..cab5aef 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
"dependencies": {
"@webcomponents/html-imports": "^1.2.0",
"@webcomponents/webcomponentsjs": "^1.2.7",
+ "include-media": "^1.4.9",
"normalize.css": "^8.0.0",
"simple-line-icons": "^2.4.1"
}
diff --git a/server.js b/server.js
index 7637428..eafd12a 100644
--- a/server.js
+++ b/server.js
@@ -6,7 +6,7 @@ const express = require('express');
const app = express();
app
.use(express.static(distPath))
- .use('/src', express.static(join(__dirname, 'src')))
+ // .use('/src', express.static(join(__dirname, 'src')))
.get(/^[^.]*$/, (req, rep) =>
rep.sendFile(join(__dirname, distPath, '/index.html')),
)
diff --git a/src/dependencies.pug b/src/dependencies.pug
index f0cbd56..deb579d 100644
--- a/src/dependencies.pug
+++ b/src/dependencies.pug
@@ -1,27 +1,29 @@
// Scripts
-script(src="lib/webcomponentsjs/webcomponents-loader.js")
+script(src="/lib/webcomponentsjs/webcomponents-loader.js")
//- script(src="lib/html-imports.js")
//- script(src="https://unpkg.com/@webcomponents/webcomponentsjs@1.2.7/webcomponents-loader.js")
+script(src='/lib/sib-chat/3rdparty/sib-oidc-client.js')
-script(src="scripts/index.js")
+script(src="/scripts/index.js")
// Stylesheets
-link(rel='stylesheet', href='lib/normalize.css')
-link(rel='stylesheet', href="styles/index.css")
+link(rel='stylesheet', href='/lib/normalize.css')
+link(rel='stylesheet', href='/styles/index.css')
link(
rel='stylesheet'
- href='https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i&subset=latin-ext'
+ href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700&subset=latin-ext'
)
+link(href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet")
// Web components
//- local
-link(rel='import', href='lib/sib-core/sib-display.html')
-link(rel='import', href='lib/sib-router/sib-router.html')
- //-link(rel='import', href='lib/sib-chat/sib-chat.html')
+link(rel='import', href='/lib/sib-core/sib-display.html')
+link(rel='import', href='/lib/sib-router/sib-router.html')
+link(rel='import', href='/lib/sib-chat/sib-chat.html')
//- cdn
link(rel='import', href="https://cdn.happy-dev.fr/sib-core/sib-display.html")
link(rel='import', href="https://cdn.happy-dev.fr/sib-router/sib-router.html")
- //- link(rel='import', href="https://cdn.happy-dev.fr/sib-chat/sib-chat.html")
+ //- link(rel='import', href="https://cdn.happy-dev.fr/sib-chat/sib-chat.html")
\ No newline at end of file
diff --git a/src/index.pug b/src/index.pug
index ad00247..63ec80d 100644
--- a/src/index.pug
+++ b/src/index.pug
@@ -1,4 +1,4 @@
-include variables.pug
+include config.pug
html(lang="en")
head
@@ -9,8 +9,7 @@ html(lang="en")
include dependencies.pug
body
header#header
- #logo
- img(src="img/logo.png" width=166/2 height=48/2)
+ include header.pug
#subContainer
include menu.pug
main#mainContainer
@@ -19,18 +18,18 @@ html(lang="en")
#members(hidden)
include page-members.pug
#member(hidden)
- div include page-member.pug
+ include page-member.pug
#job-offers(hidden)
include page-job-offers.pug
- #projects(hidden)
+ //-#projects(hidden)
include page-projects.pug
#project(hidden)
include page-project.pug
//- #client-creation(hidden)
include page-client-creation.pug
- #channels(hidden)
- include page-channels.pug
- #channel(hidden)
- include page-channel.pug
+ //-#groups(hidden)
+ include page-groups.pug
+ #group(hidden)
+ include page-group.pug
//- #search(hidden)
include page-search.pug
\ No newline at end of file
diff --git a/src/menu.pug b/src/menu.pug
index b1613a0..6989aa9 100644
--- a/src/menu.pug
+++ b/src/menu.pug
@@ -1,4 +1,3 @@
-.btn-toggle
div
nav#navbar
sib-router#navbar-router(default-route='members')
@@ -18,10 +17,10 @@ div
)
sib-route(hidden, name='project', id-prefix=`${sdn}/projects/`)
div
- div.icon-bubbles Channels
+ div.icon-bubbles Groups
sib-display(
data-src=`${sdn}/channels/`,
data-fields='name',
- next='channel'
+ next='group'
)
- sib-route(hidden, name='channel', id-prefix=`${sdn}/channels/`)
\ No newline at end of file
+ sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
\ No newline at end of file
diff --git a/src/page-channel-chat.pug b/src/page-channel-chat.pug
deleted file mode 100644
index 2e54d66..0000000
--- a/src/page-channel-chat.pug
+++ /dev/null
@@ -1,2 +0,0 @@
-#channel-chat.chat-view(style='display: none', bind-resources='')
- sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources='')
\ No newline at end of file
diff --git a/src/page-channel-create.pug b/src/page-channel-create.pug
deleted file mode 100644
index 5e7b303..0000000
--- a/src/page-channel-create.pug
+++ /dev/null
@@ -1,7 +0,0 @@
-#channel-create(style='display: none')
- sib-form(
- data-src=`${sdn}/channels/`,
- range-owner=`${sdn}/members/`,
- widget-members='sib-form-multiple-dropdown',
- range-members=`${sdn}/members/`
- )
diff --git a/src/page-channel-edit.pug b/src/page-channel-edit.pug
deleted file mode 100644
index 9244226..0000000
--- a/src/page-channel-edit.pug
+++ /dev/null
@@ -1,7 +0,0 @@
-#channel-edit(style='display: none')
- sib-form(
- range-owner=`${sdn}/members/`,
- widget-members='sib-form-multiple-dropdown',
- range-members=`${sdn}/members/`,
- bind-resources=''
- )
diff --git a/src/page-channel-profile.pug b/src/page-channel-profile.pug
deleted file mode 100644
index 16dcde1..0000000
--- a/src/page-channel-profile.pug
+++ /dev/null
@@ -1,36 +0,0 @@
-script.
- document.addEventListener('WebComponentsReady', function(event) {
- class HDAppMember extends SIBWidget {
- get template() {
- return `
-
-
-
- `;
- }
-
- render() {
- store.get(this.value).then( (value) => {
- this._value = value;
- this.innerHTML = this.template;
- });
- }
- }
- customElements.define("hdapp-member", HDAppMember);
- });
-
-#channel-profile(style='display: none')
- sib-display(
- data-fields='name, description, owner',
- widget-owner='hdapp-member',
- bind-resources=''
- )
- h2.section.skills Participants
- sib-display(
- id-suffix='members',
- data-fields='avatar, user',
- widget-avatar='sib-display-img',
- widget-user='hdapp-userinfo',
- bind-resources=''
- )
-
diff --git a/src/page-channel.pug b/src/page-channel.pug
deleted file mode 100644
index 859b65f..0000000
--- a/src/page-channel.pug
+++ /dev/null
@@ -1,15 +0,0 @@
-#channel(style='display: none')
- sib-router#channel-router(default-route='channel-profile')
- sib-route(name='channel-chat')
- div Chat
- sib-route(name='channel-profile')
- div Info
- sib-route(name='channel-edit')
- div Éditer
- sib-route(name='channel-create')
- div Nouveau
- #network-views-container
- include page-channel-chat.pug
- include page-channel-profile.pug
- include page-channel-edit.pug
- include page-channel-create.pug
diff --git a/src/page-channels.pug b/src/page-channels.pug
deleted file mode 100644
index 70d99f5..0000000
--- a/src/page-channels.pug
+++ /dev/null
@@ -1,7 +0,0 @@
-#channels(style='display: none')
- sib-display#channels-list(
- data-src=`${sdn}/channels/`,
- data-fields='name, description',
- search-fields='name, description',
- next='channel'
- )
diff --git a/src/page-job-offers.pug b/src/page-job-offers.pug
index 119aa34..04d5220 100644
--- a/src/page-job-offers.pug
+++ b/src/page-job-offers.pug
@@ -27,9 +27,10 @@ script.
});
div
+
h1 New offers
- span // Here you can find and post offers
- sib-display#offers-list(
+ span Here you can find and post offers
+ sib-display#offers-list.limiter(
data-src=`${sdn}/job-offers/`,
data-fields='author, title, description, skills',
set-searchset='title, description',
diff --git a/src/page-member-chat.pug b/src/page-member-chat.pug
index 92f71ee..cb5edf3 100644
--- a/src/page-member-chat.pug
+++ b/src/page-member-chat.pug
@@ -1,2 +1,2 @@
-#member-chat.chat-view(style='display: none', bind-resources='')
- sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources='')
+#member-chat.chat-view(bind-resources)
+ sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources)
diff --git a/src/page-member-edit.pug b/src/page-member-edit.pug
index 598a586..7898657 100644
--- a/src/page-member-edit.pug
+++ b/src/page-member-edit.pug
@@ -15,17 +15,17 @@
customElements.define("ldp-form-img-upload", LDPFormImgUpload);
widget-avatar="ldp-form-img-upload"
-#member-edit(style='display: none')
- label.d-none(for='avatar-input')
- img#avatar-preview(src='', style='width: 100%;')
- input#avatar-input.d-none(accept='image/*', name='avatar', value='', type='file')
- sib-form.edit-form(
- data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website',
- widget-user='hdapp-usereditinfo',
- range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown',
- range-skills=`${sdn}/skills/`,
- bind-resources=''
- )
+label.d-none(for='avatar-input')
+ img#avatar-preview(src='', style='width: 100%;')
+input#avatar-input.d-none(accept='image/*', name='avatar', value='', type='file')
+sib-form.edit-form(
+ data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website',
+ widget-user='hdapp-usereditinfo',
+ range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown',
+ range-skills=`${sdn}/skills/`,
+ bind-resources
+)
+
#crop-modal
.crop-wrapper
img#crop-preview(src='')
diff --git a/src/page-member-profile.pug b/src/page-member-profile.pug
index a8ace40..fe21123 100644
--- a/src/page-member-profile.pug
+++ b/src/page-member-profile.pug
@@ -1,13 +1,12 @@
-#member-profile(style='display: none')
- sib-display#member-info(
- data-fields='header, cell, number, roles, website, skills',
- set-header='avatar, user, pseudonym, bio'
- set-pseudonym='before-pseudo, pseudo'
- widget-avatar='sib-display-img',
- widget-user='hdapp-userinfo',
- widget-cell='hdapp-usercell',
- widget-number='sib-display-tel',
- widget-roles='sib-display-lookuplist',
- widget-skills='sib-display-lookuplist',
- bind-resources=''
- )
+sib-display#member-info(
+ data-fields='header, cell, role, email, tel, roles, website, skills',
+ set-header='avatar, user, pseudonym, bio',
+ set-pseudonym='before-pseudo, pseudo',
+ widget-avatar='sib-display-img',
+ widget-user='hdapp-userinfo',
+ widget-cell='hdapp-usercell',
+ widget-number='sib-display-tel',
+ widget-roles='sib-display-lookuplist',
+ widget-skills='sib-display-lookuplist',
+ bind-resources
+)
diff --git a/src/page-member.pug b/src/page-member.pug
index 18946ae..d2724ae 100644
--- a/src/page-member.pug
+++ b/src/page-member.pug
@@ -1,12 +1,18 @@
-#member(style='display: none')
- sib-router#member-router(default-route='member-profile')
- sib-route(name='member-chat')
- div Chat
- sib-route(name='member-profile')
- div Voir
- sib-route(name='member-edit')
- div Éditer
- #member-views-container
- include page-member-chat.pug
- include page-member-profile.pug
- include page-member-edit.pug
+
+sib-router#member-router(default-route='member-chat')
+ sib-route(name='member-chat')
+ div Chat
+ sib-route(name='member-profile')
+ div Voir
+ sib-route(name='member-edit')
+ div Éditer
+#member-views-container
+ sib-trigger(next="members" class="back") Back to directory
+ .limiter
+ #member-chat
+ include page-member-chat.pug
+ #member-profile
+ include page-member-profile.pug
+ #member-edit
+ include page-member-edit.pug
+mucreokyordoriptyis7
\ No newline at end of file
diff --git a/src/page-project-chat.pug b/src/page-project-chat.pug
index e2aebf9..395fadb 100644
--- a/src/page-project-chat.pug
+++ b/src/page-project-chat.pug
@@ -1,2 +1,2 @@
-#project-chat.chat-view(style='display: none', bind-resources='')
- sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources='')
+#project-chat.chat-view
+ sib-chat(data-authentication='login', data-auto-login='true', data-bosh-service-url='https://jabber.happy-dev.fr/http-bind/', data-debug='false', data-locales-url='en', bind-resources)
diff --git a/src/page-project-create.pug b/src/page-project-create.pug
index 69a9607..0bc1f91 100644
--- a/src/page-project-create.pug
+++ b/src/page-project-create.pug
@@ -1,4 +1,4 @@
-#project-create(style='display: none')
+#project-create
sib-form(
data-src=`${sdn}/projects/`,
range-client=`${sdn}/clients/`,
diff --git a/src/page-project-edit.pug b/src/page-project-edit.pug
index dd6c902..df14b24 100644
--- a/src/page-project-edit.pug
+++ b/src/page-project-edit.pug
@@ -1,7 +1,7 @@
-#project-edit(style='display: none')
+#project-edit
sib-form(
range-client=`${sdn}/clients/`,
widget-team='sib-form-multiple-dropdown',
range-team=`${sdn}/members/`,
- bind-resources=''
+ bind-resources
)
diff --git a/src/page-project-profile.pug b/src/page-project-profile.pug
index 2ac5023..d0a5a55 100644
--- a/src/page-project-profile.pug
+++ b/src/page-project-profile.pug
@@ -1,9 +1,9 @@
-#project-profile(style='display: none')
+#project-profile
sib-display(
data-fields='title, description, client',
set-title='number, name'
widget-client='hdapp-client',
- bind-resources=''
+ bind-resources
)
h3 Team
sib-display.members-list-condensed(
@@ -12,5 +12,5 @@
widget-avatar='sib-display-img',
widget-user='hdapp-userinfo',
next='member',
- bind-resources=''
+ bind-resources
)
diff --git a/src/page-project.pug b/src/page-project.pug
index ab0c0b4..91f4703 100644
--- a/src/page-project.pug
+++ b/src/page-project.pug
@@ -1,15 +1,14 @@
-#project(style='display: none')
- sib-router#project-router(default-route='project-profile')
- sib-route(name='project-chat')
- div Chat
- sib-route(name='project-profile')
- div Voir
- sib-route(name='project-edit')
- div Éditer
- sib-route(name='project-create')
- div Nouveau
- #project-views-container
- include page-project-chat.pug
- include page-project-profile.pug
- include page-project-edit.pug
- include page-project-create.pug
+sib-router#project-router(default-route='project-chat')
+ sib-route(name='project-chat')
+ div Chat
+ sib-route(name='project-profile')
+ div Voir
+ sib-route(name='project-edit')
+ div Éditer
+ sib-route(name='project-create')
+ div Nouveau
+#project-views-container
+ include page-project-chat.pug
+ include page-project-profile.pug
+ include page-project-edit.pug
+ include page-project-create.pug
diff --git a/src/page-projects.pug b/src/page-projects.pug
index cc19e5a..880d10b 100644
--- a/src/page-projects.pug
+++ b/src/page-projects.pug
@@ -16,7 +16,7 @@ script.
customElements.define("hdapp-client", HDAppClient);
});
-#projects(style='display: none')
+#projects
h1 Projects
sib-display(
data-src=`${sdn}/projects/`,
diff --git a/src/scripts/hd-app.js b/src/scripts/hd-app.js
index a38a099..9d3c015 100644
--- a/src/scripts/hd-app.js
+++ b/src/scripts/hd-app.js
@@ -4,7 +4,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
const searchBar = document.querySelector("#search-bar");
const searchView = document.querySelector("#search-view");
const searchInput = searchBar.querySelector("#search-input");
- const btnToggle = document.querySelector(".btn-toggle");
+ const btnToggle = document.querySelector("#button-toggle");
// Shortcuts
diff --git a/src/scripts/index.js b/src/scripts/index.js
index 482a879..78b0c18 100644
--- a/src/scripts/index.js
+++ b/src/scripts/index.js
@@ -1,7 +1,6 @@
document.addEventListener('DOMContentLoaded', function(event) {
- // Constants declaration
const navBar = document.querySelector('#navbar');
- const btnToggle = document.querySelector('.btn-toggle');
+ const btnToggle = document.querySelector('#button-toggle');
if (!navBar || !btnToggle) return;
btnToggle.addEventListener('click', e => {
diff --git a/src/styles/content.scss b/src/styles/content.scss
index fec8bf4..9d167ff 100644
--- a/src/styles/content.scss
+++ b/src/styles/content.scss
@@ -1,6 +1,7 @@
// job offers
#offers-list {
> div {
+ display: none;
> sib-display {
display: block;
margin: 1em 0;
@@ -10,88 +11,66 @@
&:nth-child(odd) {
background-color: $color-white;
}
- }
- }
-}
-
-// members
-
-%member {
- display: grid;
- margin-top: 1em;
- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
- grid-gap: 1em;
- label {
- display: none;
- }
- > sib-display {
- display: block;
- position: relative;
- background-color: $color-white;
- @extend %shadow;
- padding: 0.5em;
- cursor: pointer;
-
- &::before,
- &::after {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- transform: scale3d(0, 0, 1);
- transition: transform 0.3s ease-out 0s;
- background: #eac1;
- content: '';
- pointer-events: none;
- }
-
- &::before {
- transform-origin: left top;
- }
-
- &::after {
- transform-origin: right bottom;
-
- background: #ace1;
- }
-
- &:hover,
- &:focus {
- &::before,
- &::after {
- transform: scale3d(1, 1, 1);
+ sib-display-div[name=title]{
+ display: block;
+ @extend h1;
+ background-color: red;
}
}
}
}
-#profiles-list {
- display: block;
- sib-form {
- display: block;
- input[type='reset'] {
- display: none;
- }
- }
- div[name='header'] {
- border-top: 2em solid $color-grey-light;
- border-bottom: 1px solid $color-grey-light;
- padding-bottom: 1em;
- margin-bottom: 1em;
- text-align: center;
- }
+// chat
- > div {
- @extend %member;
+.chat-view {
+ padding: 1em;
+ border: 1px dashed green;
+ position: relative;
+ min-height: 300px;
+ > sib-chat {
+ @include pos();
}
+}
+
+
+.members-list-condensed {
+ display: block;
+ img {
+ width: 50px;
+ height: 50px;
+ border-radius: 100%;
+ object-fit: cover;
+ object-position: top;
+ }
+ label {
+ display: none;
+ }
+ > div > sib-display > div {
+ display: flex;
+ }
+ ul {
+ padding-left: 1em;
+ }
+}
+
+
+// member-profile && member
+sib-display#member-info,
+#profiles-list>div>sib-display{
+ display: block;
+ position: relative;
+ background-color: $color-white;
+ @extend %shadow;
+ padding: 1em;
+ cursor: pointer;
sib-display-img {
+ $width: 55%;
display: block;
position: relative;
- width: 80%;
+ width: $width;
+ padding-bottom: $width;
height: 0;
- padding-bottom: 80%;
- margin: 10%;
+ margin: 2em auto;
img {
display: block;
position: absolute;
@@ -102,45 +81,15 @@
object-position: center;
}
}
+}
- hdapp-userinfo {
- display: block;
- color: $color-black;
- font-size: 1.1em;
- margin: 0.5em;
- ul,
- li {
- display: block;
- margin: 0;
- padding: 0;
- list-style: none;
- }
- }
-
- div[name='pseudonym'] {
- font-size: 0.8em;
- div {
- display: inline;
- }
- }
-}
-sib-display-lookuplist[name='skills'] {
- ul,
- li {
- display: block;
- margin: 0;
- padding: 0;
- list-style: none;
- }
- ul {
- display: flex;
- flex-wrap: wrap;
- margin: 0 -0.25em;
- }
- li {
- padding: 0.5em 1em;
- border: 1px solid;
- border-radius: 0.25em;
- margin: 0.25em;
+#profiles-list {
+ display: block;
+ > div {
+ display: grid;
+ margin-top: 1em;
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+ grid-gap: 1em;
}
}
+
diff --git a/src/styles/functions.scss b/src/styles/functions.scss
index e69de29..ab0c014 100644
--- a/src/styles/functions.scss
+++ b/src/styles/functions.scss
@@ -0,0 +1 @@
+//
\ No newline at end of file
diff --git a/src/styles/icons.scss b/src/styles/icons.scss
index 77bc56c..48ea2c5 100644
--- a/src/styles/icons.scss
+++ b/src/styles/icons.scss
@@ -258,6 +258,8 @@ $icons: (
}
}
@mixin icon($code) {
- @extend %icon;
- @extend .icon-#{$code};
+ &:before {
+ @extend %icon;
+ @extend .icon-#{$code};
+ }
}
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 0b61e6f..f4d6f8a 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -1,9 +1,14 @@
@charset "UTF-8";
+@import 'functions';
+@import '../../node_modules/include-media/dist/include-media';
@import 'icons';
@import 'variables';
-@import 'functions';
@import 'mixins';
@import 'main';
+@import 'form';
@import 'content';
+
+@import 'members';
@import 'menu';
+
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 5f930f5..cbb7313 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -11,21 +11,83 @@ html {
color: $color-grey;
}
+html,
+body {
+ height: 100%;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ color: $color-black;
+ font-weight: 600;
+ margin: 0.67em 0;
+ span {
+ font-weight: 400;
+ padding-left: 0.5em;
+ &:before {
+ content: '// ';
+ }
+ }
+}
+
+h1 {
+ font-size: 1.23em;
+}
+h2 {
+ font-size: 1.16em;
+}
+h3 {
+ font-size: 1.12em;
+}
+
+.debug {
+ outline: 2px dotted red;
+}
+
#header {
background-color: $color-white;
+ color: $color-black;
position: relative;
@include border-shadow(bottom);
border: solid $color-white;
border-width: 1px 0;
+ display: flex;
+ align-items: center;
+ padding: 1em 0;
+ > * {
+ padding: 0 1rem;
+ }
+}
+
+#button-toggle {
+ @include icon('menu');
+ display: none;
+ color: $color-black;
+ font-size: 2em;
+ padding: 0.72em;
+ cursor: pointer;
}
#logo {
- margin: 1.4em;
+ flex: 1 1 0px;
}
-html,
-body {
- height: 100%;
+#notification {
+ @include icon(bell);
+ font-size: 1.5em;
+}
+
+#profile {
+ > * {
+ vertical-align: middle;
+ }
+ img {
+ margin-right: 0.5em;
+ }
}
#subContainer {
@@ -37,25 +99,79 @@ body {
flex: 1 1 0px;
}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
- color: $color-black;
+.limiter{
+ display: block;
+ max-width: 650px;
}
+/* sub menu (right menu) */
-h1{
- font-size: 1.23em;
- span{
- font-weight: normal;
+#mainContainer > div {
+ display: flex;
+ flex-direction: row-reverse;
+ align-items: flex-start;
+ > sib-router {
+ display: block;
+ background-color: #ccc;
+ sib-route {
+ display: block;
+ > div {
+ position: relative;
+ padding: 1em 2em;
+ border-bottom: 1px solid #888;
+ }
+ &[active] {
+ font-weight: bold;
+ > div:before {
+ content: '<';
+ position: absolute;
+ transform: translateX(-150%);
+ }
+ }
+ }
+ }
+ > div {
+ margin: 2.6em;
+ flex: 1 1 0px;
}
}
-h2{
- font-size: 1.16em;
-}
-h3{
- font-size: 1.12em;
+
+#search-bar > div {
+ position: relative;
}
+#search-icon {
+ pointer-events: none;
+}
+
+#search-icon,
+#close-search-icon {
+ position: absolute;
+ right: 0.4em;
+ top: 50%;
+ transform: translateY(-50%);
+ margin: auto;
+ display: block;
+}
+#search-input {
+ -webkit-appearance: textfield;
+ border-radius: 10em;
+ padding: 0.4em 0.8em;
+ border: 1px solid $color-grey;
+ & ~ #close-search-icon {
+ opacity: 0;
+ }
+ &:focus {
+ & ~ #close-search-icon {
+ opacity: 1;
+ }
+ & ~ #search-icon {
+ visibility: hidden;
+ }
+ }
+}
+
+sib-trigger.back {
+ display: block;
+ @include icon('arrow-left');
+ @extend h1;
+}
diff --git a/src/styles/menu.scss b/src/styles/menu.scss
index 168ec6d..8cef1ee 100644
--- a/src/styles/menu.scss
+++ b/src/styles/menu.scss
@@ -1,19 +1,6 @@
// #navbar{}
// #navbar-router{}
-.btn-toggle {
- @include icon('menu');
- display: none;
- position: absolute;
- top: 0;
- left: 0;
- background-color: $color-white;
- color: $color-black;
- font-size: 2em;
- padding: 0.72em;
- cursor: pointer;
-}
-
#navbar {
background-color: $color-white;
color: $color-grey;
@@ -28,8 +15,8 @@
@include border-shadow(right);
}
-@media (max-width: 32rem) {
- .btn-toggle {
+@include media('width div {
- display: flex;
- flex-direction: row-reverse;
- align-items: flex-start;
- > sib-router {
- display: block;
- background-color: #ccc;
- sib-route {
- display: block;
- > div {
- position: relative;
- padding: 1em 2em;
- border-bottom: 1px solid #888;
- }
- &[active] {
- font-weight: bold;
- > div:before {
- content: '<';
- position: absolute;
- transform: translateX(-150%);
- }
- }
- }
- }
- > div {
- margin: 2.6em;
- flex: 1 1 0px;
- }
-}
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 5f960a8..2e7a115 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -1,3 +1,4 @@
+// colors
$color-white: #fff;
$color-black: #36383b;
$color-grey: #898f95;
@@ -6,16 +7,12 @@ $color-grey-light: #f0f3f6;
$color-yellow: #ffb700;
$color-yellow-light: #ffd759;
-%button {
- border-radius: 100em;
+%shadow {
+ box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
}
-%button-yellow {
- @extend %button;
- background-color: $color-yellow;
- color: $color-white;
-}
-
-%shadow{
- box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.05);
-}
\ No newline at end of file
+$breakpoints: (
+ phone: 480px,
+ tablet: 768px,
+ desktop: 1024px,
+);
diff --git a/src/variables.pug b/src/variables.pug
deleted file mode 100644
index dd28afe..0000000
--- a/src/variables.pug
+++ /dev/null
@@ -1,2 +0,0 @@
-- var sdn = process.env.SDN || 'http://127.0.0.1:8000'
-- var cdn = process.env.CDN || 'https://cdn.happy-dev.fr'
\ No newline at end of file
diff --git a/www/img/logo.png b/www/img/logo.png
deleted file mode 100644
index d47b120..0000000
Binary files a/www/img/logo.png and /dev/null differ
diff --git a/www/lib/sib-core b/www/lib/sib-core
index ffe4cdc..be42b1c 160000
--- a/www/lib/sib-core
+++ b/www/lib/sib-core
@@ -1 +1 @@
-Subproject commit ffe4cdc86041a32e8a2cc7dbd60aafc9edd1eaf5
+Subproject commit be42b1cb02524a69e7009ee9f4a1144be29ed1e8