From 51ccde0c0e3750ed5a49a725f4d44b53e8f4b29d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Cl=C3=A9ment?= Date: Fri, 5 Oct 2018 11:37:48 +0200 Subject: [PATCH] update --- Makefile | 19 ++-- package-lock.json | 5 ++ package.json | 1 + server.js | 2 +- src/dependencies.pug | 20 +++-- src/index.pug | 17 ++-- src/menu.pug | 7 +- src/page-channel-chat.pug | 2 - src/page-channel-create.pug | 7 -- src/page-channel-edit.pug | 7 -- src/page-channel-profile.pug | 36 -------- src/page-channel.pug | 15 ---- src/page-channels.pug | 7 -- src/page-job-offers.pug | 5 +- src/page-member-chat.pug | 4 +- src/page-member-edit.pug | 22 ++--- src/page-member-profile.pug | 25 +++--- src/page-member.pug | 30 ++++--- src/page-project-chat.pug | 4 +- src/page-project-create.pug | 2 +- src/page-project-edit.pug | 4 +- src/page-project-profile.pug | 6 +- src/page-project.pug | 29 +++--- src/page-projects.pug | 2 +- src/scripts/hd-app.js | 2 +- src/scripts/index.js | 3 +- src/styles/content.scss | 169 ++++++++++++----------------------- src/styles/functions.scss | 1 + src/styles/icons.scss | 6 +- src/styles/index.scss | 7 +- src/styles/main.scss | 156 +++++++++++++++++++++++++++----- src/styles/menu.scss | 52 +---------- src/styles/variables.scss | 19 ++-- src/variables.pug | 2 - www/img/logo.png | Bin 4018 -> 0 bytes www/lib/sib-core | 2 +- 36 files changed, 328 insertions(+), 369 deletions(-) delete mode 100644 src/page-channel-chat.pug delete mode 100644 src/page-channel-create.pug delete mode 100644 src/page-channel-edit.pug delete mode 100644 src/page-channel-profile.pug delete mode 100644 src/page-channel.pug delete mode 100644 src/page-channels.pug delete mode 100644 src/variables.pug delete mode 100644 www/img/logo.png 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 d47b12090ca2650956f554ac22fccb7253c2aa2a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4018 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 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