diff --git a/.gitmodules b/.gitmodules
index 828da28..e07c1ab 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,3 +1,6 @@
[submodule "dist/lib/ldp-display"]
path = dist/lib/ldp-display
url = git@git.happy-dev.fr:happy-dev/ldp-display.git
+[submodule "dist/lib/webcomponentsjs"]
+ path = dist/lib/webcomponentsjs
+ url = https://github.com/webcomponents/webcomponentsjs
diff --git a/dist/lib/webcomponents-loader.js b/dist/lib/webcomponents-loader.js
deleted file mode 100644
index ff0c6fd..0000000
--- a/dist/lib/webcomponents-loader.js
+++ /dev/null
@@ -1,74 +0,0 @@
-/**
- * @license
- * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
- * This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
- * The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
- * The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
- * Code distributed by Google as part of the polymer project is also
- * subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
- */
-
-(function() {
- 'use strict';
- // global for (1) existence means `WebComponentsReady` will file,
- // (2) WebComponents.ready == true means event has fired.
- window.WebComponents = window.WebComponents || {};
- var name = 'webcomponents-loader.js';
- // Feature detect which polyfill needs to be imported.
- var polyfills = [];
- if (!('import' in document.createElement('link'))) {
- polyfills.push('hi');
- }
- if (!('attachShadow' in Element.prototype && 'getRootNode' in Element.prototype) ||
- (window.ShadyDOM && window.ShadyDOM.force)) {
- polyfills.push('sd');
- }
- if (!window.customElements || window.customElements.forcePolyfill) {
- polyfills.push('ce');
- }
- // NOTE: any browser that does not have template or ES6 features
- // must load the full suite (called `lite` for legacy reasons) of polyfills.
- if (!('content' in document.createElement('template')) || !window.Promise || !Array.from ||
- // Edge has broken fragment cloning which means you cannot clone template.content
- !(document.createDocumentFragment().cloneNode() instanceof DocumentFragment)) {
- polyfills = ['lite'];
- }
-
- if (polyfills.length) {
- var script = document.querySelector('script[src*="' + name +'"]');
- var newScript = document.createElement('script');
- // Load it from the right place.
- var replacement = 'webcomponents-' + polyfills.join('-') + '.js';
- var url = script.src.replace(name, replacement);
- newScript.src = url;
- // NOTE: this is required to ensure the polyfills are loaded before
- // *native* html imports load on older Chrome versions. This *is* CSP
- // compliant since CSP rules must have allowed this script to run.
- // In all other cases, this can be async.
- if (document.readyState === 'loading' && ('import' in document.createElement('link'))) {
- document.write(newScript.outerHTML);
- } else {
- document.head.appendChild(newScript);
- }
- } else {
- // Ensure `WebComponentsReady` is fired also when there are no polyfills loaded.
- // however, we have to wait for the document to be in 'interactive' state,
- // otherwise a rAF may fire before scripts in
-
- var fire = function() {
- requestAnimationFrame(function() {
- window.WebComponents.ready = true;
- document.dispatchEvent(new CustomEvent('WebComponentsReady', {bubbles: true}));
- });
- };
-
- if (document.readyState !== 'loading') {
- fire();
- } else {
- document.addEventListener('readystatechange', function wait() {
- fire();
- document.removeEventListener('readystatechange', wait);
- });
- }
- }
-})();
diff --git a/dist/lib/webcomponentsjs b/dist/lib/webcomponentsjs
new file mode 160000
index 0000000..bdd5203
--- /dev/null
+++ b/dist/lib/webcomponentsjs
@@ -0,0 +1 @@
+Subproject commit bdd5203993f19ca08568638afd96f8f9c3959ea1
diff --git a/index.php b/index.php
index 9a33bde..d189ffb 100644
--- a/index.php
+++ b/index.php
@@ -18,7 +18,7 @@
-
+
diff --git a/src/scss/_menu.scss b/src/scss/_menu.scss
index c7e237b..e8373ae 100644
--- a/src/scss/_menu.scss
+++ b/src/scss/_menu.scss
@@ -1,100 +1,18 @@
-.menu ldp-route {
- display: block;
- font-size: 1.2em;
- text-decoration: none;
- line-height: 2.5em;
- color: #666;
- padding: 0.5em;
- margin: auto;
- padding-left: 20px;
- transition: background-color 0.3s;
- position: relative;
+#navbarSupportedContent {
+ ldp-route {
+ color: white;
+ cursor: pointer;
+ }
+ ldp-route:hover {
+ text-decoration: underline;
+ }
}
-/* Fait office de border-bottom */
-.menu ldp-route::after {
- content: "";
- background: #f1f1f1;
- position: absolute;
- bottom: -1px;
- left: 10px;
- width: 80%;
- height: 1px;
-}
-
-.menu ldp-route:hover {
- cursor: pointer;
- color: #000;
- background-color: darkgrey;
-}
-.menu ldp-route[active] {
- cursor: pointer;
- /* color: #000; */
- background-color: aliceblue;
-}
-
-.menu ldp-route:hover {
- cursor: pointer;
- color: #000;
- background-color: darkgrey;
-}
-
-.menu {
- border-right: 0.5px solid #ccc;
- max-width: 275px;
- min-width: 125px;
- padding: 0;
-}
-
-.menu ldp-router {
- padding: 10px 0;
-}
-
-#menu-title {
- font-size: 2em;
- /* margin-left: 10px; */
- /* pas top centrer sur peite largeur, comment faire sans margin-left ? */
- margin-right: 2px;
- font-weight: bold;
- font-family: 'Righteous', cursive;
- display: flex;
- justify-content: center;
-}
-
-#menu-placeholder {
- display: flex;
- justify-content: center;
- overflow: hidden;
- margin: 25px 10px 0 10px;
- background-color: #666666;
-}
-
-@media only screen and (max-width: 767px) {
- #menu-placeholder {
- display: none;
- }
- .menu {
- border-right: none;
- max-width: none;
- }
- .menu ldp-router {
- display: flex;
- flex-wrap: wrap;
- padding: 0;
- }
- .menu ldp-route {
- padding-left: 0.5em;
- }
- ldp-route:hover,
- .used {
- background: transparent;
- }
-}
-
-@media only screen and (max-height: 800px) and (min-width: 767px) {
- .menu ldp-route {
- padding: 0;
- padding-left: 20px;
+@media (min-width: 768px) {
+ #navbarSupportedContent {
+ ldp-route {
+ margin: 0px 10px;
}
+ }
}