Skip to content

Commit e25fa5d

Browse files
stbinanstbinan
committed
ZeroMe mobile patch
1 parent 5f0655f commit e25fa5d

File tree

7 files changed

+172
-1
lines changed

7 files changed

+172
-1
lines changed

‎content.json

+1
Original file line numberDiff line numberDiff line change
@@ -95,5 +95,6 @@
9595
"translate": [
9696
"js/all.js"
9797
],
98+
"viewport": "width=device-width, initial-scale=1.0",
9899
"zeronet_version": "0.5.1"
99100
}

‎css/mobile.css

+144
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
/* ZeroMe Mobile */
2+
#Trigger {
3+
display: none;
4+
}
5+
6+
@media screen and (max-width: 750px) {
7+
html, body, p, th, td, li {
8+
font-size: medium !important;
9+
}
10+
11+
.head-container {
12+
position: fixed;
13+
background-color: #fff;
14+
width: 100%;
15+
height: 50px;
16+
z-index: 30;
17+
}
18+
.head {
19+
width: 100%;
20+
background-color: #fff;
21+
}
22+
.head .logo {
23+
margin-left: 50px;
24+
position: absolute;
25+
z-index: 1;
26+
}
27+
.right {
28+
position: fixed;
29+
right: 0;
30+
top: 0;
31+
}
32+
#Content {
33+
width: 100%;
34+
margin-top: 60px;
35+
margin-bottom: 5px;
36+
}
37+
.col-center {
38+
background-color: #f6f7f8;
39+
width: 100%;
40+
overflow: auto;
41+
padding-left: 5px;
42+
padding-right: 5px;
43+
display: block;
44+
padding-top: 60px;
45+
margin-top: -60px;
46+
}
47+
.col-left, .col-right {
48+
position: fixed;
49+
top: 60px;
50+
left: -300px;
51+
background-color: #f6f7f8;
52+
height: 100%;
53+
margin-left: 0px;
54+
padding-top: 60px;
55+
padding-right: 15px;
56+
padding-left: 15px;
57+
margin-top: -60px;
58+
width: 300px;
59+
overflow-x: hidden;
60+
overflow-y: auto;
61+
z-index: 1;
62+
transition: all 0.6s;
63+
}
64+
.trigger-on .col-left, .trigger-on .col-right {
65+
left: 0px;
66+
box-shadow: 0px 0px 30px #999;
67+
}
68+
69+
#Trigger {
70+
display: block;
71+
position: fixed;
72+
left: 5px;
73+
top: 3px;
74+
width: 40px;
75+
height: 40px;
76+
z-index: 100;
77+
border: 1px solid #bbb;
78+
border-radius: 5px;
79+
}
80+
#Trigger .icon {
81+
background-image: url(../img/nav-icon.png);
82+
display: block;
83+
border: 12px solid #fff;
84+
height: 16px;
85+
outline: none;
86+
border-radius: 5px;
87+
}
88+
89+
.user.card {
90+
background-color: #f6f7f8;
91+
box-shadow: none;
92+
margin-top: 10px;
93+
margin-left: -15px;
94+
}
95+
.activity-list .items {
96+
margin-bottom: 0px;
97+
}
98+
.more.small {
99+
padding: 10px;
100+
margin-bottom: 5px;
101+
background-color: #fff;
102+
border: 1px solid #eef0f1;
103+
border-radius: 5px;
104+
}
105+
.post-create .icon-image {
106+
margin-left: unset;
107+
right: 40px;
108+
}
109+
.post {
110+
overflow: hidden;
111+
}
112+
#Overlay .img {
113+
width: 100% !important;
114+
margin-left: 0px !important;
115+
margin-top: -40px !important;
116+
left: 0px !important;
117+
}
118+
.post .img {
119+
width: 100% !important;
120+
max-height: 300px !important;
121+
min-height: 100px;
122+
background-size: cover !important;
123+
}
124+
.post .img .fullsize {
125+
background-size: cover !important;
126+
}
127+
.post .img .details {
128+
z-index: 50;
129+
}
130+
.post blockquote {
131+
padding-left: 10px;
132+
padding-top: 10px;
133+
padding-bottom: 10px;
134+
}
135+
}
136+
137+
@media screen and (max-width: 500px) {
138+
.post .sep, .user .address {
139+
display: none;
140+
}
141+
.post .added {
142+
margin-left: 10px;
143+
}
144+
}

‎img/nav-icon.png

937 Bytes
Loading

‎img/nav-icon.svg

+5
Loading

‎index.html

+2-1
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515

1616
<div class="head-container">
1717
<div id="Head"></div>
18+
<div id="Trigger" class="trigger-off"></div>
1819
</div>
1920

2021
<div class="center" id="Content">
@@ -23,4 +24,4 @@
2324
<script type="text/javascript" src="js/all.js?lang={lang}"></script>
2425

2526
</body>
26-
</html>
27+
</html>

‎js/Trigger.coffee

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
class Trigger extends Class
2+
constructor: ->
3+
@trigger_off = true
4+
5+
handleTitleClick: =>
6+
if @trigger_off
7+
@trigger_off = false
8+
document.body.classList.add("trigger-on")
9+
else
10+
document.body.classList.remove("trigger-on")
11+
@trigger_off = true
12+
return false
13+
14+
render: =>
15+
h("div.Trigger", {classes: { "trigger-off": @trigger_off }}, [
16+
h("a.icon", {"href": "#Trigger", onclick: @handleTitleClick})
17+
])
18+
window.Trigger = Trigger

‎js/ZeroMe.coffee

+2
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ class ZeroMe extends ZeroFrame
3939
@content_profile = new ContentProfile()
4040
@content_create_profile = new ContentCreateProfile()
4141
@scrollwatcher = new Scrollwatcher()
42+
@trigger = new Trigger()
4243

4344
if base.href.indexOf("?") == -1
4445
@route("")
@@ -55,6 +56,7 @@ class ZeroMe extends ZeroFrame
5556

5657
@projector.replace($("#Head"), @head.render)
5758
@projector.replace($("#Overlay"), @overlay.render)
59+
@projector.merge($("#Trigger"), @trigger.render)
5860
@loadLocalStorage()
5961

6062
# Update every minute to keep time since fields up-to date

0 commit comments

Comments
 (0)