may/1KA_F2F
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

drupal responsive - glavni menu, stranski menu, front page

Browse Source
This commit is contained in:
urospodkriznik 2022-09-29 19:19:45 +02:00
parent 706d6db6ac
commit 29e664d230
11 changed files with 402 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

176
frontend/drupal9/web/themes/custom/pro1ka/css/style.css
View File

@ -509,6 +509,7 @@ body {
margin-top: 9px; }
.section.uvodni-slider {
padding-top: 0;
z-index: 121;
display: -webkit-box;
display: -webkit-flex;
@ -727,7 +728,10 @@ body {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex; }
display: flex;
max-width: 320px;
margin-left: auto;
margin-right: auto; }
.koraki-spletnega-anketiranja .row .stolpec .slika .postavitev {
display: -webkit-box;
display: -webkit-flex;
@ -1810,7 +1814,8 @@ input.error-field {
display: block;
padding: 9px 15px;
margin-top: 1rem; } }
.nav-menu {
.nav-menu,
.mobile-nav-menu {
position: fixed;
left: 0%;
top: 0%;
@ -1818,25 +1823,28 @@ input.error-field {
bottom: auto;
z-index: 140;
background-color: #fff;
min-height: 65px;
/* .container {
-webkit-transition: all 1200ms linear;
-moz-transition: all 1200ms linear;
-o-transition: all 1200ms linear;
-ms-transition: all 1200ms linear;
transition: all 1200ms linear;
-webkit-transition: all 1200ms linear;
-moz-transition: all 1200ms linear;
-o-transition: all 1200ms linear;
-ms-transition: all 1200ms linear;
transition: all 1200ms linear;
&.hide{
height: 0;
}
} */ }
.nav-menu .logo {
&.hide{
height: 0;
}
} */ }
.nav-menu .logo,
.mobile-nav-menu .logo {
display: block;
height: 71px;
margin-top: 0px;
padding-top: 14px;
padding-bottom: 10px;
float: left; }
.nav-menu .block-menu {
.nav-menu .block-menu,
.mobile-nav-menu .block-menu {
z-index: 200;
display: -webkit-box;
display: -webkit-flex;
@ -1850,7 +1858,8 @@ input.error-field {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1; }
.nav-menu .block-menu .list-elementi {
.nav-menu .block-menu .list-elementi,
.mobile-nav-menu .block-menu .list-elementi {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -1868,7 +1877,8 @@ input.error-field {
list-style: none;
flex-flow: row wrap;
margin-right: 24px; }
.nav-menu .block-menu .list-elementi .nav-li {
.nav-menu .block-menu .list-elementi .nav-li,
.mobile-nav-menu .block-menu .list-elementi .nav-li {
padding-right: 15px;
padding-left: 15px;
-webkit-box-flex: 0;
@ -1876,7 +1886,8 @@ input.error-field {
-ms-flex: 0 0 auto;
flex: 0 0 auto;
list-style: none; }
.nav-menu .block-menu .list-elementi .nav-li a {
.nav-menu .block-menu .list-elementi .nav-li a,
.mobile-nav-menu .block-menu .list-elementi .nav-li a {
display: block;
padding-top: 20px;
padding-bottom: 3px;
@ -1886,12 +1897,15 @@ input.error-field {
line-height: 30px;
font-weight: 400;
text-decoration: none; }
.nav-menu .block-menu .list-elementi .nav-li a:hover {
.nav-menu .block-menu .list-elementi .nav-li a:hover,
.mobile-nav-menu .block-menu .list-elementi .nav-li a:hover {
border-bottom-color: #1e88e5;
color: #1e88e5; }
.nav-menu .block-menu .list-elementi .nav-li.menue-2-drop {
.nav-menu .block-menu .list-elementi .nav-li.menue-2-drop,
.mobile-nav-menu .block-menu .list-elementi .nav-li.menue-2-drop {
display: block; }
.nav-menu .block-menu .list-elementi .nav-li.menue-2-drop .nav-ul-2 {
.nav-menu .block-menu .list-elementi .nav-li.menue-2-drop .nav-ul-2,
.mobile-nav-menu .block-menu .list-elementi .nav-li.menue-2-drop .nav-ul-2 {
position: fixed;
left: 0px;
top: 70px;
@ -1908,7 +1922,8 @@ input.error-field {
border-color: #b3d8eb;
background-color: #fff;
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.22); }
.nav-menu .block-menu .desni-elementi {
.nav-menu .block-menu .desni-elementi,
.mobile-nav-menu .block-menu .desni-elementi {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -1923,21 +1938,31 @@ input.error-field {
align-items: start;
padding-top: 20px;
margin-left: auto; }
.nav-menu .block-menu .desni-elementi .searchbutton {
.nav-menu .block-menu .desni-elementi .searchbutton,
.mobile-nav-menu .block-menu .desni-elementi .searchbutton {
margin-top: 4px;
z-index: 999; }
.nav-menu .region-header-menu {
.nav-menu .block-menu .menu-icon,
.mobile-nav-menu .block-menu .menu-icon {
display: none;
margin-left: auto; }
.nav-menu .region-header-menu,
.mobile-nav-menu .region-header-menu {
display: flex; }
.nav-menu .region-header-menu .language-switcher-language-url ul {
.nav-menu .region-header-menu .language-switcher-language-url ul,
.mobile-nav-menu .region-header-menu .language-switcher-language-url ul {
list-style: none;
padding: 0; }
.nav-menu .region-header-menu .language-switcher-language-url ul li {
.nav-menu .region-header-menu .language-switcher-language-url ul li,
.mobile-nav-menu .region-header-menu .language-switcher-language-url ul li {
text-transform: uppercase;
font-weight: bold;
display: none; }
.nav-menu .region-header-menu .language-switcher-language-url ul li:not(.is-active) {
.nav-menu .region-header-menu .language-switcher-language-url ul li:not(.is-active),
.mobile-nav-menu .region-header-menu .language-switcher-language-url ul li:not(.is-active) {
display: block; }
.nav-menu .region-header-menu .language-switcher-language-url ul li a {
.nav-menu .region-header-menu .language-switcher-language-url ul li a,
.mobile-nav-menu .region-header-menu .language-switcher-language-url ul li a {
display: block;
padding-top: 20px;
padding-bottom: 3px;
@ -1946,7 +1971,8 @@ input.error-field {
font-size: 16px;
line-height: 30px;
font-weight: 400; }
.nav-menu .region-header-menu .language-switcher-language-url ul li a:hover {
.nav-menu .region-header-menu .language-switcher-language-url ul li a:hover,
.mobile-nav-menu .region-header-menu .language-switcher-language-url ul li a:hover {
border-bottom-color: #1e88e5;
color: #1e88e5; }
@ -2050,6 +2076,49 @@ nav.tabs {
padding: 10px 15px;
margin-top: 5px; }
.mobile-nav-menu {
position: fixed;
left: 0%;
top: 0%;
right: auto;
bottom: 0%;
z-index: 140;
background-color: #fff;
padding: 30px 20px;
min-width: 350px;
flex-direction: column;
overflow: auto;
box-shadow: 4px 4px 11px 0 rgba(0, 0, 0, 0.09); }
.mobile-nav-menu .region-header-menu {
flex-direction: column; }
.mobile-nav-menu .region-header-menu .language-switcher-language-url {
padding-left: 10px; }
.mobile-nav-menu .region-header-menu a {
padding-top: 5px !important;
font-size: 19px !important; }
.mobile-nav-menu .region-header-menu a:hover {
border-bottom-color: white !important; }
.mobile-nav-menu .region-header-menu .block-menu {
flex-direction: column; }
.mobile-nav-menu .region-header-menu .block-menu .list-elementi {
flex-direction: column !important;
padding-left: 10px !important; }
.mobile-nav-menu .region-header-menu .block-menu .list-elementi .nav-li {
padding: 0; }
.mobile-nav-menu .desni-elementi {
margin-top: 10px;
margin-left: 10px; }
@media screen and (max-width: 991px) {
.nav-menu .region-header-menu,
.nav-menu .desni-elementi {
display: none !important; }
.nav-menu .menu-icon {
display: block !important;
margin-top: 15px; }
.nav-menu .menu-icon img {
height: 35px;
cursor: pointer; } }
#block-languageswitcher {
margin-right: 40px; }
#block-languageswitcher ul {
@ -5432,7 +5501,7 @@ p {
.sidelink-l3:focus {
color: #1e88e5; }
.manual-toggle {
.sidenav-toggle {
display: none; }
.dashcol {
@ -6040,6 +6109,14 @@ p {
text-align: center;
cursor: pointer; }
.section-main.functionalities {
display: block !important; }
.section-main.functionalities .flexcol {
margin-bottom: 18px !important; }
.mnenja-up {
display: block !important; }
.content {
padding-top: 0px;
padding-left: 0px; }
@ -6066,12 +6143,20 @@ p {
display: flex;
padding-right: 0px; }
.koraki-spletnega-anketiranja .row {
display: block !important; }
.koraki-spletnega-anketiranja .gumb {
flex: none !important;
width: auto !important;
margin-left: auto;
margin-right: auto; }
.col._4-12-12-12 {
width: 100%;
-webkit-box-flex: 0;
-webkit-flex: 0 100%;
-ms-flex: 0 100%;
flex: 0 100%; }
width: 100% !important;
-webkit-box-flex: 0 !important;
-webkit-flex: 0 100% !important;
-ms-flex: 0 100% !important;
flex: 0 100% !important; }
.col._6-12-12-12 {
-webkit-flex-basis: 100%;
@ -6144,7 +6229,7 @@ p {
max-width: none; }
.kvcol.leftcol {
max-width: none;
max-width: none !important;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
@ -6179,8 +6264,8 @@ p {
height: auto;
margin-bottom: 57px; }
.div-block-10 {
display: block; }
.uvodni-slider {
display: block !important; }
.image {
display: none; }
@ -6251,7 +6336,7 @@ p {
top: 0%;
right: 0%;
bottom: 0%;
z-index: 100;
z-index: 200;
display: none;
overflow: auto;
margin-right: 0px;
@ -6259,9 +6344,10 @@ p {
border: 1px solid #e5e5e5;
border-radius: 0px;
background-color: #fff;
box-shadow: none; }
box-shadow: none;
overflow: auto; }
.manual-toggle {
.sidenav-toggle {
position: fixed;
left: auto;
top: auto;
@ -6274,10 +6360,10 @@ p {
padding: 9px;
border-radius: 39px;
background-color: #1e88e5;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.37); }
.image-3 {
width: 100%; }
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.37);
cursor: pointer; }
.sidenav-toggle img {
width: 100%; }
.medium-icon-wrapper {
margin-top: 20px; }
@ -6316,7 +6402,9 @@ p {
width: 33.3333%; }
.searchform {
padding-top: 25px; } }
padding-top: 0; }
.searchform .container {
padding-top: 25px; } }
@media screen and (max-width: 767px) {
h1 {
font-size: 34px;

22
frontend/drupal9/web/themes/custom/pro1ka/js/script.js
View File

@ -34,6 +34,28 @@
jQuery('.searchform').css('transform', 'translate3d(0px, 0px, 0px)');
});
// toggle glavni menu na mobile
jQuery('.toggleMenu').on('click', function(){
let menu = jQuery('.mobile-nav-menu')[0];
let toggle_menu = jQuery('.toggleMenu')[0];
if(menu.style.display == 'none'){
toggle_menu.src="/tema1ka/svg/icons8-close-menu.svg";
menu.style.display = 'flex';
}
else{
toggle_menu.src="/tema1ka/svg/icons8-menu.svg";
menu.style.display = 'none';
}
});
// togle side menu na mobile
jQuery('.sidenav-toggle').on('click', function(){
let menu = jQuery('.sidenav')[0];
if(menu.style.display !== 'block')
menu.style.display = 'block';
else
menu.style.display = 'none';
});
jQuery('.hide-search').on('click', function(){
jQuery('.searchform').css('transform', 'translate3d(0px, -100%, 0px)');
});

4
frontend/drupal9/web/themes/custom/pro1ka/sass/bacis/frontpage.scss
View File

@ -1,4 +1,5 @@
.section.uvodni-slider{
padding-top: 0;
z-index: 121;
display: -webkit-box;
display: -webkit-flex;
@ -267,6 +268,9 @@
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
max-width: 320px;
margin-left: auto;
margin-right: auto;
.postavitev {
display: -webkit-box;

62
frontend/drupal9/web/themes/custom/pro1ka/sass/bolaric/1ka.scss
View File

@ -1603,7 +1603,7 @@ p {
color: #1e88e5;
}
.manual-toggle {
.sidenav-toggle {
display: none;
}
@ -2296,6 +2296,20 @@ p {
cursor: pointer;
}
.section-main{
&.functionalities{
display: block !important;
.flexcol{
margin-bottom: 18px !important;
}
}
}
.mnenja-up{
display: block !important;
}
.content {
padding-top: 0px;
padding-left: 0px;
@ -2328,12 +2342,24 @@ p {
padding-right: 0px;
}
.koraki-spletnega-anketiranja{
.row{
display:block !important;
}
.gumb{
flex: none !important;
width: auto !important;
margin-left: auto;
margin-right: auto;
}
}
.col._4-12-12-12 {
width: 100%;
-webkit-box-flex: 0;
-webkit-flex: 0 100%;
-ms-flex: 0 100%;
flex: 0 100%;
width: 100% !important;
-webkit-box-flex: 0 !important;
-webkit-flex: 0 100% !important;
-ms-flex: 0 100% !important;
flex: 0 100% !important;
}
.col._6-12-12-12 {
@ -2418,7 +2444,7 @@ p {
}
.kvcol.leftcol {
max-width: none;
max-width: none !important;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
@ -2463,8 +2489,8 @@ p {
//background-color: #99f2e1;
}
.div-block-10 {
display: block;
.uvodni-slider {
display: block !important;
}
.image {
@ -2550,7 +2576,7 @@ p {
top: 0%;
right: 0%;
bottom: 0%;
z-index: 100;
z-index: 200;
display: none;
overflow: auto;
margin-right: 0px;
@ -2559,9 +2585,10 @@ p {
border-radius: 0px;
background-color: #fff;
box-shadow: none;
overflow: auto;
}
.manual-toggle {
.sidenav-toggle {
position: fixed;
left: auto;
top: auto;
@ -2575,10 +2602,11 @@ p {
border-radius: 39px;
background-color: #1e88e5;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.37);
}
cursor: pointer;
.image-3 {
width: 100%;
img{
width: 100%;
}
}
.medium-icon-wrapper {
@ -2627,7 +2655,10 @@ p {
}
.searchform {
padding-top: 25px;
padding-top: 0;
.container{
padding-top: 25px;
}
}
}
@ -2747,6 +2778,7 @@ p {
}
@media screen and (max-width: 479px) {
.section.kvs {
padding-top: 17px;
}

143
frontend/drupal9/web/themes/custom/pro1ka/sass/components/_menu.scss
View File

@ -1,14 +1,15 @@
.nav-menu {
.nav-menu,
.mobile-nav-menu {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: auto;
z-index: 140;
//height: 70px;
background-color: #fff;
min-height: 65px;
/* .container {
/* .container {
-webkit-transition: all 1200ms linear;
-moz-transition: all 1200ms linear;
-o-transition: all 1200ms linear;
@ -20,7 +21,7 @@
}
} */
.logo{
.logo {
display: block;
height: 71px;
margin-top: 0px;
@ -29,7 +30,7 @@
float: left;
}
.block-menu{
.block-menu {
z-index: 200;
display: -webkit-box;
display: -webkit-flex;
@ -44,7 +45,7 @@
-ms-flex: 1;
flex: 1;
.list-elementi{
.list-elementi {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -64,7 +65,7 @@
flex-flow: row wrap;
margin-right: 24px;
.nav-li{
.nav-li {
padding-right: 15px;
padding-left: 15px;
-webkit-box-flex: 0;
@ -90,10 +91,10 @@
}
}
&.menue-2-drop{
&.menue-2-drop {
display: block;
.nav-ul-2{
.nav-ul-2 {
position: fixed;
left: 0px;
top: 70px;
@ -117,7 +118,7 @@
}
.desni-elementi{
.desni-elementi {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -138,6 +139,11 @@
z-index: 999;
}
}
.menu-icon {
display: none;
margin-left: auto;
}
}
.region-header-menu {
@ -146,18 +152,18 @@
.language-switcher-language-url {
ul {
list-style: none;
padding: 0;
padding: 0;
li {
text-transform: uppercase;
font-weight: bold;
display: none;
&:not(.is-active){
&:not(.is-active) {
display: block;
}
a{
a {
display: block;
padding-top: 20px;
padding-bottom: 3px;
@ -167,7 +173,7 @@
line-height: 30px;
font-weight: 400;
&:hover{
&:hover {
border-bottom-color: #1e88e5;
color: #1e88e5;
}
@ -179,26 +185,28 @@
}
.sidebar_menu{
.sidebar_menu {
display: block;
h4 a{
h4 a {
color: #333;
text-decoration: none;
text-transform: uppercase;
font-weight: 600;
font-size: 15px;
&:hover{
&:hover {
color: #1e88e5;
}
}
#forma-iskanje-second{
#forma-iskanje-second {
display: flex;
}
ul:not(.contextual-links){
ul:not(.contextual-links) {
display: block;
margin: 0px;
padding: 0px;
@ -225,7 +233,7 @@
color: #1e88e5;
}
a{
a {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
@ -242,7 +250,7 @@
text-decoration: none;
text-transform: none;
&.is-active{
&.is-active {
color: #1e88e5;
}
@ -253,18 +261,18 @@
}
}
ul.menu-1ka{
li{
a{
ul.menu-1ka {
li {
a {
margin-top: 10px;
text-transform: uppercase;
font-weight: 600;
}
}
ul.menu{
li{
a{
ul.menu {
li {
a {
margin-top: 0px;
text-transform: none;
font-weight: 400;
@ -283,13 +291,13 @@ nav.tabs {
display: flex;
margin-top: 40px;
margin-bottom: 40px;
-webkit-box-pack:start;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: center;
justify-content: flex-start;
border-bottom: 1px none #b3d8eb;
li{
li {
margin-right: 12px;
border-bottom: 2px solid #d3d3d3;
font-size: 20px;
@ -304,13 +312,15 @@ nav.tabs {
background: none;
color: #999;
&:hover, &.is-active{
&:hover,
&.is-active {
background-color: #fff;
color: #1e88e5;
}
}
&:hover, &.is-active{
&:hover,
&.is-active {
border-bottom-color: #1e88e5;
background-color: #fff;
color: #1e88e5;
@ -318,7 +328,7 @@ nav.tabs {
}
}
#user-menu{
#user-menu {
ul.user-menu-link {
list-style: none;
padding-inline-start: 0;
@ -327,3 +337,72 @@ nav.tabs {
margin-top: 5px;
}
}
.mobile-nav-menu {
position: fixed;
left: 0%;
top: 0%;
right: auto;
bottom: 0%;
z-index: 140;
background-color: #fff;
padding: 30px 20px;
min-width: 350px;
flex-direction: column;
overflow: auto;
box-shadow: 4px 4px 11px 0 rgba(0, 0, 0, 0.09);
.region-header-menu {
flex-direction: column;
.language-switcher-language-url{
padding-left: 10px;
}
a {
padding-top: 5px !important;
font-size: 19px !important;
&:hover{
border-bottom-color: white !important;
}
}
.block-menu {
flex-direction: column;
.list-elementi {
flex-direction: column !important;
padding-left: 10px !important;
.nav-li {
padding: 0;
}
}
}
}
.desni-elementi {
margin-top: 10px;
margin-left: 10px;
}
}
@media screen and (max-width: 991px) {
.nav-menu {
.region-header-menu,
.desni-elementi {
display: none !important;
}
.menu-icon {
display: block !important;
margin-top: 15px;
img {
height: 35px;
cursor: pointer;
}
}
}
}

1
frontend/drupal9/web/themes/custom/pro1ka/svg/icons8-close-menu.svg Normal file
View File

@ -0,0 +1 @@
<svg fill="#333333" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="150px" height="150px"><path d="M 9.15625 6.3125 L 6.3125 9.15625 L 22.15625 25 L 6.21875 40.96875 L 9.03125 43.78125 L 25 27.84375 L 40.9375 43.78125 L 43.78125 40.9375 L 27.84375 25 L 43.6875 9.15625 L 40.84375 6.3125 L 25 22.15625 Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 326 B

1
frontend/drupal9/web/themes/custom/pro1ka/svg/icons8-menu.svg Normal file
View File

@ -0,0 +1 @@
<svg fill="#333333" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="150px" height="150px"><path d="M 0 7.5 L 0 12.5 L 50 12.5 L 50 7.5 Z M 0 22.5 L 0 27.5 L 50 27.5 L 50 22.5 Z M 0 37.5 L 0 42.5 L 50 42.5 L 50 37.5 Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 240 B

3
frontend/drupal9/web/themes/custom/pro1ka/svg/icons8-user-manual-1.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3 4C2.44922 4 2 4.44922 2 5V18C2 19.1055 2.89453 20 4 20H10.5859C10.8008 20.5977 11.3633 21 12 21C12.6367 21 13.1992 20.5977 13.4102 20H20C21.1055 20 22 19.1055 22 18V5C22 4.44922 21.5508 4 21 4H16C14.3594 4 12.9102 4.80469 12 6.02734C11.0898 4.80469 9.64063 4 7.99609 4H3ZM16.5 7H17.5C17.7773 7 18 7.22266 18 7.5V8.5C18 8.77734 17.7773 9 17.5 9H16.5C16.2227 9 16 8.77734 16 8.5V7.5C16 7.22266 16.2227 7 16.5 7ZM17 11C17.5508 11 18 11.4492 18 12V15C18 15.5508 17.5508 16 17 16C16.4492 16 16 15.5508 16 15V12C16 11.4492 16.4492 11 17 11Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 666 B

38
frontend/drupal9/web/themes/custom/pro1ka/templates/page--front.html.twig
View File

@ -16,22 +16,22 @@
{# Uvodna slika #}
<div class="content">
<div class="section uvodni-slider">
<div class="slider-right">
<div class="section div-block-10 uvodni-slider">
<div class="slider-right kv-right-col">
<img src="/tema1ka/svg/slider-1.svg" loading="lazy" alt="" class="slider-slika s1">
<img src="/tema1ka/svg/slider-2.svg" loading="lazy" alt="" class="slider-slika s2">
<img src="/tema1ka/svg/slider-3.svg" loading="lazy" alt="" class="slider-slika s3">
</div>
<div class="slider-left">
<div class="container">
<h1 class="slider-title">
<div class="slider-left kvcol leftcol">
<div class="container maxw">
<h1 class="slider-title kv-heading">
{% if language.id == 'sl' %}
Minimalno število klikov
{% else %}
Minimal number of clicks
{% endif %}
</h1>
<p class="slider-subtitle">
<p class="slider-subtitle kv-subtext">
{% if language.id == 'sl' %}
ZMOGLJIVO, HITRO IN ENOSTAVNO ORODJE ZA ANKETIRANJE
{% else %}
@ -68,8 +68,8 @@
{% endif %}
</h2>
</div>
<div class="section-main">
<div class="col">
<div class="section-main functionalities">
<div class="col _4-12-12-12">
<img src="/tema1ka/svg/posameznik.svg" loading="lazy" alt="" class="ikona package">
{% if language.id == 'sl' %}
@ -105,7 +105,7 @@
</div>
<div class="col">
<div class="col _4-12-12-12">
<img src="/tema1ka/svg/skupine.svg" loading="lazy" alt="" class="ikona package">
@ -156,7 +156,7 @@
</h2>
</div>
<div class="section-main">
<div class="section-main functionalities">
<div class="flexcol">
<div class="content">
<div class="icon">
@ -510,7 +510,7 @@
</h2>
</div>
</div>
<div class="row flex">
<div class="row flex mnenja-up">
<div class="col _4-12-12-12">
<div class="testimonial-tile">
<div class="test-padding">
@ -608,7 +608,7 @@
{% if language.id == 'sl' %}
<h3 class="heading-2">NOVICE</h3>
<p>Razvijalci 1KA se zavzemamo za čim boljšo uporabniško izkušnjo, zato redno delimo novosti o orodju 1KA.</p>
<p class="mh2">Razvijalci 1KA se zavzemamo za čim boljšo uporabniško izkušnjo, zato redno delimo novosti o orodju 1KA.</p>
<div class="buttons-row buttons-center">
<a href="/d/sl/novice" class="button shrink secondary-button w-inline-block">
<div class="button-label">Preberi več</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow">
@ -617,7 +617,7 @@
</div>
{% else %}
<h3 class="heading-2">NEWS</h3>
<p>Comitted to providing the best possible experience, news about our product are shared frequently.</p>
<p class="mh2">Comitted to providing the best possible experience, news about our product are shared frequently.</p>
<div class="buttons-row buttons-center">
<a href="/d/sl/novice" class="button shrink secondary-button w-inline-block">
<div class="button-label">Read more</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow">
@ -638,7 +638,7 @@
{% if language.id == 'sl' %}
<h3 class="heading-2">O 1KA</h3>
<p>1KA je aplikacija, ki omogoča enostavno in dostopno spletno anketiranje.</p>
<p class="mh2">1KA je aplikacija, ki omogoča enostavno in dostopno spletno anketiranje.</p>
<div class="buttons-row buttons-center">
<a href="https://www.1ka.si/d/sl/o-1ka/nacini-uporabe-storitve-1ka/1ka-mobilna-aplikacija" class="button shrink secondary-button w-inline-block">
<div class="button-label">Preberi več</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow">
@ -647,7 +647,7 @@
</div>
{% else %}
<h3 class="heading-2">ABOUT 1KA</h3>
<p>1KA is a web survey software that makes survey creation easy and accessible.</p>
<p class="mh2">1KA is a web survey software that makes survey creation easy and accessible.</p>
<div class="buttons-row buttons-center">
<a href="https://www.1ka.si/d/sl/o-1ka/nacini-uporabe-storitve-1ka/1ka-mobilna-aplikacija" class="button shrink secondary-button w-inline-block">
<div class="button-label">Read more</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow">
@ -667,7 +667,7 @@
{% if language.id == 'sl' %}
<h3 class="heading-2">1KA PODPORA</h3>
<p>Ste ob izdelavi ankete naleteli na težavo? Kontaktirajte našo podporo uporabnikov.</p>
<p class="mh2">Ste ob izdelavi ankete naleteli na težavo? Kontaktirajte našo podporo uporabnikov.</p>
<div class="buttons-row buttons-center">
<a href="https://www.1ka.si/d/sl/pomoc/video-vodici" class="button shrink secondary-button w-inline-block">
<div class="button-label">Preberi več</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow" style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">
@ -676,7 +676,7 @@
</div>
{% else %}
<h3 class="heading-2">1KA SUPPORT</h3>
<p>Encountered a problem while creating your survey? Contact our customer support.</p>
<p class="mh2">Encountered a problem while creating your survey? Contact our customer support.</p>
<div class="buttons-row buttons-center">
<a href=" https://www.1ka.si/d/en/help/video-guides" class="button shrink secondary-button w-inline-block">
<div class="button-label">Read more</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow" style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">
@ -697,7 +697,7 @@
{% if language.id == 'sl' %}
<h3 class="heading-2">KAKO DELUJE?</h3>
<p>Vsem uporabnikom so na voljo priročniki, video vodiči in odgovori na pogosta vprašanja.</p>
<p class="mh2">Vsem uporabnikom so na voljo priročniki, video vodiči in odgovori na pogosta vprašanja.</p>
<div class="buttons-row buttons-center">
<a href="#" class="button shrink secondary-button w-inline-block">
<div class="button-label">Preberi več</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow" style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">
@ -706,7 +706,7 @@
</div>
{% else %}
<h3 class="heading-2">HOW DOES IT WORK?</h3>
<p>Manuals, video guides and answers to frequently asked questions are available to all users.</p>
<p class="mh2">Manuals, video guides and answers to frequently asked questions are available to all users.</p>
<div class="buttons-row buttons-center">
<a href="#" class="button shrink secondary-button w-inline-block">
<div class="button-label">Read more</div><img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow" style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg); transform-style: preserve-3d;">

5
frontend/drupal9/web/themes/custom/pro1ka/templates/page.html.twig
View File

@ -43,6 +43,11 @@
{{ page.sidebar_menu }}
</div>
{# floating button for toggling side menu #}
<div class="sidenav-toggle">
<img src="/tema1ka/svg/icons8-user-manual-1.svg" >
</div>
{# {% endif %}#}
{# END desni meni #}

56
frontend/drupal9/web/themes/custom/pro1ka/templates/parts/header.html.twig
View File

@ -87,6 +87,10 @@
{% endif %}
</div>
<div class="menu-icon">
<img class="toggleMenu" src="/tema1ka/svg/icons8-menu.svg">
</div>
</div>
</div>
@ -95,5 +99,57 @@
</div>
</div>
<div class="mobile-nav-menu" style="display: none;">
{% if page.header_menu %}
{{ page.header_menu }}
{% endif %}
<div class="desni-elementi">
<img src="/tema1ka/svg/icons-search-modra.svg" loading="lazy" alt="" class="searchbutton">
{% if uporabnik is not empty %}
<div class="usem-menu">
<a href="#" class="login" id="user-login-menu">
{{ uporabnik }}
<img src="/tema1ka/svg/icons8-chevron-right.svg" loading="lazy" alt="" class="button-right-arrow"
style="transform: rotateZ(90deg);">
<div id="user-menu" style="display: none;">
<div name="odjava" method="post" action="/api/drupal/logout">
<ul class="user-menu-link">
<li>
<a class="user-submenu-link" href="/admin/survey/index.php?a=nastavitve&m=global_user_myProfile">
<span class="sprites user_orange"
deluminate_imagetype="png"></span>{{ lang['edit2'] }}
</a>
</li>
<li>
<a class="user-submenu-link" href="#" id='poslji-odjavo'>
<span class="sprites logout" deluminate_imagetype="png"></span>{{ lang['logout'] }}
</a>
</li>
</ul>
</div>
</div>
</div>
{% elseif language.id == 'sl' %}
<a href="#" id="modal-open-login" class="login">
Prijava
</a>
<a href="#" id="modal-open-registration"class="register w-button">
Registracija
</a>
{% else %}
<a href="#" id="modal-open-login" class="login">
Login
</a>
<a href="#" id="modal-open-registration"class="register w-button">
Registration
</a>
{% endif %}
</div>
</div>
{# END Navigacija#}