[TASK] switch to own freifunk bremen themen
This commit is contained in:
parent
b03f59dfc7
commit
85ba20ba4f
|
@ -1,13 +0,0 @@
|
|||
!node_modules/
|
||||
node_modules/*
|
||||
|
||||
!node_modules/semantic-ui-css/
|
||||
node_modules/semantic-ui-css/*
|
||||
!node_modules/semantic-ui-css/semantic.min.css
|
||||
!node_modules/semantic-ui-css/themes/
|
||||
node_modules/semantic-ui-css/themes/*
|
||||
!node_modules/semantic-ui-css/themes/default/
|
||||
node_modules/semantic-ui-css/themes/default/*
|
||||
!node_modules/semantic-ui-css/themes/default/assets/
|
||||
node_modules/semantic-ui-css/themes/default/assets/*
|
||||
!node_modules/semantic-ui-css/themes/default/assets/fonts/
|
|
@ -1,4 +1,118 @@
|
|||
body {
|
||||
position: relative;
|
||||
margin: 0px;
|
||||
font-size: 15px;
|
||||
color: #333;
|
||||
line-height: 1;
|
||||
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
|
||||
}
|
||||
.status {
|
||||
float: right;
|
||||
background: #009ee0;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
.status.connecting {
|
||||
background: #ffb400;
|
||||
}
|
||||
.status.offline {
|
||||
background: #dc0067;
|
||||
}
|
||||
header {
|
||||
background-color: #373636;
|
||||
max-width: 100%;
|
||||
height: 50px;
|
||||
}
|
||||
header > div {
|
||||
display: inline-block;
|
||||
}
|
||||
nav {
|
||||
display: inline-block;
|
||||
font-weight: 700;
|
||||
width: 100%;
|
||||
}
|
||||
nav ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
nav li {
|
||||
float:left;
|
||||
display: inline-block;
|
||||
}
|
||||
nav li:hover, nav.active {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
nav li a, nav li span {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
text-decoration: none !important;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
color: inherit;
|
||||
box-sizing: border-box;
|
||||
padding: 1.1em .5em;
|
||||
min-width: 10em;
|
||||
height: 50px;
|
||||
}
|
||||
nav > ul > .item-1 {
|
||||
background: #ffb400;
|
||||
color: #000;
|
||||
}
|
||||
nav > ul > .item-2 {
|
||||
background: #dc0067;
|
||||
color: #fff;
|
||||
}
|
||||
nav > ul > .item-3 {
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
}
|
||||
.notifications {
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
}
|
||||
|
||||
.notify {
|
||||
position: relative;
|
||||
min-height: 1em;
|
||||
margin: 1em 0;
|
||||
padding: 1em 1.5em;
|
||||
color: rgba(0,0,0,.87);
|
||||
-webkit-transition: opacity .1s ease,color .1s ease,background .1s ease,box-shadow .1s ease;
|
||||
transition: opacity .1s ease,color .1s ease,background .1s ease,box-shadow .1s ease;
|
||||
box-shadow: 0 0 0 1px rgba(34,36,38,.22) inset, 0 0 0 0 transparent;
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
}
|
||||
.notify.success {
|
||||
background: #009ee0;
|
||||
color: #fff;
|
||||
}
|
||||
.notify.warn {
|
||||
background: #ffb400;
|
||||
color: #000;
|
||||
}
|
||||
.notify.error {
|
||||
background: #dc0067;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
button {
|
||||
display: inline-block;
|
||||
padding: .5em 1em;
|
||||
border-radius: 2em;
|
||||
color: #fff;
|
||||
background-color: #dc0067;
|
||||
text-align: center;
|
||||
}
|
||||
button:hover {
|
||||
background: lighten(#dc0067, 5%);
|
||||
}
|
||||
|
||||
a.btn:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
a {
|
||||
color: #dc0067;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
|
@ -4,9 +4,7 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
<title>FreifunkManager</title>
|
||||
<link rel="stylesheet" href="/node_modules/semantic-ui-css/semantic.min.css">
|
||||
<link rel="stylesheet" href="/css/main.css">
|
||||
<script src="//localhost:35729/livereload.js"></script>
|
||||
<script src="/js/config.js"></script>
|
||||
<script src="/js/store.js"></script>
|
||||
<script src="/js/notify.js"></script>
|
||||
|
@ -15,11 +13,20 @@
|
|||
<script src="/js/app.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui stackable inverted menu">
|
||||
<div class="item">
|
||||
<img src="/img/logo.jpg">
|
||||
</div>
|
||||
</div>
|
||||
<header>
|
||||
<nav>
|
||||
|
||||
<ul>
|
||||
<li class="logo"><img src="/img/logo.jpg"></li>
|
||||
<li class="item-1"><a href="#/list/">List</a></li>
|
||||
<li class="item-2"><a href="#/map/">Map</a></li>
|
||||
<li class="item-3"><a href="#/statistics/">Statistics</a></li>
|
||||
<li class="status"><span onclick="location.reload(true)"></span></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
</main>
|
||||
<div class="notifications"></div>
|
||||
<noscript>
|
||||
<strong>JavaScript required</strong>
|
||||
|
|
|
@ -4,16 +4,17 @@ var gui = {};
|
|||
var notify;
|
||||
|
||||
gui.render = function render(){
|
||||
var status = document.getElementsByClassName('menu')[0];
|
||||
var status = document.getElementsByClassName('status')[0];
|
||||
if (status === undefined){
|
||||
console.log("unable to render");
|
||||
return;
|
||||
}
|
||||
status.classList.remove('orange','red');
|
||||
status.classList.remove('connecting','offline');
|
||||
if(socket.readyState !== 1){
|
||||
status.classList.add(((socket.readyState===0 || socket.readyState===2)?'orange':(socket.readyState===1)?'':'red'));
|
||||
status.classList.add(((socket.readyState===0 || socket.readyState===2)?'connecting':(socket.readyState===1)?'':'offline'));
|
||||
}
|
||||
|
||||
notify = new Notify(document.getElementsByClassName('notifications')[0]);
|
||||
notify = Notify(document.getElementsByClassName('notifications')[0]);
|
||||
};
|
||||
gui.update = function update(){
|
||||
console.log(store.will());
|
||||
|
@ -21,5 +22,5 @@ var gui = {};
|
|||
gui.notify = function notifyWalker(type, text){
|
||||
notify.notify(type, text);
|
||||
};
|
||||
// gui.render();
|
||||
gui.render();
|
||||
})();
|
||||
|
|
|
@ -6,12 +6,13 @@ function Notify(container){
|
|||
container.classList.add('messages');
|
||||
el.appendChild(container);
|
||||
*/
|
||||
if ("Notification" in window) {
|
||||
Notification.requestPermission();
|
||||
}
|
||||
console.log("init notify",container);
|
||||
if ("Notification" in window) {
|
||||
Notification.requestPermission();
|
||||
}
|
||||
function renderMsg(msg){
|
||||
var msgBox = document.createElement('div');
|
||||
msgBox.classList.add("ui",msg.type,"message");
|
||||
msgBox.classList.add("notify",msg.type);
|
||||
msgBox.innerHTML = msg.text;
|
||||
container.appendChild(msgBox);
|
||||
msgBox.addEventListener('click', function(){
|
||||
|
|
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
File diff suppressed because it is too large
Load Diff
Before Width: | Height: | Size: 434 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -1,5 +0,0 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"semantic-ui-css": "^2.2.10"
|
||||
}
|
||||
}
|
|
@ -1,13 +0,0 @@
|
|||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
jquery@x.*:
|
||||
version "3.2.1"
|
||||
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.2.1.tgz#5c4d9de652af6cd0a770154a631bba12b015c787"
|
||||
|
||||
semantic-ui-css@^2.2.10:
|
||||
version "2.2.10"
|
||||
resolved "https://registry.yarnpkg.com/semantic-ui-css/-/semantic-ui-css-2.2.10.tgz#f8f4470dbeffca0f0f3ff4fb71a35c71e88ad89c"
|
||||
dependencies:
|
||||
jquery x.*
|
Loading…
Reference in New Issue