summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/assets/styles/mixins_old.less
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/assets/styles/mixins_old.less')
-rw-r--r--catalog-ui/src/assets/styles/mixins_old.less558
1 files changed, 558 insertions, 0 deletions
diff --git a/catalog-ui/src/assets/styles/mixins_old.less b/catalog-ui/src/assets/styles/mixins_old.less
new file mode 100644
index 0000000000..8a4f609497
--- /dev/null
+++ b/catalog-ui/src/assets/styles/mixins_old.less
@@ -0,0 +1,558 @@
+@import "variables";
+
+.font-color {
+ .a {color: @color_a;}
+ .b {color: @color_b;}
+ .c {color: @color_c;}
+ .d {color: @color_d;}
+ .e {color: @color_e;}
+ .f {color: @color_f;}
+ .g {color: @color_g;}
+ .h {color: @color_h;}
+ .i {color: @color_i;}
+ .j {color: @color_j;}
+ .k {color: @color_k;}
+ .l {color: @color_l;}
+ .m {color: @color_m;}
+ .n {color: @color_n;}
+ .o {color: @color_o;}
+ .p {color: @color_p;}
+ .q {color: @color_q;}
+ .r {color: @color_r;}
+ .s {color: @color_s;}
+ .t {color: @color_t;}
+ .u {color: @color_t;}
+ .v {color: @color_t;}
+ .w {color: @color_t;}
+ .x {color: @color_t;}
+ .y {color: @color_t;}
+ .z {color: @color_z;}
+ .zz {color: @color_zz;}
+
+ .hover {
+ .a {color: @color_a_hover;}
+ .b {color: @color_b_hover;}
+ .c {color: @color_c_hover;}
+ .d {color: @color_d_hover;}
+ .e {color: @color_e_hover;}
+ .f {color: @color_f_hover;}
+ .g {color: @color_g_hover;}
+ .h {color: @color_h_hover;}
+ .i {color: @color_i_hover;}
+ .j {color: @color_j_hover;}
+ .k {color: @color_k_hover;}
+ .l {color: @color_l_hover;}
+ .m {color: @color_m_hover;}
+ .n {color: @color_n_hover;}
+ .o {color: @color_o_hover;}
+ .p {color: @color_p_hover;}
+ .q {color: @color_q_hover;}
+ .r {color: @color_r_hover;}
+ .s {color: @color_s_hover;}
+ .t {color: @color_t_hover;}
+ .u {color: @color_u_hover;}
+ .v {color: @color_v_hover;}
+ .w {color: @color_w_hover;}
+ .x {color: @color_x_hover;}
+ .y {color: @color_y_hover;}
+ .z {color: @color_z_hover;}
+ .zz {color: @color_zz_hover;}
+ }
+}
+
+.font-type {
+ ._1 {
+ font-family: @font-omnes-regular;
+ font-size: 14px;
+ }
+ ._2 {
+ font-family: @font-omnes-regular;
+ font-size: 20px;
+ }
+ ._3 {
+ font-family: @font-omnes-regular;
+ font-size: 12px;
+ }
+ ._4 {
+ font-family: @font-omnes-regular;
+ font-size: 16px;
+ }
+ ._5 {
+ font-family: @font-omnes-medium;
+ font-size: 30px;
+ }
+ ._6 {
+ font-family: @font-omnes-medium;
+ font-size: 16px;
+ }
+ ._7 {
+ font-family: @font-omnes-medium;
+ font-size: 14px;
+ }
+ ._8 {
+ font-family: @font-omnes-regular;
+ font-size: 11px;
+ }
+ ._9 {
+ font-family: @font-omnes-regular;
+ font-size: 13px;
+ }
+ ._10 {
+ font-family: @font-omnes-regular;
+ font-size: 18px;
+ }
+ ._11 {
+ font-family: @font-omnes-medium;
+ font-size: 20px;
+ }
+ ._12 {
+ font-family: @font-omnes-medium;
+ font-size: 17px;
+ }
+ ._13 {
+ font-family: @font-omnes-medium;
+ font-size: 12px;
+ }
+ ._14 {
+ font-family: @font-omnes-medium;
+ font-size: 11px;
+ }
+ ._15 {
+ font-family: @font-omnes-medium;
+ font-size: 24px;
+ }
+ ._16 {
+ font-family: @font-omnes-regular;
+ font-size: 10px;
+ }
+ ._17 {
+ font-family: @font-omnes-medium;
+ font-size: 15px;
+ }
+ ._18 {
+ font-family: @font-omnes-regular;
+ font-size: 15px;
+ }
+ ._19 {
+ font-family: @font-omnes-medium;
+ font-size: 18px;
+ }
+}
+
+.a_1 {.font-color > .a; .font-type > ._1;}
+.a_2 {.font-color > .a; .font-type > ._2;}
+.a_3 {.font-color > .a; .font-type > ._3;}
+.a_4 {.font-color > .a; .font-type > ._4;}
+.a_5 {.font-color > .a; .font-type > ._5;}
+.a_6 {.font-color > .a; .font-type > ._6;}
+.a_7 {.font-color > .a; .font-type > ._7;}
+.a_8 {.font-color > .a; .font-type > ._8;}
+.a_9 {.font-color > .a; .font-type > ._9;}
+.a_10 {.font-color > .a; .font-type > ._10;}
+.a_15 {.font-color > .a; .font-type > ._15;}
+
+.b_1 {.font-color > .b; .font-type > ._1;}
+.b_3 {.font-color > .b; .font-type > ._3;}
+.b_4 {.font-color > .b; .font-type > ._4;}
+.b_5 {.font-color > .b; .font-type > ._5;}
+.b_6 {.font-color > .b; .font-type > ._6;}
+.b_7 {.font-color > .b; .font-type > ._7;}
+.b_9 {.font-color > .b; .font-type > ._9;}
+.b_10 {.font-color > .b; .font-type > ._10;}
+.b_11 {.font-color > .b; .font-type > ._11;}
+.b_13 {.font-color > .b; .font-type > ._13;}
+.b_15 {.font-color > .b; .font-type > ._15;}
+.b_17 {.font-color > .b; .font-type > ._17;}
+.b_19 {.font-color > .b; .font-type > ._19;}
+
+.c_1 {.font-color > .c; .font-type > ._1;}
+.c_2 {.font-color > .c; .font-type > ._2;}
+.c_3 {.font-color > .c; .font-type > ._3;}
+.c_4 {.font-color > .c; .font-type > ._4;}
+.c_5 {.font-color > .c; .font-type > ._5;}
+.c_6 {.font-color > .c; .font-type > ._6;}
+.c_7 {.font-color > .c; .font-type > ._7;}
+.c_8 {.font-color > .c; .font-type > ._8;}
+.c_9 {.font-color > .c; .font-type > ._9;}
+.c_10 {.font-color > .c; .font-type > ._10;}
+.c_11 {.font-color > .c; .font-type > ._11;}
+.c_15 {.font-color > .c; .font-type > ._15;}
+.c_16 {.font-color > .c; .font-type > ._16;}
+.c_17 {.font-color > .c; .font-type > ._17;}
+.c_18 {.font-color > .c; .font-type > ._18;}
+
+.d_1 {.font-color > .d; .font-type > ._1;}
+.d_2 {.font-color > .d; .font-type > ._2;}
+.d_3 {.font-color > .d; .font-type > ._3;}
+.d_4 {.font-color > .d; .font-type > ._4;}
+.d_5 {.font-color > .d; .font-type > ._5;}
+.d_6 {.font-color > .d; .font-type > ._6;}
+.d_12 {.font-color > .d; .font-type > ._12;}
+
+.e_1 {.font-color > .e; .font-type > ._1;}
+.e_2 {.font-color > .e; .font-type > ._2;}
+.e_3 {.font-color > .e; .font-type > ._3;}
+.e_4 {.font-color > .e; .font-type > ._4;}
+.e_5 {.font-color > .e; .font-type > ._5;}
+.e_6 {.font-color > .e; .font-type > ._6;}
+.e_7 {.font-color > .e; .font-type > ._7;}
+
+.f_1 {.font-color > .f; .font-type > ._1;}
+.f_2 {.font-color > .f; .font-type > ._2;}
+
+.g_1 {.font-color > .g; .font-type > ._1;}
+.g_2 {.font-color > .g; .font-type > ._2;}
+.g_3 {.font-color > .g; .font-type > ._3;}
+.g_4 {.font-color > .g; .font-type > ._4;}
+.g_5 {.font-color > .g; .font-type > ._5;}
+.g_6 {.font-color > .g; .font-type > ._6;}
+.g_7 {.font-color > .g; .font-type > ._7;}
+.g_8 {.font-color > .g; .font-type > ._8;}
+.g_9 {.font-color > .g; .font-type > ._9;}
+.g_10 {.font-color > .g; .font-type > ._10;}
+.g_13 {.font-color > .g; .font-type > ._13;}
+.g_14 {.font-color > .g; .font-type > ._14;}
+
+.h_1 {.font-color > .h; .font-type > ._1;}
+.h_7 {.font-color > .h; .font-type > ._7;}
+.h_9 {.font-color > .h; .font-type > ._9;}
+
+.i_1 {.font-color > .i; .font-type > ._1;}
+.i_6 {.font-color > .i; .font-type > ._6;}
+.i_11 {.font-color > .i; .font-type > ._11;}
+.i_17 {.font-color > .i; .font-type > ._17;}
+
+.l_1 {.font-color > .l; .font-type > ._1;}
+.l_9 {.font-color > .l; .font-type > ._9;}
+
+.m_4 {.font-color > .m; .font-type > ._4;}
+.m_7 {.font-color > .m; .font-type > ._7;}
+
+.p_1 {.font-color > .p; .font-type > ._1;}
+.p_3 {.font-color > .p; .font-type > ._3;}
+.p_9 {.font-color > .p; .font-type > ._9;}
+
+.q_7 {.font-color > .q; .font-type > ._7;}
+.q_9 {.font-color > .q; .font-type > ._9;}
+.q_11 {.font-color > .q; .font-type > ._11;}
+
+.r_12 {.font-color > .r; .font-type > ._12;}
+
+.t_1 {.font-color > .t; .font-type > ._1;}
+.t_7 {.font-color > .t; .font-type > ._7;}
+.t_15 {.font-color > .t; .font-type > ._15;}
+
+/* Added by ikram - */
+.s_12 {.font-color > .s; .font-type > ._12;}
+
+.z_9 {.font-color > .z; .font-type > ._9;}
+.backgroundColor {
+ .a {background-color: @color_a;}
+ .b {background-color: @color_b;}
+ .c {background-color: @color_c;}
+ .d {background-color: @color_d;}
+ .e {background-color: @color_e;}
+ .f {background-color: @color_f;}
+ .g {background-color: @color_g;}
+ .h {background-color: @color_h;}
+ .i {background-color: @color_i;}
+ .j {background-color: @color_j;}
+ .k {background-color: @color_k;}
+ .l {background-color: @color_l;}
+ .m {background-color: @color_m;}
+ .n {background-color: @color_n;}
+ .o {background-color: @color_o;}
+ .p {background-color: @color_p;}
+ .q {background-color: @color_q;}
+ .r {background-color: @color_r;}
+ .s {background-color: @color_s;}
+ .t {background-color: @color_t;}
+ .u {background-color: @color_u;}
+ .v {background-color: @color_v;}
+ .w {background-color: @color_w;}
+ .x {background-color: @color_x;}
+ .y {background-color: @color_y;}
+ .z {background-color: @color_z;}
+ .zz {background-color: @color_zz;}
+
+ .hover {
+ .a {background-color: @color_a_hover;}
+ .b {background-color: @color_b_hover;}
+ .c {background-color: @color_c_hover;}
+ .d {background-color: @color_d_hover;}
+ .e {background-color: @color_e_hover;}
+ .f {background-color: @color_f_hover;}
+ .g {background-color: @color_g_hover;}
+ .h {background-color: @color_h_hover;}
+ .i {background-color: @color_i_hover;}
+ .j {background-color: @color_j_hover;}
+ .k {background-color: @color_k_hover;}
+ .l {background-color: @color_l_hover;}
+ .m {background-color: @color_m_hover;}
+ .n {background-color: @color_n_hover;}
+ .o {background-color: @color_o_hover;}
+ .p {background-color: @color_p_hover;}
+ .q {background-color: @color_q_hover;}
+ .r {background-color: @color_r_hover;}
+ .s {background-color: @color_s_hover;}
+ .t {background-color: @color_t_hover;}
+ .u {background-color: @color_u_hover;}
+ .v {background-color: @color_v_hover;}
+ .w {background-color: @color_w_hover;}
+ .x {background-color: @color_x_hover;}
+ .y {background-color: @color_y_hover;}
+ .z {background-color: @color_z_hover;}
+ .zz {background-color: @color_zz_hover;}
+ }
+}
+
+.bg_a {.backgroundColor > .a;}
+.bg_b {.backgroundColor > .b;}
+.bg_c {.backgroundColor > .c;}
+.bg_d {.backgroundColor > .d;}
+.bg_e {.backgroundColor > .e;}
+.bg_f {.backgroundColor > .f;}
+.bg_g {.backgroundColor > .g;}
+.bg_h {.backgroundColor > .h;}
+.bg_i {.backgroundColor > .i;}
+.bg_j {.backgroundColor > .j;}
+.bg_k {.backgroundColor > .k;}
+.bg_l {.backgroundColor > .l;}
+.bg_m {.backgroundColor > .m;}
+.bg_n {.backgroundColor > .n;}
+.bg_o {.backgroundColor > .o;}
+.bg_p {.backgroundColor > .p;}
+.bg_q {.backgroundColor > .q;}
+.bg_r {.backgroundColor > .r;}
+.bg_s {.backgroundColor > .s;}
+.bg_t {.backgroundColor > .t;}
+.bg_u {.backgroundColor > .u;}
+.bg_v {.backgroundColor > .v;}
+.bg_w {.backgroundColor > .w;}
+.bg_x {.backgroundColor > .x;}
+.bg_y {.backgroundColor > .y;}
+.bg_z {.backgroundColor > .z;}
+.bg_zz {.backgroundColor > .zz;}
+
+.bg_a_hover {.backgroundColor > .hover > .a;}
+.bg_b_hover {.backgroundColor > .hover > .b;}
+.bg_c_hover {.backgroundColor > .hover > .c;}
+.bg_d_hover {.backgroundColor > .hover > .d;}
+.bg_e_hover {.backgroundColor > .hover > .e;}
+.bg_f_hover {.backgroundColor > .hover > .f;}
+.bg_g_hover {.backgroundColor > .hover > .g;}
+.bg_h_hover {.backgroundColor > .hover > .h;}
+.bg_i_hover {.backgroundColor > .hover > .i;}
+.bg_j_hover {.backgroundColor > .hover > .j;}
+.bg_l_hover {.backgroundColor > .hover > .l;}
+.bg_m_hover {.backgroundColor > .hover > .m;}
+.bg_n_hover {.backgroundColor > .hover > .n;}
+.bg_o_hover {.backgroundColor > .hover > .o;}
+.bg_p_hover {.backgroundColor > .hover > .p;}
+.bg_q_hover {.backgroundColor > .hover > .q;}
+.bg_r_hover {.backgroundColor > .hover > .r;}
+.bg_s_hover {.backgroundColor > .hover > .s;}
+.bg_t_hover {.backgroundColor > .hover > .t;}
+.bg_u_hover {.backgroundColor > .hover > .u;}
+.bg_v_hover {.backgroundColor > .hover > .v;}
+.bg_w_hover {.backgroundColor > .hover > .w;}
+.bg_x_hover {.backgroundColor > .hover > .x;}
+.bg_y_hover {.backgroundColor > .hover > .y;}
+.bg_z_hover {.backgroundColor > .hover > .z;}
+.bg_zz_hover {.backgroundColor > .hover > .zz;}
+
+.center {margin: 0 auto;}
+.vcenter {display: table-cell;vertical-align: middle;}
+.left {float: left;}
+.right {float: right;}
+.hand {cursor: pointer;}
+.default-pointer {cursor: default;}
+.text-center {text-align: center;}
+.display-none {display: none;}
+.nowrap {white-space: nowrap;}
+.bold {font-weight: bold;}
+.full-height {height: 100%;}
+.uppercase {text-transform: uppercase;}
+.capitalize {text-transform: capitalize;}
+.disabled {
+ //background-color: #f2f2f2;
+ //border-color: #d8d8d8;
+ //background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIklEQVQIW2NkQAKrVq36zwjjgzhhYWGMYAEYB8RmROaABADeOQ8CXl/xfgAAAABJRU5ErkJggg==) repeat;
+ //color: @color_m;
+}
+
+.border-radius(@radius) {
+ -webkit-border-radius: @radius;
+ -moz-border-radius: @radius;
+ border-radius: @radius;
+}
+
+.border-radius-top-left(@radius) {
+ -webkit-border-top-left-radius: @radius;
+ -moz-border-radius-topleft: @radius;
+ -khtml-border-top-left-radius: @radius;
+ border-top-left-radius: @radius;
+}
+
+.border-radius-top-right(@radius) {
+ -webkit-border-top-right-radius: @radius;
+ -moz-border-radius-topright: @radius;
+ -khtml-border-top-right-radius: @radius;
+ border-top-right-radius: @radius;
+}
+
+.border-radius-bottom-left(@radius) {
+ -webkit-border-bottom-left-radius: @radius;
+ -moz-border-radius-bottomleft: @radius;
+ -khtml-border-bottom-left-radius: @radius;
+ border-bottom-left-radius: @radius;
+}
+
+.border-radius-bottom-right(@radius) {
+ -webkit-border-bottom-right-radius: @radius;
+ -moz-border-radius-bottomright: @radius;
+ -khtml-border-bottom-right-radius: @radius;
+ border-bottom-right-radius: @radius;
+}
+
+.opacity(@opacity: 0.5) {
+ -moz-opacity: @opacity;
+ -khtml-opacity: @opacity;
+ -webkit-opacity: @opacity;
+ opacity: @opacity;
+}
+
+.box-shadow(@arguments) {
+ -webkit-box-shadow: @arguments;
+ -moz-box-shadow: @arguments;
+ box-shadow: @arguments;
+}
+
+.square(@size) {
+ width: @size;
+ height: @size;
+}
+
+.selfClear:after {
+ content: ".";
+ display: block;
+ height: 0px;
+ clear: both;
+ visibility: hidden;
+}
+.selfClear {
+ display: inline-block;
+}
+
+.clearfix:after {
+ content: ".";
+ display: block;
+ clear: both;
+ visibility: hidden;
+ line-height: 0;
+ height: 0;
+}
+
+.clearfix {
+ display: inline-block;
+ clear: both;
+}
+
+.gradient(@d; @st; @st_o; @ec; @ec_0;){
+ background: -webkit-linear-gradient(@d, @st @st_o, @ec @ec_0);
+ background: -moz-linear-gradient(@d, @st @st_o, @ec @ec_0);
+ background: -o-linear-gradient(@d, @st @st_o, @ec @ec_0);
+ background: -ms-linear-gradient(@d, @st @st_o, @ec @ec_0);
+ background: linear-gradient(@d, @st @st_o, @ec @ec_0);
+}
+
+.hyphenate {
+ -ms-word-break: break-all;
+ word-break: break-all;
+
+ // Non standard for webkit
+ word-break: break-word;
+
+ -webkit-hyphens: auto;
+ -moz-hyphens: auto;
+ hyphens: auto;
+}
+
+.user-select (@val;) {
+ -webkit-touch-callout: none;
+ -webkit-user-select: @val;
+ -khtml-user-select: @val;
+ -moz-user-select: @val;
+ -ms-user-select: @val;
+ user-select: @val;
+}
+
+.flex-fixed (@width) {
+ flex-basis: @width;
+ flex-grow: 0;
+ flex-shrink: 0;
+}
+
+.perfect-scrollbar {
+ position: relative;
+ overflow: hidden;
+}
+
+.noselect {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.arrow(@size, @color){
+ content: '';
+ position: absolute;
+ top: 50%;
+ right: 100%;
+ margin-top: -@size;
+ width: 0;
+ height: 0;
+ border-right: @size solid @color;
+ border-top: @size solid transparent;
+ border-bottom: @size solid transparent;
+}
+
+.circle(@size, @color){
+ background-color: @color;
+ .border-radius(50%);
+ color: @color_c;
+ content: '';
+ height: @size;
+ width: @size;
+ text-align: center;
+ display: block;
+}
+
+.sdc-ellipsis{
+ text-overflow: ellipsis;
+ overflow: hidden;
+ display: inline-block;
+ white-space: nowrap;
+ }
+
+// Works with animate.css
+.animation-duration(@seconds) {
+ animation-duration: @seconds; //3s
+ -webkit-animation-duration: @seconds;
+ -moz-animation-duration: @seconds;
+}
+
+.animation-delay(@seconds) {
+ animation-delay: @seconds; //3s
+ -webkit-animation-delay: @seconds;
+ -moz-animation-delay: @seconds;
+}
+
+.animation-iterations(@iterations) {
+ animation-iteration-count: @iterations; // infinite;
+ -webkit-animation-iteration-count: @iterations;
+ -moz-animation-iteration-count: @iterations;
+}