Sandvik Screening Media Selection Guide App

@@ -46,7 +46,7 @@ - + diff --git a/ScreeningMediaSelection/js/script.js b/ScreeningMediaSelection/js/script.js index da0ae0c..39b3033 100644 --- a/ScreeningMediaSelection/js/script.js +++ b/ScreeningMediaSelection/js/script.js @@ -703,7 +703,10 @@ function addField(f, value) { $(".select3").select3(); $("select[data-type=\"select2\"]").each(function () { - $(this).select2({dropdownParent: $(this).parent()}); + $(this).selectize({ + create: false, + // sortField: "text", + }); }); addLinkToResult('.res'); diff --git a/ScreeningMediaSelection/js/selectize.min.js b/ScreeningMediaSelection/js/selectize.min.js new file mode 100644 index 0000000..1bad526 --- /dev/null +++ b/ScreeningMediaSelection/js/selectize.min.js @@ -0,0 +1,3 @@ +/*! selectize.js - v0.13.3 | https://github.com/selectize/selectize.js | Apache License (v2) */ + +!function(root,factory){"function"==typeof define&&define.amd?define("sifter",factory):"object"==typeof exports?module.exports=factory():root.Sifter=factory()}(this,function(){function Sifter(items,settings){this.items=items,this.settings=settings||{diacritics:!0}}Sifter.prototype.tokenize=function(query){if(!(query=trim(String(query||"").toLowerCase()))||!query.length)return[];for(var regex,letter,tokens=[],words=query.split(/ +/),i=0,n=words.length;i/g,">").replace(/"/g,""")}function debounce_events(self,types,fn){var type,trigger=self.trigger,event_args={};for(type in self.trigger=function(){var type=arguments[0];if(-1===types.indexOf(type))return trigger.apply(self,arguments);event_args[type]=arguments},fn.apply(self,[]),self.trigger=trigger,event_args)event_args.hasOwnProperty(type)&&trigger.apply(self,event_args[type])}function getSelection(input){var sel,selLen,result={};return void 0===input?console.warn("WARN getSelection cannot locate input control"):"selectionStart"in input?(result.start=input.selectionStart,result.length=input.selectionEnd-result.start):document.selection&&(input.focus(),sel=document.selection.createRange(),selLen=document.selection.createRange().text.length,sel.moveStart("character",-input.value.length),result.start=sel.text.length-selLen,result.length=selLen),result}function measureString(str,$parent){return str?(Selectize.$testInput||(Selectize.$testInput=$("").css({position:"absolute",width:"auto",padding:0,whiteSpace:"pre"}),$("

").css({position:"absolute",width:0,height:0,overflow:"hidden"}).append(Selectize.$testInput).appendTo("body")),Selectize.$testInput.text(str),function($from,$to,properties){var i,n,styles={};if(properties)for(i=0,n=properties.length;i").addClass(settings.wrapperClass).addClass(classes).addClass(event),$control=$("

").addClass(settings.inputClass).addClass("items").appendTo($wrapper),$control_input=$('').appendTo($control).attr("tabindex",$input.is(":disabled")?"-1":self.tabIndex),inputId=$(settings.dropdownParent||$wrapper),selector=$("

").addClass(settings.dropdownClass).addClass(event).hide().appendTo(inputId),event=$("

").addClass(settings.dropdownContentClass).attr("tabindex","-1").appendTo(selector);(inputId=$input.attr("id"))&&($control_input.attr("id",inputId+"-selectized"),$("label[for='"+inputId+"']").attr("for",inputId+"-selectized")),self.settings.copyClassesToDropdown&&selector.addClass(classes),$wrapper.css({width:$input[0].style.width}),self.plugins.names.length&&(delimiterEscaped="plugin-"+self.plugins.names.join(" plugin-"),$wrapper.addClass(delimiterEscaped),selector.addClass(delimiterEscaped)),(null===settings.maxItems||1[data-selectable]",function(e){e.stopImmediatePropagation()}),selector.on("mouseenter","[data-selectable]",function(){return self.onOptionHover.apply(self,arguments)}),selector.on("mousedown click","[data-selectable]",function(){return self.onOptionSelect.apply(self,arguments)}),event="mousedown",selector="*:not(input)",fn=function(){return self.onItemSelect.apply(self,arguments)},($parent=$control).on(event,selector,function(e){for(var child=e.target;child&&child.parentNode!==$parent[0];)child=child.parentNode;return e.currentTarget=child,fn.apply(this,[e])}),autoGrow($control_input),$control.on({mousedown:function(){return self.onMouseDown.apply(self,arguments)},click:function(){return self.onClick.apply(self,arguments)}}),$control_input.on({mousedown:function(e){e.stopPropagation()},keydown:function(){return self.onKeyDown.apply(self,arguments)},keyup:function(){return self.onKeyUp.apply(self,arguments)},keypress:function(){return self.onKeyPress.apply(self,arguments)},resize:function(){self.positionDropdown.apply(self,[])},blur:function(){return self.onBlur.apply(self,arguments)},focus:function(){return self.ignoreBlur=!1,self.onFocus.apply(self,arguments)},paste:function(){return self.onPaste.apply(self,arguments)}}),$document.on("keydown"+eventNS,function(e){self.isCmdDown=e[IS_MAC?"metaKey":"ctrlKey"],self.isCtrlDown=e[IS_MAC?"altKey":"ctrlKey"],self.isShiftDown=e.shiftKey}),$document.on("keyup"+eventNS,function(e){e.keyCode===KEY_CTRL&&(self.isCtrlDown=!1),16===e.keyCode&&(self.isShiftDown=!1),e.keyCode===KEY_CMD&&(self.isCmdDown=!1)}),$document.on("mousedown"+eventNS,function(e){if(self.isFocused){if(e.target===self.$dropdown[0]||e.target.parentNode===self.$dropdown[0])return!1;self.$control.has(e.target).length||e.target===self.$control[0]||self.blur(e.target)}}),$window.on(["scroll"+eventNS,"resize"+eventNS].join(" "),function(){self.isOpen&&self.positionDropdown.apply(self,arguments)}),$window.on("mousemove"+eventNS,function(){self.ignoreHover=!1}),this.revertSettings={$children:$input.children().detach(),tabindex:$input.attr("tabindex")},$input.attr("tabindex",-1).hide().after(self.$wrapper),$.isArray(settings.items)&&(self.lastValidValue=settings.items,self.setValue(settings.items),delete settings.items),SUPPORTS_VALIDITY_API&&$input.on("invalid"+eventNS,function(e){e.preventDefault(),self.isInvalid=!0,self.refreshState()}),self.updateOriginalInput(),self.refreshItems(),self.refreshState(),self.updatePlaceholder(),self.isSetup=!0,$input.is(":disabled")&&self.disable(),self.on("change",this.onChange),$input.data("selectize",self),$input.addClass("selectized"),self.trigger("initialize"),!0===settings.preload&&self.onSearchChange("")},setupTemplates:function(){var field_label=this.settings.labelField,field_optgroup=this.settings.optgroupLabelField,templates={optgroup:function(data){return'

'+data.html+"

"},optgroup_header:function(data,escape){return'

'+escape(data[field_optgroup])+"

"},option:function(data,escape){return'

'+escape(data[field_label])+"

"},item:function(data,escape){return'

'+escape(data[field_label])+"

"},option_create:function(data,escape){return'

Add '+escape(data.input)+"…

"}};this.settings.render=$.extend({},templates,this.settings.render)},setupCallbacks:function(){var key,fn,callbacks={initialize:"onInitialize",change:"onChange",item_add:"onItemAdd",item_remove:"onItemRemove",clear:"onClear",option_add:"onOptionAdd",option_remove:"onOptionRemove",option_clear:"onOptionClear",optgroup_add:"onOptionGroupAdd",optgroup_remove:"onOptionGroupRemove",optgroup_clear:"onOptionGroupClear",dropdown_open:"onDropdownOpen",dropdown_close:"onDropdownClose",type:"onType",load:"onLoad",focus:"onFocus",blur:"onBlur",dropdown_item_activate:"onDropdownItemActivate",dropdown_item_deactivate:"onDropdownItemDeactivate"};for(key in callbacks)callbacks.hasOwnProperty(key)&&(fn=this.settings[callbacks[key]])&&this.on(key,fn)},onClick:function(e){this.isFocused&&this.isOpen||(this.focus(),e.preventDefault())},onMouseDown:function(e){var self=this,defaultPrevented=e.isDefaultPrevented();$(e.target);if(self.isFocused){if(e.target!==self.$control_input[0])return"single"===self.settings.mode?self.isOpen?self.close():self.open():defaultPrevented||self.setActiveItem(null),!1}else defaultPrevented||window.setTimeout(function(){self.focus()},0)},onChange:function(){""!==this.getValue()&&(this.lastValidValue=this.getValue()),this.$input.trigger("input"),this.$input.trigger("change")},onPaste:function(e){var self=this;self.isFull()||self.isInputHidden||self.isLocked?e.preventDefault():self.settings.splitOn&&setTimeout(function(){var pastedText=self.$control_input.val();if(pastedText.match(self.settings.splitOn))for(var splitInput=$.trim(pastedText).split(self.settings.splitOn),i=0,n=splitInput.length;i=this.settings.maxItems},updateOriginalInput:function(opts){var i,n,options,label;if(opts=opts||{},1===this.tagType){for(options=[],i=0,n=this.items.length;i'+escape_html(label)+"");options.length||this.$input.attr("multiple")||options.push(''),this.$input.html(options.join(""))}else this.$input.val(this.getValue()),this.$input.attr("value",this.$input.val());this.isSetup&&(opts.silent||this.trigger("change",this.$input.val()))},updatePlaceholder:function(){var $input;this.settings.placeholder&&($input=this.$control_input,this.items.length?$input.removeAttr("placeholder"):$input.attr("placeholder",this.settings.placeholder),$input.triggerHandler("update",{force:!0}))},open:function(){this.isLocked||this.isOpen||"multi"===this.settings.mode&&this.isFull()||(this.focus(),this.isOpen=!0,this.refreshState(),this.$dropdown.css({visibility:"hidden",display:"block"}),this.positionDropdown(),this.$dropdown.css({visibility:"visible"}),this.trigger("dropdown_open",this.$dropdown))},close:function(){var trigger=this.isOpen;"single"===this.settings.mode&&this.items.length&&(this.hideInput(),this.isBlurring&&this.$control_input.blur()),this.isOpen=!1,this.$dropdown.hide(),this.setActiveOption(null),this.refreshState(),trigger&&this.trigger("dropdown_close",this.$dropdown)},positionDropdown:function(){var $control=this.$control,offset="body"===this.settings.dropdownParent?$control.offset():$control.position();offset.top+=$control.outerHeight(!0),this.$dropdown.css({width:$control[0].getBoundingClientRect().width,top:offset.top,left:offset.left})},clear:function(silent){this.items.length&&(this.$control.children(":not(input)").remove(),this.items=[],this.lastQuery=null,this.setCaret(0),this.setActiveItem(null),this.updatePlaceholder(),this.updateOriginalInput({silent:silent}),this.refreshState(),this.showInput(),this.trigger("clear"))},insertAtCaret:function(target){var caret=Math.min(this.caretPos,this.items.length),el=target[0],target=this.buffer||this.$control[0];0===caret?target.insertBefore(el,target.firstChild):target.insertBefore(el,target.childNodes[caret]),this.setCaret(caret+1)},deleteSelection:function(e){var i,n,values,option_select,$option_select,caret,direction=e&&8===e.keyCode?-1:1,selection=getSelection(this.$control_input[0]);if(this.$activeOption&&!this.settings.hideSelected&&(option_select=this.getAdjacentOption(this.$activeOption,-1).attr("data-value")),values=[],this.$activeItems.length){for(caret=this.$control.children(".active:"+(0

'+data.title+'×

'}},options),self.setup=(original=self.setup,function(){original.apply(self,arguments),self.$dropdown_header=$(options.html(options)),self.$dropdown.prepend(self.$dropdown_header)})}),Selectize.define("optgroup_columns",function(options){var original,self=this;options=$.extend({equalizeWidth:!0,equalizeHeight:!0},options),this.getAdjacentOption=function($option,index){var $options=$option.closest("[data-group]").find("[data-selectable]"),index=$options.index($option)+index;return 0<=index&&index<$options.length?$options.eq(index):$()},this.onKeyDown=(original=self.onKeyDown,function(e){var $option,$options;return!this.isOpen||37!==e.keyCode&&39!==e.keyCode?original.apply(this,arguments):(self.ignoreHover=!0,$option=($options=this.$activeOption.closest("[data-group]")).find("[data-selectable]").index(this.$activeOption),void(($option=($options=($options=37===e.keyCode?$options.prev("[data-group]"):$options.next("[data-group]")).find("[data-selectable]")).eq(Math.min($options.length-1,$option))).length&&this.setActiveOption($option)))});function equalizeSizes(){var i,height_max,width_last,width_parent,$optgroups=$("[data-group]",self.$dropdown_content),n=$optgroups.length;if(n&&self.$dropdown_content.width()){if(options.equalizeHeight){for(i=height_max=0;i

',div=div.firstChild,doc.body.appendChild(div),width=getScrollbarWidth.width=div.offsetWidth-div.clientWidth,doc.body.removeChild(div)),width};(options.equalizeHeight||options.equalizeWidth)&&(hook.after(this,"positionDropdown",equalizeSizes),hook.after(this,"refreshOptions",equalizeSizes))}),Selectize.define("remove_button",function(options){options=$.extend({label:"×",title:"Remove",className:"remove",append:!0},options);("single"===this.settings.mode?function(thisRef,options){options.className="remove-single";var original,self=thisRef,html=''+options.label+"";thisRef.setup=(original=self.setup,function(){var id,render_item;options.append&&(id=$(self.$input.context).attr("id"),$("#"+id),render_item=self.settings.render.item,self.settings.render.item=function(data){return html_container=render_item.apply(thisRef,arguments),html_element=html,$("").append(html_container).append(html_element);var html_container,html_element}),original.apply(thisRef,arguments),thisRef.$control.on("click","."+options.className,function(e){e.preventDefault(),self.isLocked||self.clear()})})}:function(thisRef,options){var original,self=thisRef,html=''+options.label+"";thisRef.setup=(original=self.setup,function(){var render_item;options.append&&(render_item=self.settings.render.item,self.settings.render.item=function(data){return html_container=render_item.apply(thisRef,arguments),html_element=html,pos=html_container.search(/(<\/[^>]+>\s*)$/),html_container.substring(0,pos)+html_element+html_container.substring(pos);var html_container,html_element,pos}),original.apply(thisRef,arguments),thisRef.$control.on("click","."+options.className,function($item){if($item.preventDefault(),!self.isLocked){$item=$($item.currentTarget).parent();return self.setActiveItem($item),self.deleteSelection()&&self.setCaret(self.items.length),!1}})})})(this,options)}),Selectize.define("restore_on_backspace",function(options){var original,self=this;options.text=options.text||function(option){return option[this.settings.labelField]},this.onKeyDown=(original=self.onKeyDown,function(e){var option;return 8===e.keyCode&&""===this.$control_input.val()&&!this.$activeItems.length&&0<=(option=this.caretPos-1)&&option.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--default .select2-results__option[role=group]{padding:0}.select2-container--default .select2-results__option[aria-disabled=true]{color:#999}.select2-container--default .select2-results__option[aria-selected=true]{background-color:#ddd}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#5897fb;color:white}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic .select2-selection--single{background-color:#f7f7f7;border:1px solid #aaa;border-radius:4px;outline:0;background-image:-webkit-linear-gradient(top, #fff 50%, #eee 100%);background-image:-o-linear-gradient(top, #fff 50%, #eee 100%);background-image:linear-gradient(to bottom, #fff 50%, #eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic .select2-selection--single:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--classic .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;margin-right:10px}.select2-container--classic .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--classic .select2-selection--single .select2-selection__arrow{background-color:#ddd;border:none;border-left:1px solid #aaa;border-top-right-radius:4px;border-bottom-right-radius:4px;height:26px;position:absolute;top:1px;right:1px;width:20px;background-image:-webkit-linear-gradient(top, #eee 50%, #ccc 100%);background-image:-o-linear-gradient(top, #eee 50%, #ccc 100%);background-image:linear-gradient(to bottom, #eee 50%, #ccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)}.select2-container--classic .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow{border:none;border-right:1px solid #aaa;border-radius:0;border-top-left-radius:4px;border-bottom-left-radius:4px;left:1px;right:auto}.select2-container--classic.select2-container--open .select2-selection--single{border:1px solid #5897fb}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow{background:transparent;border:none}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single{border-top:none;border-top-left-radius:0;border-top-right-radius:0;background-image:-webkit-linear-gradient(top, #fff 0%, #eee 50%);background-image:-o-linear-gradient(top, #fff 0%, #eee 50%);background-image:linear-gradient(to bottom, #fff 0%, #eee 50%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;background-image:-webkit-linear-gradient(top, #eee 50%, #fff 100%);background-image:-o-linear-gradient(top, #eee 50%, #fff 100%);background-image:linear-gradient(to bottom, #eee 50%, #fff 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)}.select2-container--classic .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text;outline:0}.select2-container--classic .select2-selection--multiple:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--multiple .select2-selection__rendered{list-style:none;margin:0;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__clear{display:none}.select2-container--classic .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;cursor:default;float:left;margin-right:5px;margin-top:5px;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove{color:#888;cursor:pointer;display:inline-block;font-weight:bold;margin-right:2px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover{color:#555}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice{float:right;margin-left:5px;margin-right:auto}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{margin-left:2px;margin-right:auto}.select2-container--classic.select2-container--open .select2-selection--multiple{border:1px solid #5897fb}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--classic .select2-search--dropdown .select2-search__field{border:1px solid #aaa;outline:0}.select2-container--classic .select2-search--inline .select2-search__field{outline:0;box-shadow:none}.select2-container--classic .select2-dropdown{background-color:#fff;border:1px solid transparent}.select2-container--classic .select2-dropdown--above{border-bottom:none}.select2-container--classic .select2-dropdown--below{border-top:none}.select2-container--classic .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--classic .select2-results__option[role=group]{padding:0}.select2-container--classic .select2-results__option[aria-disabled=true]{color:grey}.select2-container--classic .select2-results__option--highlighted[aria-selected]{background-color:#3875d7;color:#fff}.select2-container--classic .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic.select2-container--open .select2-dropdown{border-color:#5897fb} diff --git a/ScreeningMediaSelection/style.css b/ScreeningMediaSelection/style.css deleted file mode 100644 index a96aa36..0000000 --- a/ScreeningMediaSelection/style.css +++ /dev/null @@ -1,390 +0,0 @@ -@import "select2.min.css"; -@font-face { - font-family: "Aktiv Grotesk"; - font-weight: 300; - src: url("fonts/AktivGrotesk_W_Lt.woff"); -} -@font-face { - font-family: "Aktiv Grotesk"; - font-weight: 400; - src: url("fonts/AktivGrotesk_W_Rg.woff"); -} -html { - font-size: 10px; -} -html.showell { - font-size: 4px; -} -@media (max-width:1400px) { - html { - font-size: 8px; - } -} -@media (max-width:1000px) { - html { - font-size: 6px; - } -} -@media (max-device-width:600px) { - html { - font-size: 5px; - } -} -@media (max-device-width:400px) { - html { - font-size: 4px; - } -} -@media (max-device-width:300px) { - html { - font-size: 3px; - } -} -@media (max-device-width:200px) { - html { - font-size: 2px; - } -} -.displaynone { - display: none; -} -#holder { - max-width: 192rem; - padding: 5rem; - width: 100%; - margin: 0 auto; - font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; -} -@media (max-width:1400px) { - #holder { - padding: 2rem; - } -} -@media (max-width:1000px) { - #holder { - padding: 1rem; - } -} -body { - font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; - padding: 0; - margin: 0; - background-color: #0099ff; - color: #fff; -} -header { - position: absolute; - top: 0; - left: 0; - height: 18rem; - background-color: #0099ff; - width: 100%; - z-index: 10; - font-size: 3rem; -} -.lines { - position: absolute; - left: 0; - bottom: 0; - height: auto; - width: 100%; -} -#back_header { - position: absolute; - top: 3rem; - left: 3rem; - text-transform: uppercase; - font-size: 3rem; - display: none; -} -#back_header a { - color: #fff; -} -#back_header a:before { - content: ''; - display: inline-block; - width: 1.5rem; - height: 2.2rem; - margin-right: 1.7rem; - background-image: url("images/back-arrow.svg"); - background-position: 0 0; - background-size: 100% 100%; -} -* { - padding: 0; - margin: 0; - box-sizing: border-box; - font-weight: 300; - font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; - text-decoration: none; -} -h2 { - text-transform: uppercase; - font-size: 7rem; - margin-bottom: 3.4rem; - margin-top: 15rem; - text-align: center; -} -h3 { - font-size: 3rem; - font-style: italic; - text-align: center; - font-weight: 600; -} -.logo { - display: block; - width: 100%; - margin: 7rem auto 0; - position: absolute; - z-index: 11; - text-align: center; -} -.logo img { - width: 25rem; -} -#calculator_locale_selector { - position: absolute; - right: 3rem; - top: 3rem; -} -#calculator_locale_selector img { - height: 3.4rem; -} -#calculator_locale_selector #openLocaleMenu { - text-decoration: none; -} -#calculator_locale_selector #calculator_locale_select_holder { - display: none; -} -#calculator_locale_selector #current_locale { - text-transform: uppercase; - color: #ffffff; - text-decoration: none; - display: inline-block; - font-size: 3rem; - vertical-align: top; - margin-left: 0.5rem; - font-weight: 300; - margin-top: 0rem; -} -section#locale { - opacity: 0; - pointer-events: none; - transition: opacity 500ms; - margin: 0 auto; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - color: #fff; - background-color: #0099ff; - z-index: 2; - min-height: 100%; - overflow: auto; - padding: 0; - display: none; -} -section#locale.hidden { - display: none; -} -section#locale.visible { - display: block; - opacity: 1; - pointer-events: auto; -} -section#locale ul { - padding-top: 18rem; -} -section#locale ul li { - text-align: center; - text-transform: uppercase; - font-size: 4.5rem; - border-bottom: 1px solid #fff; - padding: 2.5rem; - list-style: none; - cursor: pointer; -} -section#locale ul li:hover, -section#locale ul li.active { - background-color: rgba(255, 255, 255, 0.3); -} -section { - padding: 5rem 4rem; - opacity: 0; - pointer-events: none; - transition: opacity 500ms; - margin: 0 auto; -} -section.hidden { - display: none; -} -section.visible { - opacity: 1; - pointer-events: auto; -} -#results .tiles { - margin: 10rem auto; - text-align: center; -} -#results .tiles .tile { - width: 54rem; - margin: 2rem; - border: 1px solid #fff; - padding: 4rem; - font-size: 2.5rem; - text-align: center; - display: inline-block; -} -@media (max-device-width:600px) { - #results .tiles .tile { - display: block; - width: 100%; - } -} -#results .tiles .tile h4 { - height: 36px; -} -#results .tiles .tile p { - margin-top: 2rem; - font-size: 4rem; -} -#fields { - width: 50%; - margin: 10rem auto; - font-size: 4rem; -} -@media (max-width:1400px) { - #fields { - width: 75%; - } -} -@media (max-width:1000px) { - #fields { - width: 90%; - } -} -@media (max-device-width:600px) { - #fields { - width: 90%; - } -} -#fields .error { - color: #a00; - text-align: center; - font-weight: 700; -} -#fields .field { - position: relative; - margin-bottom: 6rem; -} -#fields .field .hint { - font-size: 60%; -} -#fields .field.hidden { - display: none; -} -#fields .field[data-type="select"]:after { - display: block; - content: ""; - position: absolute; - right: 3rem; - bottom: 3rem; - width: 3rem; - height: 1.4rem; - background-image: url("images/select-arrow.svg"); - background-size: 100% 100%; - background-repeat: no-repeat; -} -#fields .field select, -#fields .field input, -#fields .field .select2-selection { - background-color: #0099ff; - border: 2px solid #fff; - color: #fff; - height: 8.5rem; - padding: 2rem; - display: inline-block; - width: 100%; - margin-top: 1rem; - border-radius: 0; - box-shadow: none !important; - font-size: 3.5rem; - -moz-appearance: none; - -webkit-appearance: none; - -ms-appearance: none; - appearance: none; -} -#fields .field select .empty, -#fields .field input .empty, -#fields .field .select2-selection .empty { - font-style: italic; -} -#fields .field .select2-selection__rendered { - color: #fff; - line-height: unset; -} -#fields .field .info, -#fields .field .product_model { - text-align: right; - font-style: italic; -} -#fields .field .result { - font-weight: 700; - text-align: center; -} -#fields .field .result h2 { - text-transform: uppercase; -} -#fields .field .result .resholder { - border: 1px solid #fff; - width: 50%; - margin: 0 auto; - padding: 2rem; -} -#fields .field .result .product_model { - font-size: 90%; - text-align: center; - font-style: normal; -} -#fields .field .result .res { - font-size: 110%; - font-weight: 400; - margin-top: 1rem; -} -#fields .field .result .res a { - color: #fff; -} -#fields .field .result .res .result_disclaimer { - margin-top: 1rem; - font-size: 60%; -} -#fields .field .result .disclaimer { - margin: 4rem 0; - font-size: 2.5rem; -} -#fields .field .result .disclaimer a { - color: #fff; - text-decoration: underline; -} -#fields .field input::-webkit-outer-spin-button, -#fields .field input::-webkit-inner-spin-button { - /* display: none; <- Crashes Chrome on hover */ - -webkit-appearance: none; - margin: 0; - /* <-- Apparently some margin are still there even though it's hidden */ -} -#fields .field input[type=number] { - -moz-appearance: textfield; - /* Firefox */ -} -.select2-results__option { - color: #0099ff; - font-size: 25px; - font-weight: 400; -} -.select2-results__option.select2-results__option--highlighted { - background-color: #0099ff; - color: #fff; -} -/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/ScreeningMediaSelection/style.css.map b/ScreeningMediaSelection/style.css.map deleted file mode 100644 index afbcf2c..0000000 --- a/ScreeningMediaSelection/style.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["style.less"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file diff --git a/ScreeningMediaSelection/style.less b/ScreeningMediaSelection/style.less deleted file mode 100644 index 9b13524..0000000 --- a/ScreeningMediaSelection/style.less +++ /dev/null @@ -1,448 +0,0 @@ -@font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; - - -@font-face { - font-family: "Aktiv Grotesk"; - font-weight: 300; - src: url("fonts/AktivGrotesk_W_Lt.woff"); -} - -@font-face { - font-family: "Aktiv Grotesk"; - font-weight: 400; - src: url("fonts/AktivGrotesk_W_Rg.woff"); -} - -@mm: ~"(max-width:1400px)"; -@mms: ~"(max-width:1000px)"; -@mmxs: ~"(max-device-width:600px)"; -@mmxxs: ~"(max-device-width:400px)"; -@mmxxxs: ~"(max-device-width:300px)"; -@mmxxxxs: ~"(max-device-width:200px)"; - -html { - font-size: 10px; - - &.showell { - font-size: 4px; - } - - @media @mm { - font-size: 8px; - } - - @media @mms { - font-size: 6px; - } - - @media @mmxs { - font-size: 5px; - } - @media @mmxxs { - font-size: 4px; - } - @media @mmxxxs { - font-size: 3px; - } - @media @mmxxxxs { - font-size: 2px; - } -} - -.displaynone { - display: none; -} - -#holder { - max-width: 192rem; - @media @mm { - padding: 2rem; - } - @media @mms { - padding: 1rem; - } - padding: 5rem; - width: 100%; - margin: 0 auto; - font-family: @font-family; -} - -body { - font-family: @font-family; - padding: 0; - margin: 0; - background-color: #0099ff; - color: #fff; -} - -header { - position: absolute; - top: 0; - left: 0; - height: 18rem; - background-color: #0099ff; - width: 100%; - z-index: 10; - font-size: 3rem; -} - -.lines { - position: absolute; - left: 0; - bottom: 0; - height: auto; - width: 100%; -} - -#back_header { - position: absolute; - top: 3rem; - left: 3rem; - text-transform: uppercase; - font-size: 3rem; - display: none; - - a { - &:before { - content: ''; - display: inline-block; - width: 1.5rem; - height: 2.2rem; - margin-right: 1.7rem; - - - background-image: url("images/back-arrow.svg"); - background-position: 0 0; - background-size: 100% 100%; - } - - color: #fff; - } -} - - -* { - padding: 0; - margin: 0; - box-sizing: border-box; - font-weight: 300; - font-family: @font-family; - text-decoration: none; -} - -/// -- /// - -h2 { - text-transform: uppercase; - font-size: 7rem; - margin-bottom: 3.4rem; - margin-top: 15rem; - text-align: center; -} - -h3 { - font-size: 3rem; - font-style: italic; - text-align: center; - font-weight: 600; -} - - -.logo { - display: block; - width: 100%; - margin: 7rem auto 0; - position: absolute; - z-index: 11; - text-align: center; - - img { - width: 25rem; - } -} - -#calculator_locale_selector { - position: absolute; - right: 3rem; - top: 3rem; - - img { - height: 3.4rem; - } - - #openLocaleMenu { - text-decoration: none; - } - - #calculator_locale_select_holder { - display: none; - } - - #current_locale { - text-transform: uppercase; - color: #ffffff; - text-decoration: none; - display: inline-block; - font-size: 3rem; - vertical-align: top; - margin-left: .5rem; - font-weight: 300; - margin-top: 0rem; - } -} - -section#locale { - opacity: 0; - pointer-events: none; - transition: opacity 500ms; - margin: 0 auto; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - color: #fff; - background-color: #0099ff; - z-index: 2; - min-height: 100%; - overflow: auto; - - &.hidden { - display: none; - } - - &.visible { - display: block; - opacity: 1; - pointer-events: auto; - } - - padding: 0; - display: none; - - ul { - padding-top: 18rem; - - li { - text-align: center; - text-transform: uppercase; - font-size: 4.5rem; - border-bottom: 1px solid #fff; - padding: 2.5rem; - list-style: none; - cursor: pointer; - - &:hover, &.active { - background-color: rgba(255, 255, 255, 0.3); - } - } - } -} - -section { - padding: 5rem 4rem; - opacity: 0; - pointer-events: none; - transition: opacity 500ms; - margin: 0 auto; - - &.hidden { - display: none; - } - - &.visible { - opacity: 1; - pointer-events: auto; - } -} - -#results { - .tiles { - margin: 10rem auto; - text-align: center; - - .tile { - width: 54rem; - margin: 2rem; - border: 1px solid #fff; - padding: 4rem; - font-size: 2.5rem; - text-align: center; - display: inline-block; - - @media @mmxs { - display: block; - width: 100%; - } - - h4 { - height: 36px; - } - - p { - margin-top: 2rem; - font-size: 4rem; - } - } - - - } -} - -@import "select2.min.css"; - -#fields { - width: 50%; - margin: 10rem auto; - font-size: 4rem; - - @media @mm { - width: 75%; - } - - @media @mms { - width: 90%; - } - - @media @mmxs { - width: 90%; - } - - - .error { - color: #a00; - text-align: center; - font-weight: 700; - } - - .field { - position: relative; - margin-bottom: 6rem; - - .hint { - font-size: 60%; - } - - &.hidden { - display: none; - } - - &[data-type="select"]:after { - display: block; - content: ""; - position: absolute; - right: 3rem; - bottom: 3rem; - width: 3rem; - height: 1.4rem; - background-image: url("images/select-arrow.svg"); - background-size: 100% 100%; - background-repeat: no-repeat; - } - - - select, input, .select2-selection { - background-color: #0099ff; - border: 2px solid #fff; - color: #fff; - height: 8.5rem; - padding: 2rem; - display: inline-block; - width: 100%; - margin-top: 1rem; - border-radius: 0; - box-shadow: none !important; - font-size: 3.5rem; - -moz-appearance: none; - -webkit-appearance: none; - -ms-appearance: none; - appearance: none; - - .empty { - font-style: italic; - } - } - - .select2-selection__rendered { - color: #fff; - line-height: unset; - } - - - .info, .product_model { - text-align: right; - font-style: italic; - } - - .result { - font-weight: 700; - text-align: center; - - h2 { - text-transform: uppercase; - } - - .resholder { - border: 1px solid #fff; - width: 50%; - margin: 0 auto; - padding: 2rem; - } - - .product_model { - font-size: 90%; - text-align: center; - font-style: normal; - } - - .res { - font-size: 110%; - font-weight: 400; - margin-top: 1rem; - - a { - color: #fff; - } - - .result_disclaimer { - margin-top: 1rem; - font-size: 60%; - } - } - - .disclaimer { - margin: 4rem 0; - font-size: 2.5rem; - - a { - color: #fff; - text-decoration: underline; - } - } - } - - input::-webkit-outer-spin-button, - input::-webkit-inner-spin-button { - /* display: none; <- Crashes Chrome on hover */ - -webkit-appearance: none; - margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ - } - - input[type=number] { - -moz-appearance: textfield; /* Firefox */ - } - - } -} - - -.select2-results__option { - color: #0099ff; - font-size: 25px; - font-weight: 400; - - &.select2-results__option--highlighted { - background-color: #0099ff; - color: #fff; - } -} \ No newline at end of file diff --git a/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Lt.woff b/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Lt.woff new file mode 100644 index 0000000..771685c Binary files /dev/null and b/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Lt.woff differ diff --git a/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Rg.woff b/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Rg.woff new file mode 100644 index 0000000..1577e14 Binary files /dev/null and b/ScreeningMediaSelection/style/fonts/AktivGrotesk_W_Rg.woff differ diff --git a/ScreeningMediaSelection/style/select2.min.css b/ScreeningMediaSelection/style/select2.min.css new file mode 100644 index 0000000..7c18ad5 --- /dev/null +++ b/ScreeningMediaSelection/style/select2.min.css @@ -0,0 +1 @@ +.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:28px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding-left:8px;padding-right:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{position:relative}.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered{padding-right:8px;padding-left:20px}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:32px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline-block;overflow:hidden;padding-left:8px;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-search--inline{float:left}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;padding:0}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{background-color:white;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:block;position:absolute;left:-100000px;width:100%;z-index:1051}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:6px;user-select:none;-webkit-user-select:none}.select2-results__option[aria-selected]{cursor:pointer}.select2-container--open .select2-dropdown{left:0}.select2-container--open .select2-dropdown--above{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--open .select2-dropdown--below{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99;background-color:#fff;filter:alpha(opacity=0)}.select2-hidden-accessible{border:0 !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}.select2-container--default .select2-selection--single{background-color:#fff;border:1px solid #aaa;border-radius:4px}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--default .select2-selection--single .select2-selection__arrow{height:26px;position:absolute;top:1px;right:1px;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow{left:1px;right:auto}.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--default .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text}.select2-container--default .select2-selection--multiple .select2-selection__rendered{box-sizing:border-box;list-style:none;margin:0;padding:0 5px;width:100%}.select2-container--default .select2-selection--multiple .select2-selection__rendered li{list-style:none}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;margin-top:5px;margin-right:10px;padding:1px}.select2-container--default .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;cursor:default;float:left;margin-right:5px;margin-top:5px;padding:0 5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:#999;cursor:pointer;display:inline-block;font-weight:bold;margin-right:2px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:#333}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice,.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline{float:right}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice{margin-left:5px;margin-right:auto}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{margin-left:2px;margin-right:auto}.select2-container--default.select2-container--focus .select2-selection--multiple{border:solid black 1px;outline:0}.select2-container--default.select2-container--disabled .select2-selection--multiple{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid #aaa}.select2-container--default .select2-search--inline .select2-search__field{background:transparent;border:none;outline:0;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--default .select2-results__option[role=group]{padding:0}.select2-container--default .select2-results__option[aria-disabled=true]{color:#999}.select2-container--default .select2-results__option[aria-selected=true]{background-color:#ddd}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#5897fb;color:white}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic .select2-selection--single{background-color:#f7f7f7;border:1px solid #aaa;border-radius:4px;outline:0;background-image:-webkit-linear-gradient(top, #fff 50%, #eee 100%);background-image:-o-linear-gradient(top, #fff 50%, #eee 100%);background-image:linear-gradient(to bottom, #fff 50%, #eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic .select2-selection--single:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--classic .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;margin-right:10px}.select2-container--classic .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--classic .select2-selection--single .select2-selection__arrow{background-color:#ddd;border:none;border-left:1px solid #aaa;border-top-right-radius:4px;border-bottom-right-radius:4px;height:26px;position:absolute;top:1px;right:1px;width:20px;background-image:-webkit-linear-gradient(top, #eee 50%, #ccc 100%);background-image:-o-linear-gradient(top, #eee 50%, #ccc 100%);background-image:linear-gradient(to bottom, #eee 50%, #ccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)}.select2-container--classic .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow{border:none;border-right:1px solid #aaa;border-radius:0;border-top-left-radius:4px;border-bottom-left-radius:4px;left:1px;right:auto}.select2-container--classic.select2-container--open .select2-selection--single{border:1px solid #5897fb}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow{background:transparent;border:none}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single{border-top:none;border-top-left-radius:0;border-top-right-radius:0;background-image:-webkit-linear-gradient(top, #fff 0%, #eee 50%);background-image:-o-linear-gradient(top, #fff 0%, #eee 50%);background-image:linear-gradient(to bottom, #fff 0%, #eee 50%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;background-image:-webkit-linear-gradient(top, #eee 50%, #fff 100%);background-image:-o-linear-gradient(top, #eee 50%, #fff 100%);background-image:linear-gradient(to bottom, #eee 50%, #fff 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)}.select2-container--classic .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text;outline:0}.select2-container--classic .select2-selection--multiple:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--multiple .select2-selection__rendered{list-style:none;margin:0;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__clear{display:none}.select2-container--classic .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;cursor:default;float:left;margin-right:5px;margin-top:5px;padding:0 5px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove{color:#888;cursor:pointer;display:inline-block;font-weight:bold;margin-right:2px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover{color:#555}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice{float:right;margin-left:5px;margin-right:auto}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{margin-left:2px;margin-right:auto}.select2-container--classic.select2-container--open .select2-selection--multiple{border:1px solid #5897fb}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--classic .select2-search--dropdown .select2-search__field{border:1px solid #aaa;outline:0}.select2-container--classic .select2-search--inline .select2-search__field{outline:0;box-shadow:none}.select2-container--classic .select2-dropdown{background-color:#fff;border:1px solid transparent}.select2-container--classic .select2-dropdown--above{border-bottom:none}.select2-container--classic .select2-dropdown--below{border-top:none}.select2-container--classic .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--classic .select2-results__option[role=group]{padding:0}.select2-container--classic .select2-results__option[aria-disabled=true]{color:grey}.select2-container--classic .select2-results__option--highlighted[aria-selected]{background-color:#3875d7;color:#fff}.select2-container--classic .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic.select2-container--open .select2-dropdown{border-color:#5897fb} diff --git a/ScreeningMediaSelection/style/selectize.default.min.css b/ScreeningMediaSelection/style/selectize.default.min.css new file mode 100644 index 0000000..d9268ee --- /dev/null +++ b/ScreeningMediaSelection/style/selectize.default.min.css @@ -0,0 +1 @@ +.selectize-control.plugin-drag_drop.multi>.selectize-input>div.ui-sortable-placeholder{visibility:visible!important;background:#f2f2f2!important;background:rgba(0,0,0,.06)!important;border:0 none!important;box-shadow:inset 0 0 12px 4px #fff}.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after{content:"!";visibility:hidden}.selectize-control.plugin-drag_drop .ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.selectize-control .dropdown-header{position:relative;padding:10px 8px;border-bottom:1px solid #d0d0d0;background:#f8f8f8;border-radius:3px 3px 0 0}.selectize-control .dropdown-header-close{position:absolute;right:8px;top:50%;color:#303030;opacity:.4;margin-top:-12px;line-height:20px;font-size:20px!important}.selectize-control .dropdown-header-close:hover{color:#000}.selectize-dropdown.plugin-optgroup_columns .selectize-dropdown-content{display:flex}.selectize-dropdown.plugin-optgroup_columns .optgroup{border-right:1px solid #f2f2f2;border-top:0 none;flex-grow:1;flex-basis:0;min-width:0}.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child{border-right:0 none}.selectize-dropdown.plugin-optgroup_columns .optgroup:before{display:none}.selectize-dropdown.plugin-optgroup_columns .optgroup-header{border-top:0 none}.selectize-control.plugin-remove_button .item{display:inline-flex;align-items:center;padding-right:0!important}.selectize-control.plugin-remove_button .item .remove{color:inherit;text-decoration:none;vertical-align:middle;display:inline-block;padding:2px 6px;border-left:1px solid #0073bb;border-radius:0 2px 2px 0;box-sizing:border-box;margin-left:6px}.selectize-control.plugin-remove_button .item .remove:hover{background:rgba(0,0,0,.05)}.selectize-control.plugin-remove_button .item.active .remove{border-left-color:#00578d}.selectize-control.plugin-remove_button .disabled .item .remove:hover{background:0 0}.selectize-control.plugin-remove_button .disabled .item .remove{border-left-color:#aaa}.selectize-control.plugin-remove_button .remove-single{position:absolute;right:0;top:0;font-size:23px}.selectize-control{position:relative}.selectize-dropdown,.selectize-input,.selectize-input input{color:#303030;font-family:inherit;font-size:13px;line-height:18px;font-smoothing:inherit}.selectize-control.single .selectize-input.input-active,.selectize-input{background:#fff;cursor:text;display:inline-block}.selectize-input{border:1px solid #d0d0d0;padding:8px 8px;display:inline-block;width:100%;overflow:hidden;position:relative;z-index:1;box-sizing:border-box;box-shadow:inset 0 1px 1px rgba(0,0,0,.1);border-radius:3px}.selectize-control.multi .selectize-input.has-items{padding:calc(8px - 2px - 1px) 8px calc(8px - 2px - 3px - 1px)}.selectize-input.full{background-color:#fff}.selectize-input.disabled,.selectize-input.disabled *{cursor:default!important}.selectize-input.focus{box-shadow:inset 0 1px 2px rgba(0,0,0,.15)}.selectize-input.dropdown-active{border-radius:3px 3px 0 0}.selectize-input>*{vertical-align:baseline;display:inline-block;zoom:1}.selectize-control.multi .selectize-input>div{cursor:pointer;margin:0 3px 3px 0;padding:2px 6px;background:#1da7ee;color:#fff;border:1px solid #0073bb}.selectize-control.multi .selectize-input>div.active{background:#92c836;color:#fff;border:1px solid #00578d}.selectize-control.multi .selectize-input.disabled>div,.selectize-control.multi .selectize-input.disabled>div.active{color:#fff;background:#d2d2d2;border:1px solid #aaa}.selectize-input>input{display:inline-block!important;padding:0!important;min-height:0!important;max-height:none!important;max-width:100%!important;margin:0!important;text-indent:0!important;border:0 none!important;background:0 0!important;line-height:inherit!important;user-select:auto!important;box-shadow:none!important}.selectize-input>input::-ms-clear{display:none}.selectize-input>input:focus{outline:0!important}.selectize-input>input[placeholder]{box-sizing:initial}.selectize-input.has-items>input{margin:0 4px!important}.selectize-input::after{content:" ";display:block;clear:left}.selectize-input.dropdown-active::before{content:" ";display:block;position:absolute;background:#f0f0f0;height:1px;bottom:0;left:0;right:0}.selectize-dropdown{position:absolute;top:100%;left:0;width:100%;z-index:10;border:1px solid #d0d0d0;background:#fff;margin:-1px 0 0 0;border-top:0 none;box-sizing:border-box;box-shadow:0 1px 3px rgba(0,0,0,.1);border-radius:0 0 3px 3px}.selectize-dropdown [data-selectable]{cursor:pointer;overflow:hidden}.selectize-dropdown [data-selectable] .highlight{background:rgba(125,168,208,.2);border-radius:1px}.selectize-dropdown .create,.selectize-dropdown .no-results,.selectize-dropdown .optgroup-header,.selectize-dropdown .option{padding:5px 8px}.selectize-dropdown .option,.selectize-dropdown [data-disabled],.selectize-dropdown [data-disabled] [data-selectable].option{cursor:inherit;opacity:.5}.selectize-dropdown [data-selectable].option{opacity:1;cursor:pointer}.selectize-dropdown .optgroup:first-child .optgroup-header{border-top:0 none}.selectize-dropdown .optgroup-header{color:#303030;background:#fff;cursor:default}.selectize-dropdown .active{background-color:#f5fafd;color:#495c68}.selectize-dropdown .active.create{color:#495c68}.selectize-dropdown .create{color:rgba(48,48,48,.5)}.selectize-dropdown-content{overflow-y:auto;overflow-x:hidden;max-height:200px;overflow-scrolling:touch}.selectize-dropdown .spinner{display:inline-block;width:30px;height:30px;margin:5px 8px}.selectize-dropdown .spinner:after{content:" ";display:block;width:24px;height:24px;margin:3px;border-radius:50%;border:5px solid #d0d0d0;border-color:#d0d0d0 transparent #d0d0d0 transparent;animation:lds-dual-ring 1.2s linear infinite}@keyframes lds-dual-ring{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.selectize-control.single .selectize-input,.selectize-control.single .selectize-input input{cursor:pointer}.selectize-control.single .selectize-input.input-active,.selectize-control.single .selectize-input.input-active input{cursor:text}.selectize-control.single .selectize-input:after{content:" ";display:block;position:absolute;top:50%;right:15px;margin-top:-3px;width:0;height:0;border-style:solid;border-width:5px 5px 0 5px;border-color:gray transparent transparent transparent}.selectize-control.single .selectize-input.dropdown-active:after{margin-top:-4px;border-width:0 5px 5px 5px;border-color:transparent transparent gray transparent}.selectize-control.rtl{text-align:right}.selectize-control.rtl.single .selectize-input:after{left:15px;right:auto}.selectize-control.rtl .selectize-input>input{margin:0 4px 0 -2px!important}.selectize-control .selectize-input.disabled{opacity:.5;background-color:#fafafa}.selectize-control.multi .selectize-input.has-items{padding-left:5px;padding-right:5px}.selectize-control.multi .selectize-input.disabled [data-value]{color:#999;text-shadow:none;background:0 0;box-shadow:none}.selectize-control.multi .selectize-input.disabled [data-value],.selectize-control.multi .selectize-input.disabled [data-value] .remove{border-color:#e6e6e6}.selectize-control.multi .selectize-input.disabled [data-value] .remove{background:0 0}.selectize-control.multi .selectize-input [data-value]{text-shadow:0 1px 0 rgba(0,51,83,.3);border-radius:3px;background-color:#1b9dec;background-image:linear-gradient(to bottom,#1da7ee,#178ee9);background-repeat:repeat-x;box-shadow:0 1px 0 rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.03)}.selectize-control.multi .selectize-input [data-value].active{background-color:#0085d4;background-image:linear-gradient(to bottom,#008fd8,#0075cf);background-repeat:repeat-x}.selectize-control.single .selectize-input{box-shadow:0 1px 0 rgba(0,0,0,.05),inset 0 1px 0 rgba(255,255,255,.8);background-color:#f9f9f9;background-image:linear-gradient(to bottom,#fefefe,#f2f2f2);background-repeat:repeat-x}.selectize-control.single .selectize-input,.selectize-dropdown.single{border-color:#b8b8b8}.selectize-dropdown .optgroup-header{padding-top:7px;font-weight:700;font-size:.85em}.selectize-dropdown .optgroup{border-top:1px solid #f0f0f0}.selectize-dropdown .optgroup:first-child{border-top:0 none} \ No newline at end of file diff --git a/ScreeningMediaSelection/style/selectize.min.css b/ScreeningMediaSelection/style/selectize.min.css new file mode 100644 index 0000000..bfca6d1 --- /dev/null +++ b/ScreeningMediaSelection/style/selectize.min.css @@ -0,0 +1 @@ +.selectize-control.plugin-drag_drop.multi>.selectize-input>div.ui-sortable-placeholder{visibility:visible!important;background:#f2f2f2!important;background:rgba(0,0,0,.06)!important;border:0 none!important;box-shadow:inset 0 0 12px 4px #fff}.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after{content:"!";visibility:hidden}.selectize-control.plugin-drag_drop .ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.selectize-control .dropdown-header{position:relative;padding:10px 8px;border-bottom:1px solid #d0d0d0;background:#f8f8f8;border-radius:3px 3px 0 0}.selectize-control .dropdown-header-close{position:absolute;right:8px;top:50%;color:#303030;opacity:.4;margin-top:-12px;line-height:20px;font-size:20px!important}.selectize-control .dropdown-header-close:hover{color:#000}.selectize-dropdown.plugin-optgroup_columns .selectize-dropdown-content{display:flex}.selectize-dropdown.plugin-optgroup_columns .optgroup{border-right:1px solid #f2f2f2;border-top:0 none;flex-grow:1;flex-basis:0;min-width:0}.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child{border-right:0 none}.selectize-dropdown.plugin-optgroup_columns .optgroup:before{display:none}.selectize-dropdown.plugin-optgroup_columns .optgroup-header{border-top:0 none}.selectize-control.plugin-remove_button .item{display:inline-flex;align-items:center;padding-right:0!important}.selectize-control.plugin-remove_button .item .remove{color:inherit;text-decoration:none;vertical-align:middle;display:inline-block;padding:2px 6px;border-left:1px solid #d0d0d0;border-radius:0 2px 2px 0;box-sizing:border-box;margin-left:6px}.selectize-control.plugin-remove_button .item .remove:hover{background:rgba(0,0,0,.05)}.selectize-control.plugin-remove_button .item.active .remove{border-left-color:#cacaca}.selectize-control.plugin-remove_button .disabled .item .remove:hover{background:0 0}.selectize-control.plugin-remove_button .disabled .item .remove{border-left-color:#fff}.selectize-control.plugin-remove_button .remove-single{position:absolute;right:0;top:0;font-size:23px}.selectize-control{position:relative}.selectize-dropdown,.selectize-input,.selectize-input input{color:#303030;font-family:inherit;font-size:13px;line-height:18px;font-smoothing:inherit}.selectize-control.single .selectize-input.input-active,.selectize-input{background:#fff;cursor:text;display:inline-block}.selectize-input{border:1px solid #d0d0d0;padding:8px 8px;display:inline-block;width:100%;overflow:hidden;position:relative;z-index:1;box-sizing:border-box;box-shadow:inset 0 1px 1px rgba(0,0,0,.1);border-radius:3px}.selectize-control.multi .selectize-input.has-items{padding:calc(8px - 2px - 0) 8px calc(8px - 2px - 3px - 0)}.selectize-input.full{background-color:#fff}.selectize-input.disabled,.selectize-input.disabled *{cursor:default!important}.selectize-input.focus{box-shadow:inset 0 1px 2px rgba(0,0,0,.15)}.selectize-input.dropdown-active{border-radius:3px 3px 0 0}.selectize-input>*{vertical-align:baseline;display:inline-block;zoom:1}.selectize-control.multi .selectize-input>div{cursor:pointer;margin:0 3px 3px 0;padding:2px 6px;background:#f2f2f2;color:#303030;border:0 solid #d0d0d0}.selectize-control.multi .selectize-input>div.active{background:#e8e8e8;color:#303030;border:0 solid #cacaca}.selectize-control.multi .selectize-input.disabled>div,.selectize-control.multi .selectize-input.disabled>div.active{color:#7d7d7d;background:#fff;border:0 solid #fff}.selectize-input>input{display:inline-block!important;padding:0!important;min-height:0!important;max-height:none!important;max-width:100%!important;margin:0!important;text-indent:0!important;border:0 none!important;background:0 0!important;line-height:inherit!important;user-select:auto!important;box-shadow:none!important}.selectize-input>input::-ms-clear{display:none}.selectize-input>input:focus{outline:0!important}.selectize-input>input[placeholder]{box-sizing:initial}.selectize-input.has-items>input{margin:0 4px!important}.selectize-input::after{content:" ";display:block;clear:left}.selectize-input.dropdown-active::before{content:" ";display:block;position:absolute;background:#f0f0f0;height:1px;bottom:0;left:0;right:0}.selectize-dropdown{position:absolute;top:100%;left:0;width:100%;z-index:10;border:1px solid #d0d0d0;background:#fff;margin:-1px 0 0 0;border-top:0 none;box-sizing:border-box;box-shadow:0 1px 3px rgba(0,0,0,.1);border-radius:0 0 3px 3px}.selectize-dropdown [data-selectable]{cursor:pointer;overflow:hidden}.selectize-dropdown [data-selectable] .highlight{background:rgba(125,168,208,.2);border-radius:1px}.selectize-dropdown .create,.selectize-dropdown .no-results,.selectize-dropdown .optgroup-header,.selectize-dropdown .option{padding:5px 8px}.selectize-dropdown .option,.selectize-dropdown [data-disabled],.selectize-dropdown [data-disabled] [data-selectable].option{cursor:inherit;opacity:.5}.selectize-dropdown [data-selectable].option{opacity:1;cursor:pointer}.selectize-dropdown .optgroup:first-child .optgroup-header{border-top:0 none}.selectize-dropdown .optgroup-header{color:#303030;background:#fff;cursor:default}.selectize-dropdown .active{background-color:#f5fafd;color:#495c68}.selectize-dropdown .active.create{color:#495c68}.selectize-dropdown .create{color:rgba(48,48,48,.5)}.selectize-dropdown-content{overflow-y:auto;overflow-x:hidden;max-height:200px;overflow-scrolling:touch}.selectize-dropdown .spinner{display:inline-block;width:30px;height:30px;margin:5px 8px}.selectize-dropdown .spinner:after{content:" ";display:block;width:24px;height:24px;margin:3px;border-radius:50%;border:5px solid #d0d0d0;border-color:#d0d0d0 transparent #d0d0d0 transparent;animation:lds-dual-ring 1.2s linear infinite}@keyframes lds-dual-ring{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.selectize-control.single .selectize-input,.selectize-control.single .selectize-input input{cursor:pointer}.selectize-control.single .selectize-input.input-active,.selectize-control.single .selectize-input.input-active input{cursor:text}.selectize-control.single .selectize-input:after{content:" ";display:block;position:absolute;top:50%;right:15px;margin-top:-3px;width:0;height:0;border-style:solid;border-width:5px 5px 0 5px;border-color:gray transparent transparent transparent}.selectize-control.single .selectize-input.dropdown-active:after{margin-top:-4px;border-width:0 5px 5px 5px;border-color:transparent transparent gray transparent}.selectize-control.rtl{text-align:right}.selectize-control.rtl.single .selectize-input:after{left:15px;right:auto}.selectize-control.rtl .selectize-input>input{margin:0 4px 0 -2px!important}.selectize-control .selectize-input.disabled{opacity:.5;background-color:#fafafa} \ No newline at end of file diff --git a/ScreeningMediaSelection/style/style.css b/ScreeningMediaSelection/style/style.css new file mode 100644 index 0000000..6c481e7 --- /dev/null +++ b/ScreeningMediaSelection/style/style.css @@ -0,0 +1,409 @@ +@import "selectize.min.css"; +@import "selectize.default.min.css"; +@font-face { + font-family: "Aktiv Grotesk"; + font-weight: 300; + src: url("fonts/AktivGrotesk_W_Lt.woff"); +} +@font-face { + font-family: "Aktiv Grotesk"; + font-weight: 400; + src: url("fonts/AktivGrotesk_W_Rg.woff"); +} +html { + font-size: 10px; +} +html.showell { + font-size: 4px; +} +@media (max-width:1400px) { + html { + font-size: 8px; + } +} +@media (max-width:1000px) { + html { + font-size: 6px; + } +} +@media (max-device-width:600px) { + html { + font-size: 5px; + } +} +@media (max-device-width:400px) { + html { + font-size: 4px; + } +} +@media (max-device-width:300px) { + html { + font-size: 3px; + } +} +@media (max-device-width:200px) { + html { + font-size: 2px; + } +} +.displaynone { + display: none; +} +#holder { + max-width: 192rem; + padding: 5rem; + width: 100%; + margin: 0 auto; + font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; +} +@media (max-width:1400px) { + #holder { + padding: 2rem; + } +} +@media (max-width:1000px) { + #holder { + padding: 1rem; + } +} +body { + font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; + padding: 0; + margin: 0; + background-color: #0099ff; + color: #fff; +} +header { + position: absolute; + top: 0; + left: 0; + height: 18rem; + background-color: #0099ff; + width: 100%; + z-index: 10; + font-size: 3rem; +} +.lines { + position: absolute; + left: 0; + bottom: 0; + height: auto; + width: 100%; +} +#back_header { + position: absolute; + top: 3rem; + left: 3rem; + text-transform: uppercase; + font-size: 3rem; + display: none; +} +#back_header a { + color: #fff; +} +#back_header a:before { + content: ''; + display: inline-block; + width: 1.5rem; + height: 2.2rem; + margin-right: 1.7rem; + background-image: url("images/back-arrow.svg"); + background-position: 0 0; + background-size: 100% 100%; +} +* { + padding: 0; + margin: 0; + box-sizing: border-box; + font-weight: 300; + font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; + text-decoration: none; +} +h2 { + text-transform: uppercase; + font-size: 7rem; + margin-bottom: 3.4rem; + margin-top: 15rem; + text-align: center; +} +h3 { + font-size: 3rem; + font-style: italic; + text-align: center; + font-weight: 600; +} +.logo { + display: block; + width: 100%; + margin: 7rem auto 0; + position: absolute; + z-index: 11; + text-align: center; +} +.logo img { + width: 25rem; +} +#calculator_locale_selector { + position: absolute; + right: 3rem; + top: 3rem; +} +#calculator_locale_selector img { + height: 3.4rem; +} +#calculator_locale_selector #openLocaleMenu { + text-decoration: none; +} +#calculator_locale_selector #calculator_locale_select_holder { + display: none; +} +#calculator_locale_selector #current_locale { + text-transform: uppercase; + color: #ffffff; + text-decoration: none; + display: inline-block; + font-size: 3rem; + vertical-align: top; + margin-left: 0.5rem; + font-weight: 300; + margin-top: 0rem; +} +section#locale { + opacity: 0; + pointer-events: none; + transition: opacity 500ms; + margin: 0 auto; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + color: #fff; + background-color: #0099ff; + z-index: 2; + min-height: 100%; + overflow: auto; + padding: 0; + display: none; +} +section#locale.hidden { + display: none; +} +section#locale.visible { + display: block; + opacity: 1; + pointer-events: auto; +} +section#locale ul { + padding-top: 18rem; +} +section#locale ul li { + text-align: center; + text-transform: uppercase; + font-size: 4.5rem; + border-bottom: 1px solid #fff; + padding: 2.5rem; + list-style: none; + cursor: pointer; +} +section#locale ul li:hover, +section#locale ul li.active { + background-color: rgba(255, 255, 255, 0.3); +} +section { + padding: 5rem 4rem; + opacity: 0; + pointer-events: none; + transition: opacity 500ms; + margin: 0 auto; +} +section.hidden { + display: none; +} +section.visible { + opacity: 1; + pointer-events: auto; +} +#results .tiles { + margin: 10rem auto; + text-align: center; +} +#results .tiles .tile { + width: 54rem; + margin: 2rem; + border: 1px solid #fff; + padding: 4rem; + font-size: 2.5rem; + text-align: center; + display: inline-block; +} +@media (max-device-width:600px) { + #results .tiles .tile { + display: block; + width: 100%; + } +} +#results .tiles .tile h4 { + height: 36px; +} +#results .tiles .tile p { + margin-top: 2rem; + font-size: 4rem; +} +#fields { + width: 50%; + margin: 10rem auto; + font-size: 4rem; +} +@media (max-width:1400px) { + #fields { + width: 75%; + } +} +@media (max-width:1000px) { + #fields { + width: 90%; + } +} +@media (max-device-width:600px) { + #fields { + width: 90%; + } +} +#fields .error { + color: #a00; + text-align: center; + font-weight: 700; +} +#fields .field { + position: relative; + margin-bottom: 6rem; +} +#fields .field .hint { + font-size: 60%; +} +#fields .field.hidden { + display: none; +} +#fields .field[data-type="select"]:after, +#fields .field .selectize-input:after { + display: block; + content: ""; + position: absolute; + right: 3rem; + bottom: 3rem; + width: 3rem; + height: 1.4rem; + background-image: url("../images/select-arrow.svg"); + background-size: 100% 100%; + background-repeat: no-repeat; + border: none !important; + top: auto !important; + margin: 0 !important; +} +#fields .field .selectize-input .item { + line-height: 1.2em; + display: block; +} +#fields .field .selectize-input input[type="select-one"] { + height: 100%; +} +#fields .field .selectize-input input[type="select-one"]::placeholder { + color: #fff; + opacity: 1; +} +#fields .field select, +#fields .field input, +#fields .field .select2-selection, +#fields .field .selectize-input { + background-color: #0099ff; + background-image: none !important; + border: 2px solid #fff; + color: #fff; + height: 8.5rem; + padding: 2rem; + display: inline-block; + width: 100%; + margin-top: 1rem; + border-radius: 0; + box-shadow: none !important; + font-size: 3.5rem; + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; +} +#fields .field select .empty, +#fields .field input .empty, +#fields .field .select2-selection .empty, +#fields .field .selectize-input .empty { + font-style: italic; +} +#fields .field .select2-selection__rendered { + color: #fff; + line-height: unset; +} +#fields .field .info, +#fields .field .product_model { + text-align: right; + font-style: italic; +} +#fields .field .result { + font-weight: 700; + text-align: center; +} +#fields .field .result h2 { + text-transform: uppercase; +} +#fields .field .result .resholder { + border: 1px solid #fff; + width: 50%; + margin: 0 auto; + padding: 2rem; +} +#fields .field .result .product_model { + font-size: 90%; + text-align: center; + font-style: normal; +} +#fields .field .result .res { + font-size: 110%; + font-weight: 400; + margin-top: 1rem; +} +#fields .field .result .res a { + color: #fff; +} +#fields .field .result .res .result_disclaimer { + margin-top: 1rem; + font-size: 60%; +} +#fields .field .result .disclaimer { + margin: 4rem 0; + font-size: 2.5rem; +} +#fields .field .result .disclaimer a { + color: #fff; + text-decoration: underline; +} +#fields .field input::-webkit-outer-spin-button, +#fields .field input::-webkit-inner-spin-button { + /* display: none; <- Crashes Chrome on hover */ + -webkit-appearance: none; + margin: 0; + /* <-- Apparently some margin are still there even though it's hidden */ +} +#fields .field input[type=number] { + -moz-appearance: textfield; + /* Firefox */ +} +.select2-results__option { + color: #0099ff; + font-size: 25px; + font-weight: 400; +} +.select2-results__option.select2-results__option--highlighted { + background-color: #0099ff; + color: #fff; +} +/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/ScreeningMediaSelection/style/style.css.map b/ScreeningMediaSelection/style/style.css.map new file mode 100644 index 0000000..c10f841 --- /dev/null +++ b/ScreeningMediaSelection/style/style.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["style.less"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file diff --git a/ScreeningMediaSelection/style/style.less b/ScreeningMediaSelection/style/style.less new file mode 100644 index 0000000..dc7d57d --- /dev/null +++ b/ScreeningMediaSelection/style/style.less @@ -0,0 +1,470 @@ +@font-family: "Aktiv Grotesk", Helvetica, Arial, sans-serif; + + +@font-face { + font-family: "Aktiv Grotesk"; + font-weight: 300; + src: url("fonts/AktivGrotesk_W_Lt.woff"); +} + +@font-face { + font-family: "Aktiv Grotesk"; + font-weight: 400; + src: url("fonts/AktivGrotesk_W_Rg.woff"); +} + +@mm: ~"(max-width:1400px)"; +@mms: ~"(max-width:1000px)"; +@mmxs: ~"(max-device-width:600px)"; +@mmxxs: ~"(max-device-width:400px)"; +@mmxxxs: ~"(max-device-width:300px)"; +@mmxxxxs: ~"(max-device-width:200px)"; + +html { + font-size: 10px; + + &.showell { + font-size: 4px; + } + + @media @mm { + font-size: 8px; + } + + @media @mms { + font-size: 6px; + } + + @media @mmxs { + font-size: 5px; + } + @media @mmxxs { + font-size: 4px; + } + @media @mmxxxs { + font-size: 3px; + } + @media @mmxxxxs { + font-size: 2px; + } +} + +.displaynone { + display: none; +} + +#holder { + max-width: 192rem; + @media @mm { + padding: 2rem; + } + @media @mms { + padding: 1rem; + } + padding: 5rem; + width: 100%; + margin: 0 auto; + font-family: @font-family; +} + +body { + font-family: @font-family; + padding: 0; + margin: 0; + background-color: #0099ff; + color: #fff; +} + +header { + position: absolute; + top: 0; + left: 0; + height: 18rem; + background-color: #0099ff; + width: 100%; + z-index: 10; + font-size: 3rem; +} + +.lines { + position: absolute; + left: 0; + bottom: 0; + height: auto; + width: 100%; +} + +#back_header { + position: absolute; + top: 3rem; + left: 3rem; + text-transform: uppercase; + font-size: 3rem; + display: none; + + a { + &:before { + content: ''; + display: inline-block; + width: 1.5rem; + height: 2.2rem; + margin-right: 1.7rem; + + + background-image: url("images/back-arrow.svg"); + background-position: 0 0; + background-size: 100% 100%; + } + + color: #fff; + } +} + + +* { + padding: 0; + margin: 0; + box-sizing: border-box; + font-weight: 300; + font-family: @font-family; + text-decoration: none; +} + +/// -- /// + +h2 { + text-transform: uppercase; + font-size: 7rem; + margin-bottom: 3.4rem; + margin-top: 15rem; + text-align: center; +} + +h3 { + font-size: 3rem; + font-style: italic; + text-align: center; + font-weight: 600; +} + + +.logo { + display: block; + width: 100%; + margin: 7rem auto 0; + position: absolute; + z-index: 11; + text-align: center; + + img { + width: 25rem; + } +} + +#calculator_locale_selector { + position: absolute; + right: 3rem; + top: 3rem; + + img { + height: 3.4rem; + } + + #openLocaleMenu { + text-decoration: none; + } + + #calculator_locale_select_holder { + display: none; + } + + #current_locale { + text-transform: uppercase; + color: #ffffff; + text-decoration: none; + display: inline-block; + font-size: 3rem; + vertical-align: top; + margin-left: .5rem; + font-weight: 300; + margin-top: 0rem; + } +} + +section#locale { + opacity: 0; + pointer-events: none; + transition: opacity 500ms; + margin: 0 auto; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + color: #fff; + background-color: #0099ff; + z-index: 2; + min-height: 100%; + overflow: auto; + + &.hidden { + display: none; + } + + &.visible { + display: block; + opacity: 1; + pointer-events: auto; + } + + padding: 0; + display: none; + + ul { + padding-top: 18rem; + + li { + text-align: center; + text-transform: uppercase; + font-size: 4.5rem; + border-bottom: 1px solid #fff; + padding: 2.5rem; + list-style: none; + cursor: pointer; + + &:hover, &.active { + background-color: rgba(255, 255, 255, 0.3); + } + } + } +} + +section { + padding: 5rem 4rem; + opacity: 0; + pointer-events: none; + transition: opacity 500ms; + margin: 0 auto; + + &.hidden { + display: none; + } + + &.visible { + opacity: 1; + pointer-events: auto; + } +} + +#results { + .tiles { + margin: 10rem auto; + text-align: center; + + .tile { + width: 54rem; + margin: 2rem; + border: 1px solid #fff; + padding: 4rem; + font-size: 2.5rem; + text-align: center; + display: inline-block; + + @media @mmxs { + display: block; + width: 100%; + } + + h4 { + height: 36px; + } + + p { + margin-top: 2rem; + font-size: 4rem; + } + } + + + } +} + +@import "selectize.min.css"; +@import "selectize.default.min.css"; + +#fields { + width: 50%; + margin: 10rem auto; + font-size: 4rem; + + @media @mm { + width: 75%; + } + + @media @mms { + width: 90%; + } + + @media @mmxs { + width: 90%; + } + + + .error { + color: #a00; + text-align: center; + font-weight: 700; + } + + .field { + position: relative; + margin-bottom: 6rem; + + .hint { + font-size: 60%; + } + + &.hidden { + display: none; + } + + &[data-type="select"], .selectize-input { + &:after { + + display: block; + content: ""; + position: absolute; + right: 3rem; + bottom: 3rem; + width: 3rem; + height: 1.4rem; + background-image: url("../images/select-arrow.svg"); + background-size: 100% 100%; + background-repeat: no-repeat; + border: none !important; + top: auto !important; + margin: 0 !important; + } + } + + .selectize-input { + .item { + line-height: 1.2em; + display: block; + } + + input[type="select-one"] { + height: 100%; + &::placeholder { + color: #fff; + opacity: 1; + } + } + } + + select, input, .select2-selection, .selectize-input { + background-color: #0099ff; + background-image: none !important; + border: 2px solid #fff; + color: #fff; + height: 8.5rem; + padding: 2rem; + display: inline-block; + width: 100%; + margin-top: 1rem; + border-radius: 0; + box-shadow: none !important; + font-size: 3.5rem; + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + + .empty { + font-style: italic; + } + } + + .select2-selection__rendered { + color: #fff; + line-height: unset; + } + + + .info, .product_model { + text-align: right; + font-style: italic; + } + + .result { + font-weight: 700; + text-align: center; + + h2 { + text-transform: uppercase; + } + + .resholder { + border: 1px solid #fff; + width: 50%; + margin: 0 auto; + padding: 2rem; + } + + .product_model { + font-size: 90%; + text-align: center; + font-style: normal; + } + + .res { + font-size: 110%; + font-weight: 400; + margin-top: 1rem; + + a { + color: #fff; + } + + .result_disclaimer { + margin-top: 1rem; + font-size: 60%; + } + } + + .disclaimer { + margin: 4rem 0; + font-size: 2.5rem; + + a { + color: #fff; + text-decoration: underline; + } + } + } + + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + /* display: none; <- Crashes Chrome on hover */ + -webkit-appearance: none; + margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ + } + + input[type=number] { + -moz-appearance: textfield; /* Firefox */ + } + + } +} + + +.select2-results__option { + color: #0099ff; + font-size: 25px; + font-weight: 400; + + &.select2-results__option--highlighted { + background-color: #0099ff; + color: #fff; + } +} \ No newline at end of file