';
-
- // Preview slika
+ // Preview slika
$css = urlencode($skin);
$gid = $groupId;
- if ($groupId == -1) echo '
'.$lang['srv_anketadelete_txt'].'';
+ echo '
';
+
+ echo '
';
+
+ if ($groupId == -1)
+ echo '
'.$lang['srv_anketadelete_txt'].'';
if ($groupId == -1) {
- echo '
';
+ echo '
!['.$lang['srv_changetheme'].' '.$simple_name.']('.$site_url.'public/img/skins_previews/'.($groupId==-1?'usertheme':urlencode($simple_name)).'.png)
';
}
else
- echo '
';
-
- // // Ime teme
- // echo '
';
- // 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 '';
-
+ echo '
!['.$lang['srv_changetheme'].' '.$simple_name.']('.$site_url.'public/img/skins_previews/'.urlencode($simple_name).'.png)
';
+
echo '
';
//Gumbi
echo '
';
- $css = urlencode($skin);
- $gid = $groupId;
-
- // // Aktiviraj
- // echo '
';
- // echo ' ';
- // echo $lang['srv_te_theme_activate'];
- // echo '
';
-
// Ime teme
echo "
";
echo '
';
@@ -809,15 +776,11 @@ class SurveyTheme {
else
$link = 'index.php?anketa='.$this->sid.'&a=theme-editor&profile_new='.$rowa['skin'];
- echo '';
- echo ' ';
- echo '
';
+ echo ' ';
}
// Predogled
- echo '';
- echo ' ';
- echo '
';
+ echo ' ';
echo ''; // div.buttons_flex
diff --git a/public/css/admin_new.css b/public/css/admin_new.css
index 5be71adb8..8dede5062 100644
--- a/public/css/admin_new.css
+++ b/public/css/admin_new.css
@@ -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;
diff --git a/resources/sass/admin_new/pages/survey_edit/oblika_teme.scss b/resources/sass/admin_new/pages/survey_edit/oblika_teme.scss
index cbc5be229..29a82e86f 100644
--- a/resources/sass/admin_new/pages/survey_edit/oblika_teme.scss
+++ b/resources/sass/admin_new/pages/survey_edit/oblika_teme.scss
@@ -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;
+ &.active {
+ display: block;
}
.button{
+ cursor: pointer;
+
border: none;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
- // margin: 8px auto 8px auto;
- margin: 8px 0px;
- padding: 0px 16px;
-
- text-align: center;
+ padding: 8px 16px;
+ font-size: 14px;
+ color: $black;
.faicon{
- vertical-align: middle;
- width: 14px;
- height: 14px;
+ margin-right: 8px;
+ &:before{
+ color: $blue;
+ font-size: 14px;
+ }
+ }
+
+ &:hover{
+ .faicon:before{
+ color: $dark-blue;
+
+ transition: 0.2s;
+ }
}
}
.button:first-of-type{
- margin-top: 16px;
+ padding-top: 16px;
}
.button:last-of-type{
- margin-bottom: 16px;
+ padding-bottom: 16px;
}
-
-
}
- div.buttons-window.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;
-
- cursor: pointer;
-
- span.faicon {
- margin-right: 8px;
- color: $blue;
- background-color: unset;
- }
- span.faicon:hover{
- color: #0059AB;
- }
-
- transition: 0.2s;
- &:hover {
- background-color: darken($white,5%);
- }
-
- }
-
}
}
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;
}
}