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

Redesign - popravki oblike (dokoncan task od Nejca)

Browse Source
This commit is contained in:
pero1203 2022-09-07 11:19:32 +02:00
parent f46cccc9d6
commit d43018810e
3 changed files with 158 additions and 269 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
admin/survey/classes/class.SurveyTheme.php
View File

@ -590,7 +590,7 @@ class SurveyTheme {
$src = ''.SurveyInfo::getSurveyLink().'&grupa='.$grupa.'&no_preview=1&preview=on&theme_profile='.$row['id'].'';
$is_current_skin = ($rowa['skin_profile'] == $row['id']) ? true : false;
echo '<div class="theme_list">';
echo '<div class="theme_list" onclick="te_change_profile(\''.$row['id'].'\', true);">';
echo '<div class="theme">';
echo ' <span class="name">'.$skin_name.'</span>';
@ -598,22 +598,15 @@ class SurveyTheme {
echo ' <span class="desc">('.$lang['srv_current_theme_general'].')</span>';
echo '</div>';
//Gumbi
// show_settings(\''.$row['id'].'\');
// div z setingsi
// <div id="theme_additional_settings_'.$row['id'].'">
echo '<div class="options options'.$row['id'].'" id="options'.$row['id'].'">';
// echo '<button onclick="show_settings(\''.$row['id'].'\')"> <i class="fa-solid fa-ellipsis"></i> </button>';
echo '<span class="faicon dots" onclick="show_settings(\''.$row['id'].'\')" > </span>';
echo '<span class="faicon dots" onclick="show_settings(\''.$row['id'].'\'); event.stopPropagation();"> </span>';
echo '<div class="buttons-window displayNone" id="additional_settings_'.$row['id'].'">';
//Aktiviraj
echo '<div class="button" onclick="te_change_profile(\''.$row['id'].'\', true); return false;" title="'.$lang['srv_te_theme_activate2'].'">';
echo '<div class="button" onclick="te_change_profile(\''.$row['id'].'\', true); event.stopPropagation();" title="'.$lang['srv_te_theme_activate2'].'">';
echo '<span class="faicon fa-hand-pointer"></span>';
echo '<div class="aktiviraj">';
echo $lang['srv_te_theme_activate'] ;
@ -627,14 +620,14 @@ class SurveyTheme {
echo '</div>';
//Prilagodi
echo '<div class="button palette" onclick="window.location.href=\'index.php?anketa='.$this->sid.'&a=theme-editor&profile='.$row['id'].'\'" title="'.$lang['srv_te_theme_edit'].'">';
echo '<div class="button palette" onclick="window.location.href=\'index.php?anketa='.$this->sid.'&a=theme-editor&profile='.$row['id'].'\'; event.stopPropagation();" title="'.$lang['srv_te_theme_edit'].'">';
echo '<span class="faicon palette"></span>';
echo $lang['srv_te_theme_edit'];
echo '</div>';
//Izbriši
if ($groupId == -1) {
echo '<div class="button theme_delete" onclick="if (confirm(\''.$lang['srv_ask_delete'].'\')) te_delete_profile(\''.$row['id'].'\', false); return false;" title="'.$lang['srv_te_theme_delete2'].'">';
echo '<div class="button theme_delete" onclick="if (confirm(\''.$lang['srv_ask_delete'].'\')) te_delete_profile(\''.$row['id'].'\', false); event.stopPropagation();" title="'.$lang['srv_te_theme_delete2'].'">';
echo '<span class="faicon trash empty"></span>';
echo $lang['srv_anketadelete_txt'];
echo '</div>';
@ -657,7 +650,7 @@ class SurveyTheme {
$src = ''.SurveyInfo::getSurveyLink().'&grupa='.$grupa.'&no_preview=1&preview=on&theme_profile='.$row['id'].'&mobile=1';
$is_current_skin = ($rowa['skin_profile_mobile'] == $row['id']) ? true : false;
echo '<div class="theme_list">';
echo '<div class="theme_list" onclick="te_change_profile(\''.$row['id'].'\', true, true); return false;">';
echo '<div class="theme">';
echo '<span class="name">'.$skin_name.'</span>';
@ -668,13 +661,11 @@ class SurveyTheme {
//Gumbi
echo '<div class="options options_mobile'.$row['id'].'" id="options'.$row['id'].'">';
// echo '<button onclick="show_settings_mobile(\''.$row['id'].'\')"> <i class="fa-solid fa-ellipsis"></i> </button>';
echo '<span class="faicon dots" onclick="show_settings_mobile(\''.$row['id'].'\')" > </span>';
echo '<span class="faicon dots" onclick="show_settings_mobile(\''.$row['id'].'\'); event.stopPropagation();"></span>';
echo '<div class="buttons-window" id="additional_settings_mobile_'.$row['id'].'">';
//Aktiviraj
echo '<div class="button" onclick="te_change_profile(\''.$row['id'].'\', true, true); return false;" title="'.$lang['srv_te_theme_activate2'].'">';
echo '<div class="button" onclick="te_change_profile(\''.$row['id'].'\', true, true); event.stopPropagation();" title="'.$lang['srv_te_theme_activate2'].'">';
echo '<span class="faicon fa-hand-pointer"></span>';
echo '<div class="aktiviraj">';
echo $lang['srv_te_theme_activate'];
@ -688,14 +679,14 @@ class SurveyTheme {
echo '</div>';
//Prilagodi
echo '<div class="button palette" onclick="window.location.href=\'index.php?anketa='.$this->sid.'&a=theme-editor&profile='.$row['id'].'&mobile=1\'" title="'.$lang['srv_te_theme_edit'].'">';
echo '<div class="button palette" onclick="window.location.href=\'index.php?anketa='.$this->sid.'&a=theme-editor&profile='.$row['id'].'&mobile=1\'; event.stopPropagation();" title="'.$lang['srv_te_theme_edit'].'">';
echo '<span class="faicon palette"></span>';
echo $lang['srv_te_theme_edit'];
echo '</div>';
//Izbriši
if ($groupId == -1) {
echo '<div class="button theme_delete" onclick="if (confirm(\''.$lang['srv_ask_delete'].'\')) te_delete_profile(\''.$row['id'].'\', true); return false;" title="'.$lang['srv_te_theme_delete2'].'">';
echo '<div class="button theme_delete" onclick="if (confirm(\''.$lang['srv_ask_delete'].'\')) te_delete_profile(\''.$row['id'].'\', true); event.stopPropagation();" title="'.$lang['srv_te_theme_delete2'].'">';
echo '<span class="faicon trash empty"></span>';
echo $lang['srv_anketadelete_txt'];
echo '</div>';
@ -735,53 +726,29 @@ class SurveyTheme {
if(substr($skin, 0, 6) == 'Mobile')
$src .= '&mobile=1';
echo '<div class="theme_label '.($is_current_skin || $is_current_mobile_skin ? 'span_theme_current' : '').'">';
echo '<div class="theme_label_content">';
// Preview slika
$css = urlencode($skin);
$gid = $groupId;
if ($groupId == -1) echo '<a href="#" class="theme_delete theme" gid="'.$groupId.'" css="'.urlencode($skin).'">'.$lang['srv_anketadelete_txt'].'</a>';
echo '<div class="theme_label '.($is_current_skin || $is_current_mobile_skin ? 'span_theme_current' : '').'" onclick="changeTheme(\''.$gid.'\', \''.$css.'\');" title="'.$lang['srv_te_theme_activate2'].'">';
echo '<div class="theme_label_content">';
if ($groupId == -1)
echo '<a href="#" class="theme_delete theme" gid="'.$groupId.'" css="'.urlencode($skin).'">'.$lang['srv_anketadelete_txt'].'</a>';
if ($groupId == -1) {
echo '<button class="button wtext" onclick="changeTheme(\''.$gid.'\', \''.$css.'\');" title="'.$lang['srv_te_theme_activate2'].'"><img src="'.$site_url.'public/img/skins_previews/'.($groupId==-1?'usertheme':urlencode($simple_name)).'.png" gid="'.$groupId.'" css="'.urlencode($skin).'" alt="'.$simple_name.'" title="'.$lang['srv_changetheme'].'"></button>';
echo '<img src="'.$site_url.'public/img/skins_previews/'.($groupId==-1?'usertheme':urlencode($simple_name)).'.png" gid="'.$groupId.'" css="'.urlencode($skin).'" alt="'.$simple_name.'" title="'.$lang['srv_changetheme'].'">';
}
else
echo '<button class="button wtext" onclick="changeTheme(\''.$gid.'\', \''.$css.'\');" title="'.$lang['srv_te_theme_activate2'].'"><img src="'.$site_url.'public/img/skins_previews/'.urlencode($simple_name).'.png" class="theme" gid="'.$groupId.'" css="'.urlencode($skin).'" alt="'.$simple_name.'" title="'.$lang['srv_changetheme'].'"></button>';
// // Ime teme
// echo '<span class="theme_name">';
// echo self::strip_name($simple_name.($simple_name=='1kaBlue' || $simple_name=='MobileBlue' ? ' ('.$lang['default'].')' : ''));
// // Vprasajcki
// if( in_array($simple_name, array('Fdv', 'Cdi', 'Uni', 'MobileFdv', 'MobileCdi', 'MobileUni')) ){
// echo ' '.Help::display('srv_skins_Fdv');
// }
// elseif($simple_name == 'Embed' || $simple_name == 'Embed2' || $simple_name == 'Slideshow'){
// echo ' '.Help::display('srv_skins_'.$simple_name);
// }
// if($groupId == -1)
// echo ' (CSS)';
// echo '</span>';
echo '<img src="'.$site_url.'public/img/skins_previews/'.urlencode($simple_name).'.png" class="theme" gid="'.$groupId.'" css="'.urlencode($skin).'" alt="'.$simple_name.'" title="'.$lang['srv_changetheme'].'">';
echo '</div>';
//Gumbi
echo '<div class="theme_label_options">';
$css = urlencode($skin);
$gid = $groupId;
// // Aktiviraj
// echo '<div class="button wtext" onclick="changeTheme(\''.$gid.'\', \''.$css.'\');" title="'.$lang['srv_te_theme_activate2'].'">';
// echo ' <span class="faicon fa-hand-pointer"></span>';
// echo $lang['srv_te_theme_activate'];
// echo '</div>';
// Ime teme
echo "<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>";
echo '<span class="theme_name">';
@ -809,15 +776,11 @@ class SurveyTheme {
else
$link = 'index.php?anketa='.$this->sid.'&a=theme-editor&profile_new='.$rowa['skin'];
echo '<div class="button palette" onclick="window.location.href=\''.$link.'\'" title="'.$lang['srv_te_theme_edit'].'">';
echo ' <span class="faicon palette"></span>';
echo '</div>';
echo ' <span class="faicon palette" onclick="window.location.href=\''.$link.'\'; event.stopPropagation();" title="'.$lang['srv_te_theme_edit'].'"></span>';
}
// Predogled
echo '<div class="button theme_links_preview" src="'.$src.'" title="'.$lang['srv_poglejanketo2'].'">';
echo ' <span class="faicon fa-desktop"></span>';
echo '</div>';
echo ' <span class="faicon fa-desktop" onclick="window.location.href=\''.$src.'\'; event.stopPropagation();" title="'.$lang['srv_poglejanketo2'].'"></span>';
echo '</div>'; // div.buttons_flex

154
public/css/admin_new.css
View File

@ -20920,15 +20920,6 @@ textarea#addusers, textarea#addusers_note {
height: 120px;
}
.buttons-window.displayNone {
display: none;
}
.faicon.dots {
cursor: pointer;
color: #1e88e5;
}
div.page_tema h2 {
font-size: 24px;
margin-top: 32px;
@ -20969,116 +20960,86 @@ div.page_tema div.theme_list div.theme span.desc {
color: #777777;
margin-left: 6px;
}
div.page_tema div.theme_list .faicon.dots {
cursor: pointer;
color: #1e88e5;
}
div.page_tema div.theme_list div.options {
display: flex;
flex-direction: row;
position: relative;
}
div.page_tema div.theme_list div.options div.buttons-window {
z-index: 9999;
position: absolute;
bottom: 20px;
max-width: 113px;
box-shadow: 0px 0px 7px 0px #0000001F;
top: 32px;
right: -16px;
background: #FFFFFF;
box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.12);
border-radius: 2px;
margin-right: 5px;
background-color: #FFFF;
}
div.page_tema div.theme_list div.options div.buttons-window .button {
border: none;
margin: 8px 0px;
padding: 0px 16px;
text-align: center;
}
div.page_tema div.theme_list div.options div.buttons-window .button .faicon {
vertical-align: middle;
width: 14px;
height: 14px;
}
div.page_tema div.theme_list div.options div.buttons-window .button:first-of-type {
margin-top: 16px;
}
div.page_tema div.theme_list div.options div.buttons-window .button:last-of-type {
margin-bottom: 16px;
}
div.page_tema div.theme_list div.options div.buttons-window.active {
display: block;
}
div.page_tema div.theme_list div.options div.button {
background: #FFFFFF;
border: 1px solid #E5E5E5;
box-sizing: border-box;
border-radius: 2px;
height: 28px;
width: 100%;
div.page_tema div.theme_list div.options div.buttons-window .button {
cursor: pointer;
border: none;
display: flex;
align-items: center;
padding: 7px 12px;
margin-right: 8px;
justify-content: flex-start;
padding: 8px 16px;
font-size: 14px;
cursor: pointer;
color: #333333;
}
div.page_tema div.theme_list div.options div.buttons-window .button .faicon {
margin-right: 8px;
}
div.page_tema div.theme_list div.options div.buttons-window .button .faicon:before {
color: #1E88E5;
font-size: 14px;
}
div.page_tema div.theme_list div.options div.buttons-window .button:hover .faicon:before {
color: #0059ab;
transition: 0.2s;
}
div.page_tema div.theme_list div.options div.button:last-child {
margin-right: 0px;
div.page_tema div.theme_list div.options div.buttons-window .button:first-of-type {
padding-top: 16px;
}
div.page_tema div.theme_list div.options div.button span.faicon {
margin-right: 8px;
color: #1E88E5;
background-color: unset;
}
div.page_tema div.theme_list div.options div.button span.faicon:hover {
color: #0059AB;
}
div.page_tema div.theme_list div.options div.button:hover {
background-color: #f2f2f2;
div.page_tema div.theme_list div.options div.buttons-window .button:last-of-type {
padding-bottom: 16px;
}
div.page_tema div.div_theme_group.custom {
display: none;
}
div.page_tema div.div_theme_group.custom .theme_list {
cursor: pointer;
transition: 0.2s;
}
div.page_tema div.div_theme_group.custom .theme_list:hover {
background-color: #F8F8F8;
}
div.page_tema div#theme_grid_holder {
display: flex;
justify-content: center;
padding: 0px 32px;
padding: 0px;
}
div.page_tema div#theme_grid_holder div.div_theme_group {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-gap: 16px;
box-sizing: border-box;
}
@media (max-width: 1380px) {
div.page_tema div#theme_grid_holder div.div_theme_group {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
}
@media (max-width: 1180px) {
div.page_tema div#theme_grid_holder div.div_theme_group {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
}
@media (max-width: 980px) {
div.page_tema div#theme_grid_holder div.div_theme_group {
grid-template-columns: 1fr 1fr 1fr;
}
}
@media (max-width: 780px) {
div.page_tema div#theme_grid_holder div.div_theme_group {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width: 480px) {
div.page_tema div#theme_grid_holder div.div_theme_group {
grid-template-columns: 1fr;
}
display: flex;
flex-wrap: wrap;
gap: 16px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label {
cursor: pointer;
width: 259px;
max-height: 265px;
box-sizing: border-box;
padding: 16px;
background-color: #F8F8F8;
border: 1px solid #F8F8F8;
padding: 14px 16px;
margin-bottom: 16px;
transition: 0.2s;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label:hover {
background-color: #F2F2F2;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_content {
max-height: 169px;
@ -21103,7 +21064,6 @@ div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_l
justify-content: space-between;
box-sizing: border-box;
margin-top: 16px;
margin-bottom: 2px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options span.theme_name {
font-weight: 600;
@ -21119,8 +21079,18 @@ div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_l
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex {
display: flex;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex .button.palette {
margin-right: 8px;
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex span.faicon {
cursor: pointer;
color: #1E88E5;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex span.faicon:before {
font-size: 14px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex span.faicon.palette {
margin-right: 16px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options .buttons_flex span.faicon:hover {
color: #0059ab;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options div.button {
background: #FFFFFF;
@ -21137,12 +21107,6 @@ div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_l
cursor: pointer;
transition: 0.2s;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options div.button span.faicon {
margin: 0;
color: #1E88E5;
width: 14px;
height: 14px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options div.button span.faicon:hover {
color: #0059AB;
}
@ -21150,7 +21114,7 @@ div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_l
padding: 7px 12px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options div.button.wtext span.faicon {
margin-right: 8px;
margin-right: 16px;
}
div.page_tema div#theme_grid_holder div.div_theme_group div.theme_label .theme_label_options div.button:hover {
background-color: #f2f2f2;

192
resources/sass/admin_new/pages/survey_edit/oblika_teme.scss
View File

@ -1,14 +1,3 @@
.buttons-window.displayNone{
display: none;
}
.faicon.dots{
cursor: pointer;
color: #1e88e5;
}
// Oblika - prva stran, meni s temami
div.page_tema {
@ -67,7 +56,10 @@ div.page_tema {
}
.faicon.dots{
cursor: pointer;
color: #1e88e5;
}
//Gumbi
@ -77,141 +69,104 @@ div.page_tema {
position: relative;
div.buttons-window{
z-index: 9999;
position: absolute;
bottom: 20px;
max-width: 113px;
// display: none;
box-shadow: 0px 0px 7px 0px #0000001F;
top: 32px;
right: -16px;
background: #FFFFFF;
box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.12);
border-radius: 2px;
margin-right: 5px;
background-color: #FFFF;
.button.palette{
// padding-bottom: 20px;
}
.button{
border: none;
// margin: 8px auto 8px auto;
margin: 8px 0px;
padding: 0px 16px;
text-align: center;
.faicon{
vertical-align: middle;
width: 14px;
height: 14px;
}
}
.button:first-of-type{
margin-top: 16px;
}
.button:last-of-type{
margin-bottom: 16px;
}
}
div.buttons-window.active {
&.active {
display: block;
}
div.button {
background: $white;
border: 1px solid $gray;
box-sizing: border-box;
border-radius: 2px;
height: 28px;
width: 100%;
display: flex;
align-items: center;
padding: 7px 12px;
margin-right: 8px;
&:last-child {
margin-right: 0px;
}
font-size: 14px;
.button{
cursor: pointer;
span.faicon {
border: none;
display: flex;
align-items: center;
justify-content: flex-start;
padding: 8px 16px;
font-size: 14px;
color: $black;
.faicon{
margin-right: 8px;
&:before{
color: $blue;
background-color: unset;
font-size: 14px;
}
span.faicon:hover{
color: #0059AB;
}
&:hover{
.faicon:before{
color: $dark-blue;
transition: 0.2s;
&:hover {
background-color: darken($white,5%);
}
}
}
.button:first-of-type{
padding-top: 16px;
}
.button:last-of-type{
padding-bottom: 16px;
}
}
}
}
div.div_theme_group {
&.custom {
display: none;
.theme_list{
cursor: pointer;
transition: 0.2s;
&:hover{
background-color: $light-gray;
}
}
}
}
//Splošne teme - GRID
div#theme_grid_holder {
display: flex;
justify-content: center;
padding: 0px 32px;
padding: 0px;
div.div_theme_group {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-gap: 16px;
box-sizing: border-box;
@media (max-width: 1380px) {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
@media (max-width: 1180px) {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
@media (max-width: 980px) {
grid-template-columns: 1fr 1fr 1fr;
}
@media (max-width: 780px) {
grid-template-columns: 1fr 1fr;
}
@media (max-width: 480px) {
grid-template-columns: 1fr;
}
display: flex;
flex-wrap: wrap;
gap: 16px;
div.theme_label {
cursor: pointer;
width: 259px;
max-height: 265px;
box-sizing: border-box;
padding: 16px;
background-color: $light-gray;
border: 1px solid $light-gray;
padding: 14px 16px;
margin-bottom: 16px;
transition: 0.2s;
&:hover{
background-color: $light-gray2;
}
.theme_label_content{
@ -249,7 +204,6 @@ div.page_tema {
justify-content: space-between;
box-sizing: border-box;
margin-top: 16px;
margin-bottom: 2px;
span.theme_name {
font-weight: 600;
@ -269,8 +223,21 @@ div.page_tema {
.buttons_flex{
display: flex;
.button.palette{
margin-right: 8px;
span.faicon {
cursor: pointer;
color: $blue;
&:before{
font-size: 14px;
}
&.palette{
margin-right: 16px;
}
&:hover{
color: $dark-blue;
}
}
}
@ -294,12 +261,7 @@ div.page_tema {
cursor: pointer;
span.faicon {
margin: 0;
color: $blue;
width: 14px;
height: 14px;
}
span.faicon:hover{
color: #0059AB;
}
@ -308,7 +270,7 @@ div.page_tema {
padding: 7px 12px;
span.faicon {
margin-right: 8px;
margin-right: 16px;
}
}