added navbar widget and did some cleanup to eventually get rid of bootstrap
This commit is contained in:
Felix Hamann
parent
7cb64b765a
commit
349938b0e7
@ -207,10 +207,10 @@ submissionAccess cID = do
|
||||
|
||||
adminAccess :: Maybe SchoolId -- ^ If @Just@, matched exactly against 'userAdminSchool'
|
||||
-> YesodDB UniWorX AuthResult
|
||||
adminAccess school = do
|
||||
adminAccess school = do
|
||||
authId <- lift requireAuthId
|
||||
adrights <- selectList ((UserAdminUser ==. authId) : maybe [] (\s -> [UserAdminSchool ==. s]) school) []
|
||||
return $ if (not $ null adrights)
|
||||
adrights <- selectList ((UserAdminUser ==. authId) : maybe [] (\s -> [UserAdminSchool ==. s]) school) []
|
||||
return $ if (not $ null adrights)
|
||||
then Authorized
|
||||
else Unauthorized "No admin access"
|
||||
|
||||
@ -218,7 +218,7 @@ lecturerAccess :: Maybe SchoolId
|
||||
-> YesodDB UniWorX AuthResult
|
||||
lecturerAccess school = do
|
||||
authId <- lift requireAuthId
|
||||
lecrights <- selectList ((UserLecturerUser ==. authId) : maybe [] (\s -> [UserLecturerSchool ==. s]) school) []
|
||||
lecrights <- selectList ((UserLecturerUser ==. authId) : maybe [] (\s -> [UserLecturerSchool ==. s]) school) []
|
||||
return $ if (not $ null lecrights)
|
||||
then Authorized
|
||||
else Unauthorized "No lecturer access"
|
||||
@ -238,26 +238,26 @@ isAuthorized' :: Route UniWorX -> Bool -> Handler Bool
|
||||
isAuthorized' route isWrite = runDB $ isAuthorizedDB' route isWrite
|
||||
|
||||
-- Define breadcrumbs.
|
||||
instance YesodBreadcrumbs UniWorX where
|
||||
instance YesodBreadcrumbs UniWorX where
|
||||
breadcrumb TermShowR = return ("Semester", Just HomeR)
|
||||
breadcrumb TermEditR = return ("Neu", Just TermShowR)
|
||||
breadcrumb (TermEditExistR _) = return ("Editieren", Just TermShowR)
|
||||
|
||||
|
||||
breadcrumb CourseListR = return ("Kurs", Just HomeR)
|
||||
breadcrumb (CourseListTermR term) = return (termToText term, Just TermShowR)
|
||||
breadcrumb (CourseShowR term course) = return (course, Just $ CourseListTermR term)
|
||||
breadcrumb CourseEditR = return ("Neu", Just CourseListR)
|
||||
breadcrumb CourseEditR = return ("Neu", Just CourseListR)
|
||||
breadcrumb (CourseEditExistR _ _) = return ("Editieren", Just CourseListR)
|
||||
|
||||
breadcrumb SubmissionListR = return ("Abgaben", Just HomeR)
|
||||
breadcrumb (SubmissionR _) = return ("Abgabe", Just SubmissionListR)
|
||||
|
||||
|
||||
breadcrumb HomeR = return ("ReWorX", Nothing)
|
||||
breadcrumb (AuthR _) = return ("Login", Just HomeR)
|
||||
breadcrumb ProfileR = return ("Profile", Just HomeR)
|
||||
breadcrumb _ = return ("home", Nothing)
|
||||
|
||||
|
||||
|
||||
defaultLinks :: [MenuTypes]
|
||||
defaultLinks = -- Define the menu items of the header.
|
||||
[ NavbarLeft $ MenuItem
|
||||
@ -269,7 +269,7 @@ defaultLinks = -- Define the menu items of the header.
|
||||
{ menuItemLabel = "Kurse"
|
||||
, menuItemRoute = CourseListR
|
||||
, menuItemAccessCallback = return True
|
||||
}
|
||||
}
|
||||
, NavbarRight $ MenuItem
|
||||
{ menuItemLabel = "Profile"
|
||||
, menuItemRoute = ProfileR
|
||||
@ -309,12 +309,14 @@ defaultMenuLayout menu widget = do
|
||||
-- you to use normal widget features in default-layout.
|
||||
|
||||
pc <- widgetToPageContent $ do
|
||||
addStylesheet $ StaticR css_bootstrap_css
|
||||
-- addStylesheet $ StaticR css_globals_lucius
|
||||
$(widgetFile "default-layout")
|
||||
withUrlRenderer $(hamletFile "templates/default-layout-wrapper.hamlet")
|
||||
where
|
||||
mainMenu :: [MenuTypes] -> Maybe (Route UniWorX) -> Widget
|
||||
mainMenu menuTypes mcurrentRoute = $(widgetFile "main-menu")
|
||||
navbar :: [MenuTypes] -> Maybe (Route UniWorX) -> Widget
|
||||
navbar menuTypes mcurrentRoute = $(widgetFile "widgets/navbar")
|
||||
breadcrumbsList :: [(Route UniWorX, Text)] -> Text -> Widget
|
||||
breadcrumbsList parents title = $(widgetFile "widgets/breadcrumbs")
|
||||
|
||||
|
||||
-- How to run database actions.
|
||||
@ -346,7 +348,7 @@ instance YesodAuth UniWorX where
|
||||
|
||||
$logDebugS "auth" $ tshow ((userPlugin, userIdent), creds)
|
||||
|
||||
when isDummy . (throwError =<<) . lift $
|
||||
when isDummy . (throwError =<<) . lift $
|
||||
maybe (UserError $ IdentifierNotFound credsIdent) (Authenticated . entityKey) <$> getBy uAuth
|
||||
|
||||
let
|
||||
@ -356,7 +358,7 @@ instance YesodAuth UniWorX where
|
||||
|
||||
userEmail <- maybe (throwError $ ServerError "Could not retrieve user email") return userEmail'
|
||||
userDisplayName <- maybe (throwError $ ServerError "Could not retrieve user name") return userDisplayName'
|
||||
|
||||
|
||||
let
|
||||
newUser = User{..}
|
||||
userUpdate = [ UserMatrikelnummer =. userMatrikelnummer
|
||||
@ -371,13 +373,13 @@ instance YesodAuth UniWorX where
|
||||
userStudyFeatures' = [ v | (k, v) <- credsExtra, k == "dfnEduPersonFeaturesOfStudy" ]
|
||||
|
||||
fs <- either (\err -> throwError . ServerError $ "Could not parse features of study: " <> err) return userStudyFeatures
|
||||
|
||||
|
||||
lift $ deleteWhere [StudyFeaturesUser ==. userId]
|
||||
|
||||
forM_ fs $ \StudyFeatures{..} -> do
|
||||
lift . insertMaybe studyFeaturesDegree $ StudyDegree (unStudyDegreeKey studyFeaturesDegree) Nothing Nothing
|
||||
lift . insertMaybe studyFeaturesField $ StudyTerms (unStudyTermsKey studyFeaturesField) Nothing Nothing
|
||||
|
||||
|
||||
lift $ insertMany_ fs
|
||||
return $ Authenticated userId
|
||||
where
|
||||
@ -402,7 +404,7 @@ ldapConfig app@(appSettings -> settings) = LDAPConfig
|
||||
}
|
||||
where
|
||||
principalName :: IsString a => a
|
||||
principalName = "userPrincipalName"
|
||||
principalName = "userPrincipalName"
|
||||
identifierModifier _ entry = case lookup principalName $ leattrs entry of
|
||||
Just [n] -> Text.pack n
|
||||
_ -> error "Could not determine user principal name"
|
||||
|
||||
@ -4,5 +4,5 @@ module Handler.Utils.Templates where
|
||||
|
||||
import Import.NoFoundation
|
||||
|
||||
-- list :: WidgetT site IO ()
|
||||
-- list = $(widgetFile "list") -- assumes /templates/list.hamlet
|
||||
lipsum :: WidgetT site IO ()
|
||||
lipsum = $(widgetFile "widgets/lipsum")
|
||||
|
||||
7022
static/css/bootstrap.css
vendored
7022
static/css/bootstrap.css
vendored
File diff suppressed because it is too large
Load Diff
@ -19,12 +19,7 @@ $newline never
|
||||
\<!--[if lt IE 9]>
|
||||
\<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
\<![endif]-->
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js">
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.0.3/js.cookie.min.js">
|
||||
|
||||
\<!-- Bootstrap-3.3.7 compiled and minified JavaScript -->
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous">
|
||||
|
||||
<script>
|
||||
/* The `defaultCsrfMiddleware` Middleware added in Foundation.hs adds a CSRF token to the request cookies. */
|
||||
/* AJAX requests should add that token to a header to be validated by the server. */
|
||||
@ -43,8 +38,6 @@ $newline never
|
||||
\ });
|
||||
}
|
||||
|
||||
<script>
|
||||
document.documentElement.className = document.documentElement.className.replace(/\bno-js\b/,'js');
|
||||
<body>
|
||||
^{pageBody pc}
|
||||
|
||||
|
||||
@ -1,51 +1,24 @@
|
||||
<div #main.main-wrapper>
|
||||
<!-- navigation -->
|
||||
^{navbar menuTypes mcurrentRoute}
|
||||
|
||||
<!-- Static navbar -->
|
||||
<nav .navbar.navbar-default.navbar-static-top>
|
||||
<div .container>
|
||||
<div .navbar-header>
|
||||
<button type="button" .navbar-toggle.collapsed data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
|
||||
<div #navbar .collapse.navbar-collapse>
|
||||
^{mainMenu menuTypes mcurrentRoute}
|
||||
|
||||
<ul .nav.navbar-nav.navbar-right>
|
||||
$forall menuType <- menuTypes
|
||||
$case menuType
|
||||
$of NavbarRight (MenuItem label route _)
|
||||
<li :Just route == mcurrentRoute:.active>
|
||||
<a href=@{route}>#{label}
|
||||
$of _
|
||||
|
||||
<!-- Page Contents -->
|
||||
|
||||
<div .container>
|
||||
<div .content-wrapper>
|
||||
<!-- breadcrumbs -->
|
||||
$if not $ Just HomeR == mcurrentRoute
|
||||
<ul .breadcrumb>
|
||||
$forall bc <- parents
|
||||
<li>
|
||||
<a href="@{fst bc}">#{snd bc}
|
||||
|
||||
<li .active>#{title}
|
||||
^{breadcrumbsList parents title}
|
||||
|
||||
<!-- alerts -->
|
||||
$forall (status, msg) <- mmsgs
|
||||
$with status2 <- bool status "info" (status == "")
|
||||
<div class="alert alert-#{status2}">#{msg}
|
||||
|
||||
|
||||
$if (Just HomeR == mcurrentRoute)
|
||||
<!-- actual content -->
|
||||
^{widget}
|
||||
$else
|
||||
<div .container>
|
||||
<div .row>
|
||||
<div .col-md-12>
|
||||
^{widget}
|
||||
|
||||
<!-- Footer -->
|
||||
<footer .footer>
|
||||
<div .container>
|
||||
<p .text-muted>
|
||||
#{appCopyright $ appSettings master}
|
||||
<!-- a little lorem ipsum for waste of vertical space -->
|
||||
^{lipsum}
|
||||
|
||||
<!-- footer -->
|
||||
<footer>
|
||||
#{appCopyright $ appSettings master}
|
||||
|
||||
@ -1,73 +1,93 @@
|
||||
.masthead,
|
||||
.navbar {
|
||||
background-color: rgb(27, 28, 29);
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > .active > a {
|
||||
background-color: transparent;
|
||||
border-bottom: 2px solid white;
|
||||
}
|
||||
|
||||
.navbar-nav {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.masthead {
|
||||
margin-top: -21px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
.masthead .header {
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
font-family: Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;
|
||||
}
|
||||
|
||||
.masthead h1.header {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 0em;
|
||||
font-size: 4.5em;
|
||||
line-height: 1.2em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.masthead h2 {
|
||||
font-size: 1.7em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.masthead .btn {
|
||||
margin: 1em 0;
|
||||
}
|
||||
/* THEME 1 */
|
||||
@base00: #72a85b;
|
||||
@base-bg-color: #1d1c1d;
|
||||
@base-font-color: #fff;
|
||||
@sec-font-color: #fff;
|
||||
@box-bg-color: #3c3c3c;
|
||||
/* THEME 2 */
|
||||
@base00: #38428a;
|
||||
@base-bg-color: #ffffff;
|
||||
@base-font-color: rgb(53, 53, 53);
|
||||
@sec-font-color: #eaf2ff;
|
||||
@box-bg-color: #dddddd;
|
||||
/* THEME 3 */
|
||||
@base00: rebeccapurple;
|
||||
|
||||
|
||||
/* Common styles for all types */
|
||||
.bs-callout {
|
||||
padding: 20px;
|
||||
margin: 20px 0;
|
||||
border: 1px solid #eee;
|
||||
border-left-width: 5px;
|
||||
border-radius: 3px;
|
||||
|
||||
|
||||
@footer-height: 50px;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.bs-callout p:last-child {
|
||||
margin-bottom: 0;
|
||||
body {
|
||||
background-color: white;
|
||||
color: #333;
|
||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.bs-callout-info {
|
||||
border-left-color: #1b809e;
|
||||
a,
|
||||
a:visited {
|
||||
color: rebeccapurple;
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
transition: color .2s ease, background-color .2s ease;
|
||||
}
|
||||
a:hover {
|
||||
color: #422063;
|
||||
}
|
||||
|
||||
/* Space things out */
|
||||
.bs-docs-section {
|
||||
margin-bottom: 60px;
|
||||
ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
.bs-docs-section:last-child {
|
||||
margin-bottom: 0;
|
||||
ul.flat > li {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#message {
|
||||
margin-bottom: 40px;
|
||||
h1, h2, h3, h4, h5 {
|
||||
font-weight: 600;
|
||||
}
|
||||
h1 {
|
||||
font-size: 32px;
|
||||
margin: 20px 0 10px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
margin: 10px 0 5px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 20px;
|
||||
margin: 5px 0 0;
|
||||
}
|
||||
h4 {
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
th, td {
|
||||
text-align: left;
|
||||
padding: 0 2px 0 4px;
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
padding: 0 10vw;
|
||||
|
||||
div {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,74 +1,42 @@
|
||||
<div .masthead>
|
||||
<div .container>
|
||||
<div .row>
|
||||
<h1 .header>
|
||||
ReWorX - Demo
|
||||
<h3>
|
||||
Testumgebung für die Re-Implementierung von
|
||||
<a href="https://uniworx.ifi.lmu.de/">
|
||||
UniWorX
|
||||
<div>
|
||||
<h1>ReWorX - Demo
|
||||
<h3>
|
||||
Testumgebung für die Re-Implementierung von <a href="https://uniworx.ifi.lmu.de/">UniWorX</a>
|
||||
|
||||
<div .container>
|
||||
<!-- Starting
|
||||
================================================== -->
|
||||
<div .bs-docs-section>
|
||||
<div .row>
|
||||
<div .col-lg-12>
|
||||
<div .page-header>
|
||||
<h2 #start>Übersicht
|
||||
|
||||
<p>
|
||||
Die Reimplementierung von
|
||||
UniWorX ist noch nicht abgeschlossen.
|
||||
|
||||
<div .alert .alert-danger>
|
||||
Das System ist noch nicht produktiv
|
||||
einsetzbar
|
||||
|
||||
<div .bs-docs-section>
|
||||
<div .row>
|
||||
<div .col-lg-12>
|
||||
<div .page-header>
|
||||
<h2 #design>Design
|
||||
|
||||
<p>
|
||||
Wir konzentrieren uns derzeit
|
||||
ausschließlich auf die Funktionalität.
|
||||
<p>
|
||||
Insbesondere Formulare zeigen
|
||||
alle Eingabefelder und Knöpfe
|
||||
ohne eine gezielte Anordnung
|
||||
und Reihenfolge.
|
||||
Dies läßt sich leicht nachträglich einstellen.
|
||||
<p>
|
||||
Momentan werden noch keine speziellen Grafiken oder CSS verwendet;
|
||||
sondern nur gewöhnliches Bootstrap3.
|
||||
|
||||
<div .bs-docs-section>
|
||||
<div .row>
|
||||
<div .col-lg-12>
|
||||
<div .page-header>
|
||||
<h2 #design>Teilweise funktionierende Abschnitte
|
||||
|
||||
<ul .list-group>
|
||||
<div>
|
||||
<h2>Übersicht
|
||||
<p>
|
||||
Die Reimplementierung von
|
||||
UniWorX ist noch nicht abgeschlossen.
|
||||
|
||||
<li .list-group-item>
|
||||
<a href=@{TermShowR}>Semester Verwaltung
|
||||
|
||||
<li .list-group-item>
|
||||
<a href=@{CourseEditR}>Kurse anlegen
|
||||
editieren und anzeigen
|
||||
<p .alert .alert-danger>Das System ist noch nicht produktiv einsetzbar
|
||||
|
||||
<h2 #design>Funktionen zum Testen
|
||||
|
||||
<ul .list-group>
|
||||
<div>
|
||||
<h2>Design
|
||||
<p>
|
||||
Wir konzentrieren uns derzeit
|
||||
ausschließlich auf die Funktionalität.
|
||||
<p>
|
||||
Insbesondere Formulare zeigen
|
||||
alle Eingabefelder und Knöpfe
|
||||
ohne eine gezielte Anordnung
|
||||
und Reihenfolge.
|
||||
Dies läßt sich leicht nachträglich einstellen.
|
||||
|
||||
<li .list-group-item>
|
||||
Institut einmalig in Datenbank einfügen:
|
||||
<form .form-inline method=post action=@{HomeR} enctype=#{btnEnctype}>
|
||||
^{btnWdgt}
|
||||
|
||||
<li .list-group-item>
|
||||
<a href=@{CourseEditR}>Kurse anlegen
|
||||
editieren und anzeigen
|
||||
|
||||
<div>
|
||||
<h2>Teilweise funktionierende Abschnitte
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<a href=@{TermShowR}>Semester Verwaltung
|
||||
<li>
|
||||
<a href=@{CourseEditR}>Kurse anlegen, editieren und anzeigen
|
||||
|
||||
<div>
|
||||
<h2>Funktionen zum Testen
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
Institut einmalig in Datenbank einfügen:
|
||||
<form .form-inline method=post action=@{HomeR} enctype=#{btnEnctype}>
|
||||
^{btnWdgt}
|
||||
|
||||
@ -1,7 +0,0 @@
|
||||
<ul .nav.navbar-nav>
|
||||
$forall menuType <- menuTypes
|
||||
$case menuType
|
||||
$of NavbarLeft (MenuItem label route _)
|
||||
<li :Just route == mcurrentRoute:.active>
|
||||
<a href=@{route}>#{label}
|
||||
$of _
|
||||
5
templates/widgets/breadcrumbs.hamlet
Normal file
5
templates/widgets/breadcrumbs.hamlet
Normal file
@ -0,0 +1,5 @@
|
||||
<div>
|
||||
<ul .breadcrumbs.flat>
|
||||
$forall bc <- parents
|
||||
<li><a href="@{fst bc}">#{snd bc}</a> >
|
||||
<li .active>#{title}
|
||||
10
templates/widgets/lipsum.hamlet
Normal file
10
templates/widgets/lipsum.hamlet
Normal file
@ -0,0 +1,10 @@
|
||||
<div>
|
||||
<h2>A little lorem ipsum to make the page scrollable
|
||||
Aute velit consectetur consequat excepteur ut in qui do reprehenderit sit consequat occaecat incididunt sint eu. Nulla cillum quis et sit labore aliquip et ad excepteur duis elit deserunt aute. Anim esse reprehenderit et ipsum et sit quis minim enim sint et pariatur duis nostrud. Do minim dolore adipisicing ullamco ad aute veniam id magna est proident tempor labore non. Mollit et laboris duis esse commodo ex tempor.
|
||||
Elit labore qui dolor ea non ut anim occaecat do aliqua cillum qui esse. Aliqua nisi non veniam labore esse irure velit qui veniam labore consectetur ut. Tempor laboris anim officia veniam nostrud cupidatat reprehenderit aute incididunt nostrud dolore occaecat deserunt pariatur in non dolore.
|
||||
Proident anim pariatur eu laborum Lorem duis cillum est anim magna sit pariatur eu. Nulla consectetur quis ea sunt proident sint laborum. Esse est ea Lorem mollit aute excepteur fugiat ipsum ipsum ad irure do reprehenderit voluptate. Sint tempor nulla mollit voluptate pariatur aliquip culpa amet ullamco fugiat incididunt minim sint ipsum exercitation eiusmod ad. Nostrud ipsum nulla cillum ex aute elit voluptate proident proident magna ut. Ipsum officia cillum officia nostrud enim fugiat ut. Voluptate laboris aute dolore incididunt aliquip sit sit. Ea ut laboris Lorem ea ad non nostrud aute tempor non nisi.
|
||||
Qui cupidatat nisi id et excepteur sint aliquip fugiat sint reprehenderit aliquip enim anim aliqua sint dolore proident. Voluptate labore tempor laboris nisi eiusmod sunt occaecat deserunt adipisicing. Consectetur fugiat quis non ad laboris aliqua voluptate in eu id. Duis velit cillum aliquip dolor non ea mollit incididunt elit ex excepteur aute consequat amet.
|
||||
Aute velit consectetur consequat excepteur ut in qui do reprehenderit sit consequat occaecat incididunt sint eu. Nulla cillum quis et sit labore aliquip et ad excepteur duis elit deserunt aute. Anim esse reprehenderit et ipsum et sit quis minim enim sint et pariatur duis nostrud. Do minim dolore adipisicing ullamco ad aute veniam id magna est proident tempor labore non. Mollit et laboris duis esse commodo ex tempor.
|
||||
Elit labore qui dolor ea non ut anim occaecat do aliqua cillum qui esse. Aliqua nisi non veniam labore esse irure velit qui veniam labore consectetur ut. Tempor laboris anim officia veniam nostrud cupidatat reprehenderit aute incididunt nostrud dolore occaecat deserunt pariatur in non dolore.
|
||||
Proident anim pariatur eu laborum Lorem duis cillum est anim magna sit pariatur eu. Nulla consectetur quis ea sunt proident sint laborum. Esse est ea Lorem mollit aute excepteur fugiat ipsum ipsum ad irure do reprehenderit voluptate. Sint tempor nulla mollit voluptate pariatur aliquip culpa amet ullamco fugiat incididunt minim sint ipsum exercitation eiusmod ad. Nostrud ipsum nulla cillum ex aute elit voluptate proident proident magna ut. Ipsum officia cillum officia nostrud enim fugiat ut. Voluptate laboris aute dolore incididunt aliquip sit sit. Ea ut laboris Lorem ea ad non nostrud aute tempor non nisi.
|
||||
Qui cupidatat nisi id et excepteur sint aliquip fugiat sint reprehenderit aliquip enim anim aliqua sint dolore proident. Voluptate labore tempor laboris nisi eiusmod sunt occaecat deserunt adipisicing. Consectetur fugiat quis non ad laboris aliqua voluptate in eu id. Duis velit cillum aliquip dolor non ea mollit incididunt elit ex excepteur aute consequat amet.
|
||||
18
templates/widgets/navbar.hamlet
Normal file
18
templates/widgets/navbar.hamlet
Normal file
@ -0,0 +1,18 @@
|
||||
<nav .navbar>
|
||||
<ul .flat>
|
||||
$forall menuType <- menuTypes
|
||||
$case menuType
|
||||
$of NavbarLeft (MenuItem label route _)
|
||||
<li :Just route == mcurrentRoute:.active>
|
||||
<a href=@{route}>#{label}
|
||||
$of _
|
||||
|
||||
<ul .flat>
|
||||
$forall menuType <- menuTypes
|
||||
$case menuType
|
||||
$of NavbarRight (MenuItem label route _)
|
||||
<li :Just route == mcurrentRoute:.active>
|
||||
<a href=@{route}>#{label}
|
||||
$of _
|
||||
|
||||
<div .navbar-pushdown>
|
||||
21
templates/widgets/navbar.julius
Normal file
21
templates/widgets/navbar.julius
Normal file
@ -0,0 +1,21 @@
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
var ticking = false;
|
||||
var nav = document.querySelector('.navbar');
|
||||
|
||||
window.addEventListener('scroll', function(e) {
|
||||
if (!ticking) {
|
||||
window.requestAnimationFrame(checkScroll);
|
||||
ticking = true;
|
||||
}
|
||||
}, false);
|
||||
|
||||
// checks scroll direction and shows/hides navbar accordingly
|
||||
function checkScroll() {
|
||||
var sticky = window.scrollY > 0;
|
||||
nav.classList.toggle('sticky-navbar', sticky);
|
||||
ticking = false;
|
||||
}
|
||||
checkScroll();
|
||||
|
||||
});
|
||||
52
templates/widgets/navbar.lucius
Normal file
52
templates/widgets/navbar.lucius
Normal file
@ -0,0 +1,52 @@
|
||||
@header_height: 60px;
|
||||
@header_height_collapsed: 50px;
|
||||
|
||||
.navbar {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
height: #{header_height};
|
||||
line-height: #{header_height};
|
||||
padding: 0 10vw;
|
||||
background: #663399; /* Old browsers */
|
||||
background: -moz-linear-gradient(bottom, #663399 0%, #734e99 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(bottom, #663399 0%,#734e99 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to top, #663399 0%,#734e99 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
color: white;
|
||||
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
|
||||
|
||||
li > a {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
padding: 0 13px;
|
||||
color: white;
|
||||
}
|
||||
li > a:hover {
|
||||
background-color: white;
|
||||
color: rebeccapurple;
|
||||
}
|
||||
|
||||
li.active {
|
||||
background-color: #422063;
|
||||
}
|
||||
}
|
||||
.sticky-navbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: #{header_height_collapsed};
|
||||
line-height: #{header_height_collapsed};
|
||||
z-index: 100;
|
||||
transition: height 0.2s ease, line-height 0.2s ease;
|
||||
}
|
||||
|
||||
.navbar-pushdown {
|
||||
display: none;
|
||||
height: #{header_height};
|
||||
}
|
||||
.sticky-navbar + .navbar-pushdown {
|
||||
display: block;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user