Dynamic CSS

Mystique

« Older   Newer »
 
  Share  
.
  1.     +1   -1
     
    .
    Avatar

    Audaces Fortuna Iuvat

    Group
    Administrator
    Posts
    9,832
    Reputation
    0
    Location
    test

    Status
    Offline
    CODICE
    var skinArrays = {
           array1: ["#42aad6","#f0689d","#d43c3e","#e26446","#e4b23c","#5fa848","#426b8e","#7251cd","#5eb889","#695c4f","#333535"],
           array2: ["border-radius: 10px 10px 0 0","border-radius: 30px 30px 0 0","border-radius: 5px 5px 0 0"],
           array3: ["http://dumpshare.net/images/657134purty_wood.png","http://dumpshare.net/images/6110582batthern.png","http://dumpshare.net/images/3174288back_pattern.png","http://dumpshare.net/images/7131027arches.png","http://dumpshare.net/images/2571430arabesque.png","http://dumpshare.net/images/3725829always_grey.png","http://dumpshare.net/images/9596259tileable_wood.png"],
           array4: ["12px","14px","16px","18px"],
           array5: ["#333535","#42aad6","#f0689d","#d43c3e","#e26446","#e4b23c","#5fa848","#426b8e","#7251cd","#5eb889","#695c4f"]
        },
        skinSettings = {
           color_1: {type: "hex", name: "Sfondo, title e dettagli vari", set: skinArrays.array5},
                   color_1_1: {base: "color_1", light: 10, saturate: -10, bright: 2, greyscale: false},
                   color_1_2: {base: "color_1", light: -5, saturate: -2, greyscale: false},
           color_2: {type: "hex", name: "Mback e colori primari", set: skinArrays.array1},
                   color_2_1: {base: "color_2", light: 20, saturate: 10, bright: 10, greyscale: false},
                   color_2_2: {base: "color_2", light: 20, saturate: 10, opacity: 0.2, greyscale: false},
                   color_2_3: {base: "color_2", light: 20, saturate: 10, opacity: 0.1, greyscale: false},
                   color_2_4: {base: "color_2", light: 5, saturate: 10, opacity: 0.7, greyscale: false},
                   color_2_5: {base: "color_2", light: -10, saturate: -10, greyscale: false},
                   color_2_6: {base: "color_2", light: -5, saturate: -10, opacity: 0.4, greyscale: false},
           img_2: {type: "img", name: "Pattern di sfondo", set: skinArrays.array3},
           font_1: {type: "css", name: "Grandezza font dei post", set: skinArrays.array4}
        },
        dynCss = "body {background-color: @color_1}.mback {background-color: @color_2; border: 1px solid @color_2_5;}.title, .darkbar {background-color: @color_1 !important; border: 1px solid @color_1_2 !important}a, .menu li a {color: @color_2}a:hover, .menu li a:hover {color: @color_2_5}.board .aa img {background: @color_2}.web a:hover {color: @color_1}.on .aa {box-shadow: inset 3px 0 0 @color_2_4}.tag .mback {background-color: @color_1; border: 1px solid @color_1_2}.menuwrap em {color: @color_2}.menu li strong, .menuwrap b {color: @color_1}.forum .annuncio {background: @color_2_2}.forum .importante {background: @color_2_3}#board .stats .bottom .right b {background: @color_2_2}.sunbar {background-color: @color_2; border: 1px solid @color_2_5}.color {font-size: @font_1}.focus {background: @color_2_4 !important}.focus a:hover {color: @color_1 !important}.bottomborder {border-bottom: 1px dashed @color_2_5}.buttons a:hover, .nav a:hover, .pages li a:hover {color: @color_1}.send .mback {background-color: @color_1; border: 1px solid @color_1_2}.pages .current, .pages2 a {background: @color_2}.pages .current:hover, .pages2 a:hover {background: @color_1} .bar div {background: @color_1_1}.max .bar div {background: @color_2}.darkbar .forminput:hover, .fast.send .forminput:hover, .title input.forminput:hover {background: @color_2}.codebuttons:hover {background: @color_2_2; border-color: @color_2_6}.profile .tabs a, .cp .tabs a {background: @color_1}.profile .tabs .current a, .cp .tabs .current a {background: @color_2}.side_calendar .current {background: @color_2 !important}.side_list > *:nth-child(odd), .side_list > *:nth-child(odd) a {color: @color_1}.blog .on {border-color: @color_2}#ssm .ww {background: @color_2} #ssm .title {background: @color_1_2 !important}body {background-image: url(@img_2)}"

    CITAZIONE
    CODICE
    {"skinArrays" : {
           "array1": ["#42aad6","#f0689d","#d43c3e","#e26446","#e4b23c","#5fa848","#426b8e","#7251cd","#5eb889","#695c4f","#333535"],
           "array2": ["border-radius: 10px 10px 0 0","border-radius: 30px 30px 0 0","border-radius: 5px 5px 0 0"],
           "array3": ["http://dumpshare.net/images/657134purty_wood.png","http://dumpshare.net/images/6110582batthern.png","http://dumpshare.net/images/3174288back_pattern.png","http://dumpshare.net/images/7131027arches.png","http://dumpshare.net/images/2571430arabesque.png","http://dumpshare.net/images/3725829always_grey.png","http://dumpshare.net/images/9596259tileable_wood.png"],
           "array4": ["12px","14px","16px","18px"],
           "array5": ["#333535","#42aad6","#f0689d","#d43c3e","#e26446","#e4b23c","#5fa848","#426b8e","#7251cd","#5eb889","#695c4f"]
        },
        "skinSettings" : {
           "color_1": {"type": "hex", "name": "Sfondo, title e dettagli vari", "set": "skinArrays.array5"},
                   "color_1_1": {"base": "color_1", "light": 10, "saturate": -10, "bright": 2, "greyscale": "false"},
                   "color_1_2": {"base": "color_1", "light": -5, "saturate": -2, "greyscale": "false"},
           "color_2": {"type": "hex", "name": "Mback e colori primari", "set": "skinArrays.array1"},
                   "color_2_1": {"base": "color_2", "light": 20, "saturate": 10, "bright": 10, "greyscale": "false"},
                   "color_2_2": {"base": "color_2", "light": 20, "saturate": 10, "opacity": 0.2, "greyscale": "false"},
                   "color_2_3": {"base": "color_2", "light": 20, "saturate": 10, "opacity": 0.1, "greyscale": "false"},
                   "color_2_4": {"base": "color_2", "light": 5, "saturate": 10, "opacity": 0.7, "greyscale": "false"},
                   "color_2_5": {"base": "color_2", "light": -10, "saturate": -10, "greyscale": "false"},
                   "color_2_6": {"base": "color_2", "light": -5, "saturate": -10, "opacity": 0.4, "greyscale": "false"},
           "img_2": {"type": "img", "name": "Pattern di sfondo", "set": "skinArrays.array3"},
           "font_1": {"type": "css", "name": "Grandezza font dei post", "set": "skinArrays.array4"}
        },
        "dynCss" : "body {background-color: @color_1}.mback {background-color: @color_2; border: 1px solid @color_2_5;}.title, .darkbar {background-color: @color_1 !important; border: 1px solid @color_1_2 !important}a, .menu li a {color: @color_2}a:hover, .menu li a:hover {color: @color_2_5}.board .aa img {background: @color_2}.web a:hover {color: @color_1}.on .aa {box-shadow: inset 3px 0 0 @color_2_4}.tag .mback {background-color: @color_1; border: 1px solid @color_1_2}.menuwrap em {color: @color_2}.menu li strong, .menuwrap b {color: @color_1}.forum .annuncio {background: @color_2_2}.forum .importante {background: @color_2_3}#board .stats .bottom .right b {background: @color_2_2}.sunbar {background-color: @color_2; border: 1px solid @color_2_5}.color {font-size: @font_1}.focus {background: @color_2_4 !important}.focus a:hover {color: @color_1 !important}.bottomborder {border-bottom: 1px dashed @color_2_5}.buttons a:hover, .nav a:hover, .pages li a:hover {color: @color_1}.send .mback {background-color: @color_1; border: 1px solid @color_1_2}.pages .current, .pages2 a {background: @color_2}.pages .current:hover, .pages2 a:hover {background: @color_1} .bar div {background: @color_1_1}.max .bar div {background: @color_2}.darkbar .forminput:hover, .fast.send .forminput:hover, .title input.forminput:hover {background: @color_2}.codebuttons:hover {background: @color_2_2; border-color: @color_2_6}.profile .tabs a, .cp .tabs a {background: @color_1}.profile .tabs .current a, .cp .tabs .current a {background: @color_2}.side_calendar .current {background: @color_2 !important}.side_list > *:nth-child(odd), .side_list > *:nth-child(odd) a {color: @color_1}.blog .on {border-color: @color_2}#ssm .ww {background: @color_2} #ssm .title {background: @color_1_2 !important}body {background-image: url(@img_2)}"
    }


    Edited by A c e - 15/6/2015, 19:07
     
    Top
    .
0 replies since 4/8/2014, 09:08   703 views
  Share  
.