Class insted of Id. Nicer colors.

Krejdom · Krejdom · commit 1caaf673b92f · 2017-02-24T16:54:58.000+01:00
diff --git a/naucse/static/css/index.css b/naucse/static/css/index.css
@@ -45,8 +45,16 @@
     min-height: 160px;
 }
 
-#header {
-    background-color: #fff; 
+.header {
+    background-color: #fff;
+}
+
+.menu li h1 {
+    color: #000;
+}
+
+.menu li h2 {
+    color: #000;
 }
 
 .motivation div {
@@ -77,14 +85,6 @@
     background-color: #173e43;
 }
 
-.color3 {
-    background-color: #3fb0ac;
-}
-
-.color4 {
-    background-color: #173e43;
-}
-
-.color5 {
-    background-color: #3fb0ac;
+.page a {
+    color: #000;
 }
diff --git a/naucse/static/css/nausce.css b/naucse/static/css/nausce.css
@@ -26,34 +26,35 @@ h2 {
     padding-top: 32px;
 }
 
+
 /*************************/
 
-#header {
+.header {
     font-family: sans-serif;
     font-size: 18px;
     background-color: #3fb0ac; 
 }
 
 .menu {
     list-style-type: none;
-    padding-top: 10px;
+    padding: 15px 0px 10px 0px;
     overflow: hidden;
+    margin-bottom: 0;
 }
 
 .menu li a {
     display: block;
     text-decoration: none;
+    color: #fff;
 }
 
 .logo h1 {
-    color: #000;
     float: left;
     font-size: 24px;
     margin-top: 26px;
 }
 
 .menu-link h2 {
-    color: #000;
     font-size: 16px;
     font-weight: bold;
     float: right;
@@ -62,21 +63,30 @@ h2 {
 }
 
 a h2:hover {
-    color: #444;
+    color: #D1F6F5;
 }
 
 
 /*************************/
 
-#page {
+.page {
     padding: 20px;
     margin: 0 auto;
     margin-bottom: 140px;
 }
 
+.page a {
+    color: #239995;
+}
+
+.page a:hover {
+    color: #026C68;
+    text-decoration: none;
+}
+
 /*************************/
 
-#footer {
+.footer {
     background-color: #fff;
     border-top: solid 1px #000;
     font-family: sans-serif;
diff --git a/naucse/templates/_base.html b/naucse/templates/_base.html
@@ -22,7 +22,7 @@
     </head>
     
     <body>
-        <nav id="header">
+        <nav class="header">
             <ul class="container menu">
                 <li><a href="{{ url_for('index') }}" class="logo"><h1>Nauč se Python!</h1></a></li>
                 <li><a href="{{ url_for('courses') }}" class="menu-link"><h2>Materiály</h2></a></li>
@@ -35,7 +35,7 @@
 
         <script type="text/javascript" src="{{ url_for('static', filename='js/solutions.js') }}"></script>
 
-        <div id="footer">
+        <div class="footer">
             <div class="container">
                 <div class="row">
                     <div class="col">
@@ -68,6 +68,6 @@ <h2>Licence</h2>
         <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
-    
+
     </body>
 </html>
diff --git a/naucse/templates/_lessons_list.html b/naucse/templates/_lessons_list.html
@@ -2,7 +2,7 @@
 
 {% block content %}
 
-<div id="page">
+<div class="page">
     <section class="container">
 
     {% block headline %}
@@ -11,7 +11,7 @@
         <div class="row">
             <div class="sections col-xs-12 col-sm-12 col-md-8 col-lg-8">
                 {% for session in plan.values() %}
-                <div id="section{{ loop.index }}">
+                <div class="section{{ loop.index }}">
                     <h4>
                         {% if session.date %}
                             Lekce {{ loop.index }} - {{ session.title }} ({{ session.date }})
diff --git a/naucse/templates/course_list.html b/naucse/templates/course_list.html
@@ -1,15 +1,15 @@
 {% extends '_base.html' %}
 
 {% block content %}
-<div id="page">
+<div class="page">
     <section class="container">
 
     <p>Momentálně jsou dostupné tyto kurzy:</p>
 
         <div class="row">
             <div class="sections col-xs-12 col-sm-12 col-md-8 col-lg-8">
                 {% for course in courses.values() %}
-                <div id="section{{ loop.index }}">
+                <div class="section{{ loop.index }}">
                     <h4><a href="{{ course_url(course) }}">{{ course.title }}</a></h4>
                     <p> {{ course.description }} </p>
                 </div>
diff --git a/naucse/templates/index.html b/naucse/templates/index.html
@@ -15,7 +15,7 @@
       </div>
     </div>
 
-  <div id="page">
+  <div class="page">
     <div class="container">
       <div class="space center">
           <a class="btn btn-secondary btn-lg" href="{{ course_url('pyladies') }}" role="button">Chci začít!</a>
@@ -50,19 +50,19 @@ <h2>Další témata</h2>
         </div>
 
         <div class="card card-inverse">
-          <div class="card-img-overlay topic color3">
+          <div class="card-img-overlay topic color1">
             <a href="{{ lesson_url('intro/micropython') }}"><h3 class="card-title">MicroPython</h3></a>
           </div>
         </div>
 
         <div class="card card-inverse">
-          <div class="card-img-overlay topic color4">
+          <div class="card-img-overlay topic color2">
             <a href="{{ lesson_url('intro/turtle') }}"><h3 class="card-title">Želva</h3></a>
           </div>
         </div>
 
         <div class="card card-inverse">
-          <div class="card-img-overlay topic color5">
+          <div class="card-img-overlay topic color1">
             <a href="{{ course_url('mi-pyt') }}"><h3 class="card-title">...</h3></a>
           </div>
         </div>
diff --git a/naucse/templates/lesson.html b/naucse/templates/lesson.html
@@ -8,7 +8,7 @@
 
 {% block content %}
 
-<div id="page">
+<div class="page">
     <div class="container">
 
         {{ content }}
diff --git a/naucse/templates/run_list.html b/naucse/templates/run_list.html
@@ -1,7 +1,7 @@
 {% extends '_base.html' %}
 
 {% block content %}
-<div id="page">
+<div class="page">
 <section class="container">
 
     <p>Materiály právě probíhajících kurzů:</p>
@@ -11,7 +11,7 @@
                 {% for year, run_year in run_years.items() %}
                     <h2>{{ year }}</h2>
                     {% for slug, run in run_year.runs.items() %}
-                        <div id="section{{ loop.index }}">
+                        <div class="section{{ loop.index }}">
                         <h4><a href="{{ run_url(run) }}">{{ run.title }}</a></h4>
                         <p> {{ run.description }} </p>
                     </div>
