/*
Global Settings
*/
-$body-font-family: Prompt, sans-serif;
+$family-sans-serif: Prompt, sans-serif;
// Colour Palette
-$foundation-palette: (
- primary: #ff2e53,
- secondary: #767676,
- success: #3adb76,
- warning: #e7e247,
- alert: #cc4b37,
-);
+$primary: #ff2e53;
+$green: #3adb76;
+$yellow: #e7e247;
+$red: #cc4b47;
+
+/*
+ Import Bulma
+*/
+@import "../../third-party/bulma/sass/base/_all";
+@import "../../third-party/bulma/sass/components/_all";
+@import "../../third-party/bulma/sass/elements/_all";
+@import "../../third-party/bulma/sass/form/_all";
+@import "../../third-party/bulma/sass/grid/_all";
+@import "../../third-party/bulma/sass/helpers/_all";
+@import "../../third-party/bulma/sass/layout/_all";
+@import "../../third-party/bulma/sass/utilities/_all";
// Import fonts
@import "fonts";
// Import icons
@import "icons";
-/*
- Import Foundation Sites
-*/
-@import "../../third-party/foundation-sites/scss/foundation";
-
-// Global styles
-@include foundation-global-styles;
-@include foundation-forms;
-@include foundation-typography;
-
-// Enable the XY Grid
-@include foundation-xy-grid-classes;
-
-// Generic components
-@include foundation-button;
-@include foundation-button-group;
-@include foundation-close-button;
-@include foundation-label;
-@include foundation-progress-bar;
-@include foundation-slider;
-@include foundation-switch;
-@include foundation-table;
-
-// Basic components
-@include foundation-badge;
-@include foundation-breadcrumbs;
-@include foundation-callout;
-@include foundation-card;
-@include foundation-dropdown;
-@include foundation-pagination;
-@include foundation-tooltip;
-
-// Containers
-@include foundation-accordion;
-@include foundation-media-object;
-@include foundation-orbit;
-@include foundation-responsive-embed;
-@include foundation-tabs;
-@include foundation-thumbnail;
-
-// Menu-based containers
-@include foundation-menu;
-@include foundation-menu-icon;
-@include foundation-accordion-menu;
-@include foundation-drilldown-menu;
-@include foundation-dropdown-menu;
-
-// Layout components
-@include foundation-off-canvas;
-@include foundation-reveal;
-@include foundation-sticky;
-@include foundation-title-bar;
-@include foundation-top-bar;
-
-// Helpers
-@include foundation-float-classes;
-@include foundation-flex-classes;
-@include foundation-visibility-classes;
-// @include foundation-prototype-classes;
-
/*
Custom CSS
*/
-
-.top-bar {
- margin-bottom: 1rem;
-}
</head>
<body>
- <div class="grid-container">
- <div class="grid-y">
- <div class="cell header">
- <div class="title-bar" data-responsive-toggle="main-menu" data-hide-for="medium">
- <button class="menu-icon" type="button" data-toggle="main-menu"></button>
- <div class="title-bar-title">{{ _("Menu") }}</div>
- </div>
+ <nav class="navbar is-primary" role="navigation" aria-label="main navigation">
+ <div class="navbar-brand">
+ <a class="navbar-item" href="/">
+ Pakfire Build Service
+ </a>
- <div class="top-bar" id="main-menu">
- <div class="top-bar-left">
- <ul class="dropdown menu" data-dropdown-menu>
- <li class="menu-text">{{ _("Pakfire Build Service") }}</li>
-
- {# Some important links... #}
- <li>
- <a href="/packages">{{ _("Packages") }}</a>
- </li>
- <li>
- <a href="/builds">{{ _("Builds") }}</a>
- </li>
-
- {# Dropdown menu with more stuff... #}
- <li>
- <a href="#">{{ _("More") }}</a>
-
- <ul class="menu vertical">
- <li>
- <a href="/distros">{{ _("Distributions") }}</a>
- </li>
- <li>
- <a href="/builders">{{ _("Builders") }}</a>
- </li>
- <li>
- <a href="/mirrors">{{ _("Mirrors") }}</a>
- </li>
- {% if current_user %}
- <li>
- <a href="/users">{{ _("Users") }}</a>
- </li>
- {% end %}
- <li>
- <a href="/log">{{ _("Log") }}</a>
- </li>
- </ul>
- </li>
- </ul>
- </div>
+ <a role="button" class="navbar-burger" aria-label="menu"
+ aria-expanded="false" data-target="navbarMainMenu">
+ <span aria-hidden="true"></span>
+ <span aria-hidden="true"></span>
+ <span aria-hidden="true"></span>
+ </a>
+ </div>
+
+ <div id="navbarMainMenu" class="navbar-menu">
+ <div class="navbar-start">
+ {# Some important links... #}
+
+ <a class="navbar-item" href="/packages">
+ {{ _("Packages") }}
+ </a>
- <div class="top-bar-right">
- <ul class="dropdown menu" data-dropdown-menu>
- <li>
- <form method="GET" action="/search">
- <input type="search" placeholder="Search" name="q">
- </form>
- </li>
-
- {% if current_user %}
- <li>
- <a href="#">{{ current_user }}</a>
-
- <ul class="menu vertical">
- <li>
- <a href="/users/{{ current_user.name }}">{{ _("My Profile") }}</a>
- </li>
- <li>
- <a href="/profile/builds">{{ _("My Builds") }}</a>
- </li>
- <li>
- <a href="/logout">{{ _("Log Out") }}</a>
- </li>
- </ul>
- </li>
- {% else %}
- <li>
- <a href="/login">{{ _("Sign In") }}</a>
- </li>
- {% end %}
- </ul>
+ <a class="navbar-item" href="/builds">
+ {{ _("Builds") }}
+ </a>
+
+ {# Dropdown menu with more stuff... #}
+
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link" href="#">
+ {{ _("More") }}
+ </a>
+
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item" href="/distros">
+ {{ _("Distributions") }}
+ </a>
+ <a class="navbar-item" href="/builders">
+ {{ _("Builders") }}
+ </a>
+ <a class="navbar-item" href="/mirrors">
+ {{ _("Mirrors") }}
+ </a>
+ {% if current_user %}
+ <a class="navbar-item" href="/users">
+ {{ _("Users") }}
+ </a>
+ {% end %}
+ <a class="navbar-item" href="/log">
+ {{ _("Log") }}
+ </a>
</div>
</div>
</div>
- {# Main Stuff #}
+ <div class="navbar-end">
+ <div class="navbar-item">
+ <div class="field">
+ <p class="control">
+ <form method="GET" action="/search">
+ <input class="input" type="text" name="q"
+ placeholder="{{ _("Search...") }}">
+ </form>
+ </p>
+ </div>
+ </div>
+
+ {% if current_user %}
+ <div class="navbar-item has-dropdown is-hoverable">
+ <a class="navbar-link" href="/users/{{ current_user.name }}">
+ {{ current_user }}
+ </a>
- <div class="cell">
- {% block container %}
- <div class="grid-x grid-padding-x">
- {% block body %}EMPTY BODY{% end block %}
+ <div class="navbar-dropdown is-boxed">
+ <a class="navbar-item" href="/profile/builds">
+ {{ _("My Builds") }}
+ </a>
+ <hr class="navbar-divider">
+ <a class="navbar-item" href="/logout">
+ {{ _("Logout") }}
+ </a>
+ </div>
</div>
- {% end block %}
+ {% else %}
+ <div class="navbar-item">
+ <a class="button" href="/login">
+ {{ _("Sign In") }}
+ </a>
+ </div>
+ {% end %}
</div>
+ </div>
+ </nav>
- {# Footer #}
+ {# Main Stuff #}
- <div class="cell footer">
- <p>
- © {{ year }} - Pakfire Build Service {{ version }}
- </p>
- </div>
+ <section class="section">
+ <div class="container">
+ {% block container %}
+ <div class="grid-x grid-padding-x">
+ {% block body %}EMPTY BODY{% end block %}
+ </div>
+ {% end block %}
</div>
- </div>
+ </section>
- <!-- include javascript files -->
- <script src="{{ static_url("js/jquery.min.js") }}"></script>
- <script src="{{ static_url("js/foundation.min.js") }}"></script>
- <script src="{{ static_url("js/prettify.js") }}"></script>
- <script src="{{ static_url("js/pbs.js") }}"></script>
+ {# Footer #}
+
+ <footer class="footer">
+ <div class="content has-text-centered">
+ <p>
+ © {{ year }} - Pakfire Build Service {{ version }}
+ </p>
+ </div>
+ </footer>
</body>
</html>