basic responsivity properties

noamoss · Jun 12, 2016 · 6ebf0b6
1 parent 8af9e91
commit 6ebf0b6
Show file tree

Hide file tree

Showing 8 changed files with 106 additions and 49 deletions.
diff --git a/app/static/main.css b/app/static/main.css
@@ -1,6 +1,54 @@
+header {
+ width: 100%;
+ padding: 1em;
+ text-align: center;
+}
+
+#personal_feed {
+ width: 100%;
+ }
+
+.flash, .error {
+ width: 100%;
+ padding: 2em;
+ text-align: center;
+ }
+
+#register_form, #login_form {
+ width: 100%;
+ padding: 1em;
+ text-align: center
+
+}
+
+form input{
+ width: 80%;
+ padding: 1em;
+ max_width: 350px;
+}
+
+.btn {
+ min-width: 48px;
+ padding: 1.5em;
+}
+
 th, td {
  text-align: center;
 }
 
-.split-line { display:block;margin:10px; float:right}
-.split-line span { display:block;float:left;margin-left:10px}
+.split-line { display:block;float:right}
+.split-line span { display:block;float:left}
+
+#feed_list table{
+ width: 100%;
+ padding: 1.5em;
+ text-align: center;
+}
+
+
+.feed_item {
+ width:90%;
+ max-width: 90%;
+ min-width: 90%;
+ padding: 2em;
+}
diff --git a/templates/_base.html b/templates/_base.html
@@ -12,17 +12,20 @@
  <![endif]-->
  <meta charset="UTF-8">
  <script src=" {{url_for('static', filename='jquery-2.2.4.min.js') }}"></script>
-
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
 
 <body dir="rtl">
- <div class="container">
- <h3>
- <img src="{{ url_for('notifier.static', filename='hasadna-logo.jpg') }}" height="40px"/>
+ <header>
+  <h3>
+  <img src="{{ url_for('notifier.static', filename='hasadna-logo.jpg') }}" height="40px"/>
  לחשושים ועדכונים ממקורות המידע הציבורי הפתוח
- <img src="{{ url_for('notifier.static', filename='notifier.png') }}" height="40px"/>
- </h3>
+  <img src="{{ url_for('notifier.static', filename='notifier.png') }}" height="40px"/>
+  </h3>
  <h4>*שירות ניסיוני, בתקופת הרצה</h4>
+ </header>
+
+ <div class="container">
  {% for message in get_flashed_messages() %}
  <div class="flash">{{ message }}</div>
  {% endfor %}
@@ -31,10 +34,10 @@ <h4>*שירות ניסיוני, בתקופת הרצה</h4>
  {% endif %}
 
  <br>
-
- {% block content %}
- {% endblock %}
-
+ <div class="content">
+  {% block content %}
+  {% endblock %}
+ </div>
  </div>
  <script src=" {{ url_for('static', filename='bootstrap.min.js') }}"></script>
 </body>

diff --git a/templates/add_feed_and_register.html b/templates/add_feed_and_register.html
@@ -73,7 +73,7 @@ <h5> צרו לכם חשבון, כדי להוסיף מקורות, לעקוב או
  </p>
 
  <button class="btn btn-sm btn-success" type="submit" name="btn" value="register">הרשמה</button>
- 
+
  </form>
 
 

diff --git a/templates/feed.html b/templates/feed.html
@@ -1,20 +1,23 @@
- <div>
+ <div id="personal_feed">
  <h3> עדכונים אישיים </h3>
+ <br>
+ <p>עדכונים מה-{{days_no}} ימים האחרונים</p>
  {% for entry in parsed_feeds %}
- <p class="split-line">
+ <div class="feed_item split-line">
  <b>{{ entry[0] }}:</b><i> {{ entry[1] }}</i>.<br>
  {{ entry[2] }}<br><br>
 
  <a href="{{ url_for('notifier.share_item', service='click', project=entry[0], title=entry[1], link=entry[3]) }}" target=_blank>קישור לפרסום המקורי</a>, שפורסם ב-{{ entry[4] }}.
  <span>
