widget

diff --git a/src/wolnelektury/static/scss/widget.scss b/src/wolnelektury/static/scss/widget.scss
index 7d78730..81b889e 100644 (file)
--- a/src/wolnelektury/static/scss/widget.scss
+++ b/src/wolnelektury/static/scss/widget.scss
@@ -2,11 +2,12 @@ html, body {
     padding: 0;
     margin: 0;
     overflow: hidden;
     padding: 0;
     margin: 0;
     overflow: hidden;

+    font-family: sans-serif;

 }
 
 
 #wl {
 }
 
 
 #wl {

-    background-color: #191919;
+    background-color: #083F4D;

     position:relative;
 
     a, a:visited, a:hover {
     position:relative;
 
     a, a:visited, a:hover {


@@ -17,35 +18,34 @@ html, body {
         img {
             border: 0;
             max-width: 100%;
         img {
             border: 0;
             max-width: 100%;

-            margin: 0;
+            margin: 0 0 0 25px;

             vertical-align: middle;
         }
     }
 
     #wl-form {
             vertical-align: middle;
         }
     }
 
     #wl-form {

-        background: #444;
+        background: #083F4D;

         color: white;
         color: white;

-        height: 2.8125rem;
+        height: 45px;

         position: relative;
     }
     #wl-search {
         position: absolute;
         left: .3125rem;
         position: relative;
     }
     #wl-search {
         position: absolute;
         left: .3125rem;

-        right: 2.9rem;
-        right: 22%;
-        top: .3125rem;
+        right: 10px;
+        top: 0;

     }
 
     #id_qq {
     }
 
     #id_qq {

-        font-family: Georgia;
+        font-family: sans-serif;

         font-size: 0.8125rem;
         font-size: 0.8125rem;

-        
+
+        outline: 0;

         background-color: #FFFFFF;
         border: medium none;
         background-color: #FFFFFF;
         border: medium none;

-        border-radius: 0.3125rem;
-        box-shadow: 0 0 0.40625rem #444444 inset;
+        border-radius: 20px;

         color: #000000;
         color: #000000;

-        height: 2.0625rem;
+        height: 40px;

         width: 100%;
 
         line-height: 2.03125rem;
         width: 100%;
 
         line-height: 2.03125rem;


@@ -56,68 +56,57 @@ html, body {
 
         &::-moz-placeholder {
             color: #767676;
 
         &::-moz-placeholder {
             color: #767676;

-            font-family: Georgia;
+            font-family: sans-serif;

             font-style: italic;
         }
     }
 
     button {
             font-style: italic;
         }
     }
 
     button {

-        background: #018189;
+        background: transparent;

         border: none;
         border: none;

-        color: white;
+        color: #083F4D;

         display: inline-block;
         font-size: .6875rem;
         position: absolute;
         display: inline-block;
         font-size: .6875rem;
         position: absolute;

-        right: 0;
+        right: 10px;

         top: 0;
         top: 0;

+        bottom: 10px;

         width: 2rem;
 
         width: 2rem;
 

-        width: 20%;
-        height: 2.8125rem;
+        width: 40px;
+        height: 40px;

         margin: 0;
         padding: 0;
         margin: 0;
         padding: 0;

+        border-radius: 20px;
+        z-index:300;

 
         img {
             max-width: 100%;
         }
     }
 
         img {
             max-width: 100%;
         }
     }

-

 }
 
 .ui-menu {
     width: 100%;
 }
 
 .ui-menu {
     width: 100%;

-    font-size: 0.7rem;

     list-style-type: none;
     padding: 0;
     margin: 0;
     list-style-type: none;
     padding: 0;
     margin: 0;

-    border-style: solid;
-    border-color: #ddd;
-    border-width: 1px 0;

 
     li {
 
     li {

-        clear: right;
-
-        &:nth-child(odd) {
-            background-color: rgba(255,255,255,.95);
-        }
-
-        &:nth-child(even){
-            background-color: rgba(238,238,238,.95);
-        }
-
+        background-color: white;

         &:hover{
         &:hover{

-            background-color: #053469;
+            background-color: #083F4D;

             color:white;
         }
 
         .ui-state-hover {
             color:white;
         }
 
         .ui-state-hover {

-            background-color: #fdf5ce;
+            background-color: #083F4D;
+            color:white;

         }
 
         .search-hint-label {
         }
 
         .search-hint-label {

-            line-height: 1.636em;
+            line-height: 30px;

             display: inline-block;
             display: inline-block;

-            max-width: 80%;

             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;


@@ -144,7 +133,7 @@ html, body {
 
     a {
         text-decoration: none;
 
     a {
         text-decoration: none;

-        color: #0D7E85;
-        padding: 5px;
+        color: black;
+        padding: 0 10px;

     }
 }
     }
 }

diff --git a/src/wolnelektury/templates/widget.html b/src/wolnelektury/templates/widget.html
index 3eb3422..b47b491 100644 (file)
--- a/src/wolnelektury/templates/widget.html
+++ b/src/wolnelektury/templates/widget.html
@@ -13,7 +13,7 @@
     <body>
       <div id="wl">
         <a href="/">
     <body>
       <div id="wl">
         <a href="/">

-          <img src="{% static 'img/logo-neon.png' %}">
+          <img src="{% static '2022/images/logo.svg' %}">

         </a>
         <form action="{% url 'wlsearch' %}" method="get" accept-charset="utf-8" id="wl-form">
           <div id="wl-search">
         </a>
         <form action="{% url 'wlsearch' %}" method="get" accept-charset="utf-8" id="wl-form">
           <div id="wl-search">