Lili Agazadyan artlili
artlili
/ simple tab component vuejs
Last active
October 25, 2021 10:11
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <template> | |
| <div class="tabs"> | |
| <nav class="nav" :tabs="tabs"> | |
| <span v-for="tab in tabs" | |
| class="nav-link" | |
| :key="tab" | |
| :class="{'active': activeTab === tab}" | |
| @click="onClick(tab)" | |
| >{{tab}}</span> | |
| </nav> |
artlili
/ retina mixin
Created
June 17, 2020 14:43
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @mixin image-2x($image, $width, $height) { | |
| @media (min--moz-device-pixel-ratio: 1.3), | |
| (-o-min-device-pixel-ratio: 2.6/2), | |
| (-webkit-min-device-pixel-ratio: 1.3), | |
| (min-device-pixel-ratio: 1.3), | |
| (min-resolution: 1.3dppx) { | |
| /* on retina, use image that's scaled by 2 */ | |
| background-image: url($image); | |
| background-size: $width $height; | |
| } |
artlili
/ nuxt.config.js
Created
May 2, 2020 13:48
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module.exports = { | |
| /* | |
| Headers of the page | |
| - Nuxt.js uses vue-meta to update the headers and html attributes of your application. | |
| - Nuxt.js configures vue-meta with these options: | |
| { | |
| keyName: 'head', // the component option name that vue-meta looks for meta info on. | |
| attribute: 'data-n-head', // the attribute name vue-meta adds to the tags it observes | |
| ssrAttribute: 'data-n-head-ssr', // the attribute name that lets vue-meta know that meta info has already been server-rendered | |
| tagIDKeyName: 'hid' // the property name that vue-meta uses to determine whether to overwrite or append a tag |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| "scripts": { | |
| "update:packages": "node wipe-dependencies.js && rm -rf node_modules && npm update --save-dev && npm update --save" | |
| } |
artlili
/ swipe slider
Created
February 20, 2020 11:03
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Document</title> | |
| </head> | |
| <style> | |
| .slider { | |
| position:relative; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $bg-color: #ff8888; //start color | |
| $stops: 100; //smoothness | |
| $time: 20s; //duration of animation | |
| $hue-range: 20; //of 360deg | |
| body{ | |
| background-color: $bg-color; | |
| -webkit-animation: colorChange $time linear 0s infinite; | |
| animation: colorChange $time linear 0s infinite ; | |
| } |
artlili
/ simlpy localhost
Created
August 3, 2019 12:06
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| header('Access-Control-Allow-Origin: *'); | |
| echo $_SERVER('REMOTE_ADDR'); | |
| ?> | |
| console run php -S 127.0.0.1:8080 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /*** Usage | |
| +clear | |
| =clear | |
| &::after | |
| content: '' | |
| display: table | |
| clear: both | |
| /*** Usage | |
| +antialias |
artlili
/ adaptive_video
Created
May 29, 2019 11:24
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="relation"> | |
| <div class="relation__offset relation__offset-16-9"></div> | |
| <div class="relation__content"> | |
| <iframe class="video__content" src="https://www.youtube.com/embed/KFVoIzaGPYg" ></iframe> | |
| </div> | |
| </div> | |
| .relation{ | |
| max-width: 560px; | |
| position: relative; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Vue.component('backtotop', { | |
| template: '#backtotop', | |
| data: function() { | |
| return { | |
| isVisible: false | |
| }; | |
| }, | |
| methods: { | |
| initToTopButton: function() { | |
| $(document).bind('scroll', function() { |
NewerOlder