+ שתפו:
  <a href=" {{ url_for('notifier.share_item', service='facebook', project=entry[0], title=entry[1], link=entry[3]) }}" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i></a>
  <a href="{{ url_for('notifier.share_item', service='twitter', project=entry[0], title=entry[1], link=entry[3]) }}" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
  <a href="{{ url_for('notifier.share_item', service='google', project=entry[0], title=entry[1], link=entry[3]) }}" target="_blank"><i class="fa fa-google-plus" aria-hidden="true"></i></a>
  <a href="{{ url_for('notifier.share_item', service='linkedin', project=entry[0], title=entry[1], link=entry[3]) }}" target="_blank"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
  <a href="{{ url_for('notifier.share_item', service='email', project=entry[0], title=entry[1], link=entry[3]) }}" target="_blank"><i class="fa fa-envelope" aria-hidden="true"></i></a>
  </span>
 
- <br><br><br>
- </p>
+ <br>
+ </div>
  {% endfor %}
  </div>
diff --git a/templates/feeds_editor.html b/templates/feeds_editor.html
@@ -7,12 +7,9 @@
  </div>
 
 <br><br>
- <div class="row">
- <p>עדכונים מה-{{days_no}} ימים האחרונים</p>
- <div class="col-md-10">
+ <div class="row col-md-10">
  <hr>
  {% include "feed.html" %}
- </div>
  </div>
  </div>
 {% endblock %}
diff --git a/templates/login.html b/templates/login.html
@@ -1,18 +1,19 @@
 {% extends "_base.html" %}
 {% block content %}
-<h3>אנא התחבר/י כדי לצפות ברשימת מקורות המידע שלך.</h3>
+<div id="login_form">
+ <h3>התחבר/י כדי לצפות ברשימת מקורות המידע שלך.</h3>
 
-<form method ="post" action="/">
- {{ form.csrf_token }}
- <p>
- {{ form.email(placeholder='כתובת דוא"ל') }}
- <span class="error">
- {% if form.email.errors %}
- {% for error in form.email.errors %}
- {{ error }}
- {% endfor %}
- {% endif %}
- </span>
+ <form method ="post" action="/">
+  {{ form.csrf_token }}
+  <p>
+  {{ form.email(placeholder='כתובת דוא"ל') }}
+  <span class="error">
+  {% if form.email.errors %}
+  {% for error in form.email.errors %}
+  {{ error }}
+  {% endfor %}
+  {% endif %}
+  </span>
  </p>
  <p>
  {{ form.password(placeholder="סיסמה") }}
@@ -24,11 +25,14 @@ <h3>אנא התחבר/י כדי לצפות ברשימת מקורות המידע
  {% endif %}
  </span>
  </p>
+ <br>
+ <br>
+
  <button class="btn btn-sm btn-success" type="submit">התחברות</button>
-</form>
-<br>
-<br>
+ </form>
+ <br>
+ <br>
 
-<p><em> צריכים חשבון ?? </em><a href="/register">הירשמו!!</a></p>
+ <p><em> צריכים חשבון ?? </em><a href="/register">הירשמו!!</a></p>
 
 {% endblock %}
diff --git a/templates/register.html b/templates/register.html
@@ -1,5 +1,6 @@
 {% extends "_base.html" %}
 {% block content %}
+<div id="register_form">
 <h3> הירשמו וצרו לכם רשימה משלכם לעדכונים.</h3>
  <form method = "POST" action="/register">
  {{ form.csrf_token }}
@@ -33,11 +34,11 @@ <h3> הירשמו וצרו לכם רשימה משלכם לעדכונים.</h3>
  </span>
  {% endif %}
  </p>
-
- <button class="brn brn-sm brn-success" type="submit">Register</button>
- <br>
+ <br><br>
+ <button class="btn btn-sm btn-success" type="submit">הרשמה</button>
+ <br><br>
  <p><em>כבר רשומים?</em> הקליקו <a href="/">כאן</a> כדי להתחבר.</p>
  </form>
-
+</div>
 
 {% endblock %}
diff --git a/templates/registered_feeds.html b/templates/registered_feeds.html
@@ -1,19 +1,20 @@
- <div>
+ <div class="container">
  <h2>הזנות קיימות:</h2>
- <div class="datagrid">
+ <br>
+ <div class="datagrid" id="feed_list">
  <table>
  <thead>
  <tr>
- <th width="300"><strong>שם ההזנה</strong&