Import css for bootstrap, use by nav.mageia.org

This version is build via scss to workaround webapp conf (forum, wiki, etc)

3 files changed, 164 insertions, 2 deletions

diff --git a/css/bootstrap_nav.css b/css/bootstrap_nav.css
new file mode 100644
index 0000000..b6a4bf6
--- /dev/null
+++ b/css/bootstrap_nav.css
@@ -0,0 +1,9 @@
+/*!
+ * WARNING: These bootstrap css class are generated via scss. 
+ * check at git http://gitweb.mageia.org/web/nav/tree/lib.
+ */.mganav{/*!
+ * Bootstrap v4.0.0-alpha.6 (https://getbootstrap.com)
+ * Copyright 2011-2017 The Bootstrap Authors
+ * Copyright 2011-2017 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */}.mganav .fade{opacity:0;transition:opacity 0.15s linear}.mganav .fade.show{opacity:1}.mganav .collapse{display:none}.mganav .collapse.show{display:block}.mganav tr.collapse.show{display:table-row}.mganav tbody.collapse.show{display:table-row-group}.mganav .collapsing{position:relative;height:0;overflow:hidden;transition:height 0.35s ease}.mganav .dropup,.mganav .dropdown{position:relative}.mganav .dropdown-toggle::after{display:inline-block;width:0;height:0;margin-left:.3em;vertical-align:middle;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-left:.3em solid transparent}.mganav .dropdown-toggle:focus{outline:0}.mganav .dropup .dropdown-toggle::after{border-top:0;border-bottom:.3em solid}.mganav .dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:10rem;padding:.5rem 0;margin:.125rem 0 0;font-size:1rem;color:#292b2c;text-align:left;list-style:none;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,0.15);border-radius:.25rem}.mganav .dropdown-divider{height:1px;margin:.5rem 0;overflow:hidden;background-color:#eceeef}.mganav .dropdown-item{display:block;width:100%;padding:3px 1.5rem;clear:both;font-weight:normal;color:#292b2c;text-align:inherit;white-space:nowrap;background:none;border:0}.mganav .dropdown-item:focus,.mganav .dropdown-item:hover{color:#1d1e1f;text-decoration:none;background-color:#f7f7f9}.mganav .dropdown-item.active,.mganav .dropdown-item:active{color:#fff;text-decoration:none;background-color:#0275d8}.mganav .dropdown-item.disabled,.mganav .dropdown-item:disabled{color:#636c72;cursor:not-allowed;background-color:transparent}.mganav .show>.dropdown-menu{display:block}.mganav .show>a{outline:0}.mganav .dropdown-menu-right{right:0;left:auto}.mganav .dropdown-menu-left{right:auto;left:0}.mganav .dropdown-header{display:block;padding:.5rem 1.5rem;margin-bottom:0;font-size:.875rem;color:#636c72;white-space:nowrap}.mganav .dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:990}.mganav .dropup .dropdown-menu{top:auto;bottom:100%;margin-bottom:.125rem}.mganav .nav{display:flex;padding-left:0;margin-bottom:0;list-style:none}.mganav .nav-link{display:block;padding:0.5em 1em}.mganav .nav-link:focus,.mganav .nav-link:hover{text-decoration:none}.mganav .nav-link.disabled{color:#636c72;cursor:not-allowed}.mganav .nav-tabs{border-bottom:1px solid #ddd}.mganav .nav-tabs .nav-item{margin-bottom:-1px}.mganav .nav-tabs .nav-link{border:1px solid transparent;border-top-right-radius:.25rem;border-top-left-radius:.25rem}.mganav .nav-tabs .nav-link:focus,.mganav .nav-tabs .nav-link:hover{border-color:#eceeef #eceeef #ddd}.mganav .nav-tabs .nav-link.disabled{color:#636c72;background-color:transparent;border-color:transparent}.mganav .nav-tabs .nav-link.active,.mganav .nav-tabs .nav-item.show .nav-link{color:#464a4c;background-color:#fff;border-color:#ddd #ddd #fff}.mganav .nav-tabs .dropdown-menu{margin-top:-1px;border-top-right-radius:0;border-top-left-radius:0}.mganav .nav-pills .nav-link{border-radius:.25rem}.mganav .nav-pills .nav-link.active,.mganav .nav-pills .nav-item.show .nav-link{color:#fff;cursor:default;background-color:#0275d8}.mganav .nav-fill .nav-item{flex:1 1 auto;text-align:center}.mganav .nav-justified .nav-item{flex:1 1 100%;text-align:center}.mganav .tab-content>.tab-pane{display:none}.mganav .tab-content>.active{display:block}.mganav .navbar{position:relative;display:flex;flex-direction:column;padding:.5rem 1rem}.mganav .navbar-brand{display:inline-block;padding-top:.25rem;padding-bottom:.25rem;margin-right:1rem;font-size:1.25rem;line-height:inherit;white-space:nowrap}.mganav .navbar-brand:focus,.mganav .navbar-brand:hover{text-decoration:none}.mganav .navbar-nav{display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.mganav .navbar-nav .nav-link{padding-right:0;padding-left:0}.mganav .navbar-text{display:inline-block;padding-top:.425rem;padding-bottom:.425rem}.mganav .navbar-toggler{align-self:flex-start;padding:.25rem .75rem;font-size:1.25rem;line-height:1;background:transparent;border:1px solid transparent;border-radius:.25rem}.mganav .navbar-toggler:focus,.mganav .navbar-toggler:hover{text-decoration:none}.mganav .navbar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;content:"";background:no-repeat center center;background-size:100% 100%}.mganav .navbar-toggler-left{position:absolute;left:1rem}.mganav .navbar-toggler-right{position:absolute;right:1rem}@media (max-width: 575px){.mganav .navbar-toggleable .navbar-nav .dropdown-menu{position:static;float:none}.mganav .navbar-toggleable>.container{padding-right:0;padding-left:0}}@media (min-width: 576px){.mganav .navbar-toggleable{flex-direction:row;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable .navbar-nav{flex-direction:row}.mganav .navbar-toggleable .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}.mganav .navbar-toggleable>.container{display:flex;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable .navbar-collapse{display:flex !important;width:100%}.mganav .navbar-toggleable .navbar-toggler{display:none}}@media (max-width: 767px){.mganav .navbar-toggleable-sm .navbar-nav .dropdown-menu{position:static;float:none}.mganav .navbar-toggleable-sm>.container{padding-right:0;padding-left:0}}@media (min-width: 768px){.mganav .navbar-toggleable-sm{flex-direction:row;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-sm .navbar-nav{flex-direction:row}.mganav .navbar-toggleable-sm .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}.mganav .navbar-toggleable-sm>.container{display:flex;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-sm .navbar-collapse{display:flex !important;width:100%}.mganav .navbar-toggleable-sm .navbar-toggler{display:none}}@media (max-width: 991px){.mganav .navbar-toggleable-md .navbar-nav .dropdown-menu{position:static;float:none}.mganav .navbar-toggleable-md>.container{padding-right:0;padding-left:0}}@media (min-width: 992px){.mganav .navbar-toggleable-md{flex-direction:row;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-md .navbar-nav{flex-direction:row}.mganav .navbar-toggleable-md .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}.mganav .navbar-toggleable-md>.container{display:flex;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-md .navbar-collapse{display:flex !important;width:100%}.mganav .navbar-toggleable-md .navbar-toggler{display:none}}@media (max-width: 1199px){.mganav .navbar-toggleable-lg .navbar-nav .dropdown-menu{position:static;float:none}.mganav .navbar-toggleable-lg>.container{padding-right:0;padding-left:0}}@media (min-width: 1200px){.mganav .navbar-toggleable-lg{flex-direction:row;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-lg .navbar-nav{flex-direction:row}.mganav .navbar-toggleable-lg .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}.mganav .navbar-toggleable-lg>.container{display:flex;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-lg .navbar-collapse{display:flex !important;width:100%}.mganav .navbar-toggleable-lg .navbar-toggler{display:none}}.mganav .navbar-toggleable-xl{flex-direction:row;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-xl .navbar-nav .dropdown-menu{position:static;float:none}.mganav .navbar-toggleable-xl>.container{padding-right:0;padding-left:0}.mganav .navbar-toggleable-xl .navbar-nav{flex-direction:row}.mganav .navbar-toggleable-xl .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}.mganav .navbar-toggleable-xl>.container{display:flex;flex-wrap:nowrap;align-items:center}.mganav .navbar-toggleable-xl .navbar-collapse{display:flex !important;width:100%}.mganav .navbar-toggleable-xl .navbar-toggler{display:none}.mganav .navbar-light .navbar-brand,.mganav .navbar-light .navbar-toggler{color:rgba(0,0,0,0.9)}.mganav .navbar-light .navbar-brand:focus,.mganav .navbar-light .navbar-brand:hover,.mganav .navbar-light .navbar-toggler:focus,.mganav .navbar-light .navbar-toggler:hover{color:rgba(0,0,0,0.9)}.mganav .navbar-light .navbar-nav .nav-link{color:rgba(0,0,0,0.5)}.mganav .navbar-light .navbar-nav .nav-link:focus,.mganav .navbar-light .navbar-nav .nav-link:hover{color:rgba(0,0,0,0.7)}.mganav .navbar-light .navbar-nav .nav-link.disabled{color:rgba(0,0,0,0.3)}.mganav .navbar-light .navbar-nav .open>.nav-link,.mganav .navbar-light .navbar-nav .active>.nav-link,.mganav .navbar-light .navbar-nav .nav-link.open,.mganav .navbar-light .navbar-nav .nav-link.active{color:rgba(0,0,0,0.9)}.mganav .navbar-light .navbar-toggler{border-color:rgba(0,0,0,0.1)}.mganav .navbar-light .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0,0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")}.mganav .navbar-light .navbar-text{color:rgba(0,0,0,0.5)}.mganav .navbar-inverse .navbar-brand,.mganav .navbar-inverse .navbar-toggler{color:#fff}.mganav .navbar-inverse .navbar-brand:focus,.mganav .navbar-inverse .navbar-brand:hover,.mganav .navbar-inverse .navbar-toggler:focus,.mganav .navbar-inverse .navbar-toggler:hover{color:#fff}.mganav .navbar-inverse .navbar-nav .nav-link{color:rgba(255,255,255,0.5)}.mganav .navbar-inverse .navbar-nav .nav-link:focus,.mganav .navbar-inverse .navbar-nav .nav-link:hover{color:rgba(255,255,255,0.75)}.mganav .navbar-inverse .navbar-nav .nav-link.disabled{color:rgba(255,255,255,0.25)}.mganav .navbar-inverse .navbar-nav .open>.nav-link,.mganav .navbar-inverse .navbar-nav .active>.nav-link,.mganav .navbar-inverse .navbar-nav .nav-link.open,.mganav .navbar-inverse .navbar-nav .nav-link.active{color:#fff}.mganav .navbar-inverse .navbar-toggler{border-color:rgba(255,255,255,0.1)}.mganav .navbar-inverse .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")}.mganav .navbar-inverse .navbar-text{color:rgba(255,255,255,0.5)}
diff --git a/css/bootstrap_nav_theme.css b/css/bootstrap_nav_theme.css
new file mode 100644
index 0000000..5ad860e
--- /dev/null
+++ b/css/bootstrap_nav_theme.css
@@ -0,0 +1,152 @@
+/*from bootstrap.css*/
+.mganav .text-hide {
+    font: 0/0 a;
+    color: transparent;
+    text-shadow: none;
+    background-color: transparent;
+    border: 0;
+}
+.container {
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+@media (min-width: 576px) {
+  .container {
+    width: 540px;
+    max-width: 100%;
+  }
+}
+@media (min-width: 768px) {
+  .container {
+    width: 720px;
+    max-width: 100%;
+  }
+}
+@media (min-width: 992px) {
+  .container {
+    width: 960px;
+    max-width: 100%;
+  }
+}
+@media (min-width: 1200px) {
+  .container {
+    width: 1140px;
+    max-width: 100%;
+  }
+}
+.container-fluid {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+
+/* workaround for nav.mageia.org */
+.a,a:link {
+    text-decoration:none
+}
+.mganav {font-size:14px}
+/*hide text*/
+.mganav .navbar-brand {font: 0/0 a;}
+.navbar-nav {margin: 0}
+
+.mganav ul li {
+	list-style:none;
+}
+
+
+/* nav class */
+.navbar-brand {
+    width: 133px;
+    height: 40px;
+    background: url(//nav.mageia.org/css/mageia-logo-nav-3.svg)no-repeat;
+    background-size: contain;
+}
+.mganav, .mganav .navbar {
+    background-color: #f7f7f7;
+}
+#mgnav .nav-link:focus, #mgnav .nav-link:hover {
+    color: #2383C2;
+}
+.about #mgnav .about,
+.downloads #mgnav .nav-item .downloads,
+.community #mgnav .community,
+.blog #mgnav .community,
+.section-index #hmgn .community, /*forum*/
+.mediawiki #mgnav .wiki,
+.support #mgnav .support,
+.contribute #mgnav .contribute,
+.donate #mgnav .donate,
+.bugs-mageia-org #mgnav .contribute,
+.contrib #mgnav .contrib,
+.you #mgnav .you,
+.contact #mgnav .contact,
+.doc #mgnav .doc,
+#mgnavsub .nav-pills .nav-link.active {
+    font-weight: bold;
+    color: white;
+    text-shadow: 0 0 3px #222;
+    background: #2383C2;
+    background: -webkit-linear-gradient(top, #3494D3 0%, #2383C2 50%);
+    background: -moz-linear-gradient(top, #3494D3 0%, #2383C2 50%);
+    background: -o-linear-gradient(top, #3494D3 0%, #2383C2 50%);
+    background: linear-gradient(top, #3494D3 0%, #2383C2 50%);
+    
+}
+
+/*nav height, on desktop*/
+@media (min-width: 992px) {
+    .navbar-toggleable-md .navbar-nav .nav-link{
+        padding: 1rem .5rem;
+    }
+    #mgnav {
+        padding: 0px;
+    }
+}
+
+#mgnavtitle, /* deprecated */
+#mgnavt /* preferred */
+{
+    margin: 0;
+    padding: .7rem;
+    color: #fff;
+    text-shadow: 0 0 3px #222;
+    text-align: center;
+    background: #2383C2;
+    background: -webkit-linear-gradient(top, #2383C2 0%, #1272B1 50%);
+    background: -moz-linear-gradient(top, #2383C2 0%, #1272B1 50%);
+    background: -o-linear-gradient(top, #2383C2 0%, #1272B1 50%);
+    background: linear-gradient(top, #2383C2 0%, #1272B1 50%);
+}
+#mgnavt a { color: #fff; }
+
+/* allows to have a title + contextual sub menu */
+header#mgnavt { text-align: center; }
+#mgnavt h1 { font-size: 2rem; color: #fff; margin: 0; padding: 0; display: inline; }
+#mgnavt ul { font-size: 12px; margin: 0 0 0 2em; padding: 0; display: inline; }
+#mgnavt ul li { display: inline; margin: 0 0.8em; padding: 0; }
+#mgnavt ul li a { display: inline-block; text-decoration: none; }
+
+/*from all.css*/
+#mgnavsub ul {
+    margin: auto;
+    padding: 0pxx;
+}
+    
+/*
+https://github.com/iconic/open-iconic/blob/master/svg/globe.svg
+https://codepen.io/jakob-e/pen/doMoML
+*/
+.globe-icon:after{
+   content:'';
+   width: 1rem;
+   height: 1rem;
+   margin-left: 0.3rem;
+   display: inline-block;
+   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' opacity='0.4' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath d='M4 0C1.79 0 0 1.79 0 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 1c.33 0 .64.09.94.19-.21.2-.45.38-.41.56.04.18.69.13.69.5 0 .27-.42.35-.13.66.35.35-.64.98-.66 1.44-.03.83.84.97 1.53.97.42 0 .53.2.5.44-.54.77-1.46 1.25-2.47 1.25-.38 0-.73-.09-1.06-.22.22-.44-.28-1.31-.75-1.59-.23-.23-.72-.14-1-.25-.09-.27-.18-.54-.19-.84.03-.05.08-.09.16-.09.19 0 .45.38.59.34.18-.04-.74-1.31-.31-1.56.2-.12.6.39.47-.16-.12-.51.36-.28.66-.41.26-.11.45-.41.13-.59-.06-.03-.13-.1-.22-.19.45-.27.97-.44 1.53-.44zm2.31 1.09c.18.22.32.46.44.72v.03c-.04.07-.11.11-.22.22-.28.28-.32-.21-.44-.31-.13-.12-.6.02-.66-.13-.07-.18.5-.42.88-.53z'/%3E%3C/svg%3E");
+   background-size: 100%;
+   background-repeat: no-repeat;
+}
diff --git a/css/index.php b/css/index.php
index a7aafd6..e5d695b 100644
--- a/css/index.php
+++ b/css/index.php
@@ -28,7 +28,8 @@ $style = isset($_GET['s']) ? trim($_GET['s']) : null;
 		echo "/*if lang_from missing, add some space*/ #nav li:last-child { padding-right:143px }";
 	} 
 	else { 
-		echo str_replace('nav.mageia.org', $_SERVER['HTTP_HOST'], file_get_contents('source.css'));
-	} 
+               echo str_replace('nav.mageia.org', $_SERVER['HTTP_HOST'], file_get_contents('bootstrap_nav.css'));
+               echo str_replace('nav.mageia.org', $_SERVER['HTTP_HOST'], file_get_contents('bootstrap_nav_theme.css'));
+       }