#30: Starting to work.
We can serve both conventional pages, and the app.
This commit is contained in:
parent
ce9520fc2c
commit
7439e5ae15
53
resources/templates/app.html
Normal file
53
resources/templates/app.html
Normal file
|
@ -0,0 +1,53 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="css/yyy-static.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/spinner.css" />
|
||||
<link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
|
||||
<title>You Yes Yet?</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="app">
|
||||
<div class="splash-screen">
|
||||
<div class="sk-fading-circle">
|
||||
<div class="sk-circle1 sk-circle"></div>
|
||||
<div class="sk-circle2 sk-circle"></div>
|
||||
<div class="sk-circle3 sk-circle"></div>
|
||||
<div class="sk-circle4 sk-circle"></div>
|
||||
<div class="sk-circle5 sk-circle"></div>
|
||||
<div class="sk-circle6 sk-circle"></div>
|
||||
<div class="sk-circle7 sk-circle"></div>
|
||||
<div class="sk-circle8 sk-circle"></div>
|
||||
<div class="sk-circle9 sk-circle"></div>
|
||||
<div class="sk-circle10 sk-circle"></div>
|
||||
<div class="sk-circle11 sk-circle"></div>
|
||||
<div class="sk-circle12 sk-circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="footer">
|
||||
You Yes Yet is loading.
|
||||
You must enable JavaScript to use the You Yes Yet app.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- scripts and styles -->
|
||||
<!-- ATTENTION \/ -->
|
||||
<!-- Leaflet -->
|
||||
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
|
||||
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
|
||||
<!-- ATTENTION /\ -->
|
||||
|
||||
<script type="text/javascript">
|
||||
var context = "{{servlet-context}}";
|
||||
var csrfToken = "{{csrf-token}}";
|
||||
</script>
|
||||
{% script "/js/app.js" %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
|
42
resources/templates/base-authenticated.html
Normal file
42
resources/templates/base-authenticated.html
Normal file
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="css/yyy-static.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/spinner.css" />
|
||||
<link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
|
||||
<title>{{title}}</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="nav">
|
||||
<img id="nav-icon" src="img/threelines.png" alt="Menu"/>
|
||||
<menu id="nav-menu" class="nav">
|
||||
<li class=""><a href="index.html">Home</a></li>
|
||||
<li class=""><a href="library.html">Library</a></li>
|
||||
<li class=""><a href="register.html">Register</a></li>
|
||||
<li class=""><a href="login.html">Login</a></li>
|
||||
<li class=""><a href="about.html">About</a></li>
|
||||
</menu>
|
||||
</div>
|
||||
|
||||
<h1>
|
||||
{{title}}
|
||||
</h1>
|
||||
</header>
|
||||
|
||||
<div id="main-container" class="container">
|
||||
<div id="big-links">
|
||||
{{big-links}}
|
||||
</div>
|
||||
<div if="#content">
|
||||
{{content}}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
|
40
resources/templates/base-unauthenticated.html
Normal file
40
resources/templates/base-unauthenticated.html
Normal file
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="css/yyy-static.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/spinner.css" />
|
||||
<link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
|
||||
<title>{{title}}</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="nav">
|
||||
<img id="nav-icon" src="img/threelines.png" alt="Menu"/>
|
||||
<menu id="nav-menu" class="nav">
|
||||
<li class=""><a href="index.html">Home</a></li>
|
||||
<li class=""><a href="library.html">Library</a></li>
|
||||
<li class=""><a href="register.html">Register</a></li>
|
||||
<li class=""><a href="login.html">Login</a></li>
|
||||
<li class=""><a href="about.html">About</a></li>
|
||||
</menu>
|
||||
</div>
|
||||
|
||||
<h1>
|
||||
{{title}}
|
||||
</h1>
|
||||
</header>
|
||||
|
||||
<div id="main-container" class="container">
|
||||
<div id="big-links">
|
||||
{% block big-links %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
<div if="#content">
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -1,53 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="css/yyy-static.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/spinner.css" />
|
||||
<link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
|
||||
<title>You Yes Yet?</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="app">
|
||||
<div class="splash-screen">
|
||||
<div class="sk-fading-circle">
|
||||
<div class="sk-circle1 sk-circle"></div>
|
||||
<div class="sk-circle2 sk-circle"></div>
|
||||
<div class="sk-circle3 sk-circle"></div>
|
||||
<div class="sk-circle4 sk-circle"></div>
|
||||
<div class="sk-circle5 sk-circle"></div>
|
||||
<div class="sk-circle6 sk-circle"></div>
|
||||
<div class="sk-circle7 sk-circle"></div>
|
||||
<div class="sk-circle8 sk-circle"></div>
|
||||
<div class="sk-circle9 sk-circle"></div>
|
||||
<div class="sk-circle10 sk-circle"></div>
|
||||
<div class="sk-circle11 sk-circle"></div>
|
||||
<div class="sk-circle12 sk-circle"></div>
|
||||
{% extends "base-unauthenticated.html" %}
|
||||
{% block big-links %}
|
||||
<div class="big-link-container">
|
||||
<a href="supporter.html" class="big-link" id="yes-link">Yes</a>
|
||||
</div>
|
||||
<div class="big-link-container">
|
||||
<a href="notyet.html" class="big-link" id="not-yet-link">No</a>
|
||||
</div>
|
||||
<p class="footer">
|
||||
You Yes Yet is loading.
|
||||
You must enable JavaScript to use the You Yes Yet app.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- scripts and styles -->
|
||||
<!-- ATTENTION \/ -->
|
||||
<!-- Leaflet -->
|
||||
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
|
||||
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
|
||||
<!-- ATTENTION /\ -->
|
||||
|
||||
<script type="text/javascript">
|
||||
var context = "{{servlet-context}}";
|
||||
var csrfToken = "{{csrf-token}}";
|
||||
</script>
|
||||
{% script "/js/app.js" %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
froboz
|
||||
{% endblock %}
|
||||
|
|
|
@ -5,11 +5,14 @@
|
|||
[ring.util.http-response :as response]
|
||||
[clojure.java.io :as io]))
|
||||
|
||||
(defn app-page []
|
||||
(layout/render "app.html"))
|
||||
|
||||
(defn home-page []
|
||||
(layout/render "home.html"))
|
||||
(layout/render "home.html" {:title "You Yes Yet?"}))
|
||||
|
||||
(defroutes home-routes
|
||||
(GET "/" [] (home-page))
|
||||
(GET "/app" [] (app-page))
|
||||
(GET "/docs" [] (-> (response/ok (-> "docs/docs.md" io/resource slurp))
|
||||
(response/header "Content-Type" "text/plain; charset=utf-8"))))
|
||||
|
||||
|
|
1
src/cljc/youyesyet/ui_utils.cljc
Normal file
1
src/cljc/youyesyet/ui_utils.cljc
Normal file
|
@ -0,0 +1 @@
|
|||
;; Ultimately it's the goal to use the same UI utils for both main site and single page app.
|
Loading…
Reference in a new issue