diff --git a/challenges/first-chall-first-path/config.yml b/challenges/first-chall-first-path/config.yml new file mode 100644 index 0000000..4f76a4e --- /dev/null +++ b/challenges/first-chall-first-path/config.yml @@ -0,0 +1,9 @@ +title: "Can you write it ?" +description: "you see the flag but you cant copy/paste it" +hint: "write it down" +template: "image.html" +css: "./static/image-style.css" +javascript: "./static/image-script.js" +encoding_script: "encoder.sh" +static_files: + - "./static/image.png" diff --git a/challenges/first-chall-first-path/encoder.sh b/challenges/first-chall-first-path/encoder.sh new file mode 100755 index 0000000..564b5ab --- /dev/null +++ b/challenges/first-chall-first-path/encoder.sh @@ -0,0 +1,62 @@ +#!/bin/bash + +# Retrieve the flag from the first script argument +FLAG=$1 + +# Check if the flag has been provided +if [ -z "$FLAG" ]; then + FLAG='Final Flag : Flag{Raph is the best}' +fi + +SCRIPT_DIR=$(dirname "$BASH_SOURCE") +# Create a temporary directory for the python file +TEMP_DIR=$(mktemp -d "python.XXXXXX") +PYTHON_FILE="$TEMP_DIR/createimg.py" + +# Create the Java file with the class content +cat < "$PYTHON_FILE" +#!/usr/bin/env python +from PIL import Image, ImageDraw, ImageFont +import sys +import os + +def create_text_image(text, output_path): + # Définir la taille de l'image et la couleur de fond + img_width, img_height = 400, 400 + background_color = (255, 0, 0) # Rouge + text_color = (255, 255, 255) # Blanc + + # Créer une nouvelle image + image = Image.new('RGB', (img_width, img_height), color=background_color) + + # Initialiser le dessin sur l'image + draw = ImageDraw.Draw(image) + + # Charger une police (vous pouvez spécifier un chemin vers une police spécifique) + try: + font = ImageFont.truetype("arial.ttf", 50) + except IOError: + font = ImageFont.load_default() + + text_bbox = draw.textbbox((0, 0), text, font=font) + text_width = text_bbox[2] - text_bbox[0] + text_height = text_bbox[3] - text_bbox[1] + text_x = (img_width - text_width) / 2 + text_y = (img_height - text_height) / 2 + + # Ajouter le texte à l'image + draw.text((text_x, text_y), text, font=font, fill=text_color) + + # Enregistrer l'image + image.save(output_path) + + +image_path=os.path.join("..","$SCRIPT_DIR",'static','image.png') +create_text_image("$FLAG",image_path) +EOF + +# Execute the python file in the temporary directory +(cd "$TEMP_DIR" && python createimg.py) + +# Clean up: Remove the temporary directory +rm -r "$TEMP_DIR" diff --git a/challenges/first-chall-first-path/image.html b/challenges/first-chall-first-path/image.html new file mode 100644 index 0000000..7b0f74c --- /dev/null +++ b/challenges/first-chall-first-path/image.html @@ -0,0 +1,15 @@ + + + + + + image suivante + + + + +

Here is your flag

+

The flag is automatically created

+ + + \ No newline at end of file diff --git a/challenges/first-chall-first-path/image.py b/challenges/first-chall-first-path/image.py new file mode 100755 index 0000000..c19bab9 --- /dev/null +++ b/challenges/first-chall-first-path/image.py @@ -0,0 +1,36 @@ +#!/usr/bin/env python +from PIL import Image, ImageDraw, ImageFont +import sys +import os + +def create_text_image(text, output_path): + # Définir la taille de l'image et la couleur de fond + img_width, img_height = 400, 400 + background_color = (255, 0, 0) # Rouge + text_color = (255, 255, 255) # Blanc + + # Créer une nouvelle image + image = Image.new('RGB', (img_width, img_height), color=background_color) + + # Initialiser le dessin sur l'image + draw = ImageDraw.Draw(image) + + # Charger une police (vous pouvez spécifier un chemin vers une police spécifique) + try: + font = ImageFont.truetype("arial.ttf", 50) + except IOError: + font = ImageFont.load_default() + + text_bbox = draw.textbbox((0, 0), text, font=font) + text_width = text_bbox[2] - text_bbox[0] + text_height = text_bbox[3] - text_bbox[1] + text_x = (img_width - text_width) / 2 + text_y = (img_height - text_height) / 2 + + # Ajouter le texte à l'image + draw.text((text_x, text_y), text, font=font, fill=text_color) + + # Enregistrer l'image + image.save(output_path) + +create_text_image("/user/bin/env python",os.path.join(".","static","image.png")) diff --git a/challenges/first-chall-first-path/static/image-script.js b/challenges/first-chall-first-path/static/image-script.js new file mode 100644 index 0000000..e69de29 diff --git a/challenges/first-chall-first-path/static/image-style.css b/challenges/first-chall-first-path/static/image-style.css new file mode 100644 index 0000000..e69de29 diff --git a/challenges/first-chall-first-path/static/image.png b/challenges/first-chall-first-path/static/image.png new file mode 100644 index 0000000..606fbab Binary files /dev/null and b/challenges/first-chall-first-path/static/image.png differ diff --git a/challenges/first-chall-initial/config.yml b/challenges/first-chall-initial/config.yml new file mode 100644 index 0000000..bb6e2c7 --- /dev/null +++ b/challenges/first-chall-initial/config.yml @@ -0,0 +1,8 @@ +title: "CTF Michelin" +description: "Premiere page chez michelin" +hint: "check the CSS" +template: "index.html" +css: "./static/style.css" +javascript: "./static/script.js" +static_files: + - "./static/image_static.png" diff --git a/challenges/first-chall-initial/index.html b/challenges/first-chall-initial/index.html new file mode 100644 index 0000000..65fb7d6 --- /dev/null +++ b/challenges/first-chall-initial/index.html @@ -0,0 +1,30 @@ + + + + + + CTF/Jeu de piste Michelin + + + + + +
+

Jeu de piste

+
image
+
+
+
+

Fonctionnement

+

+ Le jeu de piste est composé de plusieurs énigmes. Pour chaque énigme, vous devez trouver un mot de passe qui vous permettra de passer à l'énigme suivante. + Les flag sont de la forme X_S0me-str1nG.html +

+

+
+ ps: ceci est deja un challenge +

+
+
+ + \ No newline at end of file diff --git a/challenges/first-chall-initial/static/image_static.png b/challenges/first-chall-initial/static/image_static.png new file mode 100644 index 0000000..440fab9 Binary files /dev/null and b/challenges/first-chall-initial/static/image_static.png differ diff --git a/challenges/first-chall-initial/static/script.js b/challenges/first-chall-initial/static/script.js new file mode 100644 index 0000000..e69de29 diff --git a/challenges/first-chall-initial/static/style.css b/challenges/first-chall-initial/static/style.css new file mode 100644 index 0000000..1ee3f54 --- /dev/null +++ b/challenges/first-chall-initial/static/style.css @@ -0,0 +1,54 @@ +*,*::after,*::before{ + margin: 0; + padding: 0; + box-sizing: border-box; +} +/* flag{ + {{flag}} +} */ + +body{ + min-height: 100vh; + height:100%; + font-family: Arial, Helvetica, sans-serif; +} +section{ + display: flex; + justify-content: space-evenly; + align-items: center; + height: 80vh; + background-color: #f1f1f1; +} +h1{ + font-family: Arial, Helvetica, sans-serif; + font-size: 5rem; + font-weight: 700; + color: #333; +} +.gradient { + font-weight: bold; + background: radial-gradient(circle, rgba(238,139,139,1) 0%, rgba(9,92,168,1) 100%); + -webkit-background-clip: text; + background-clip: text; + color: transparent; +} +h2{ + font-family: Arial, Helvetica, sans-serif; + font-size: 3rem; + font-weight: 400; + color: #333; +} + +@media screen and (max-width: 768px){ + section{ + flex-direction: column; + } + h1{ + text-align: center; + font-size: 3rem; + } + h2{ + font-size: 2rem; + } + +} \ No newline at end of file diff --git a/challenges/first-chall-second-path/api.py b/challenges/first-chall-second-path/api.py new file mode 100644 index 0000000..06a2e15 --- /dev/null +++ b/challenges/first-chall-second-path/api.py @@ -0,0 +1,21 @@ +from fastapi import APIRouter, Request +from fastapi.templating import Jinja2Templates + + + +def create_router(templates: Jinja2Templates): + router = APIRouter() + @router.get("/{{chall_name}}") + async def template(request: Request): + data = {"request": request} + var = templates.TemplateResponse("{{chall_name}}", data) + return var + + @router.post("/{{chall_name}}") + def send_flag(): + return {"message":"GG you finished the CTF Now create your own challs"} #"/{{sub_path}}/{{flag}} "} + + return router + +router = create_router + diff --git a/challenges/first-chall-second-path/config.yml b/challenges/first-chall-second-path/config.yml new file mode 100644 index 0000000..134a98f --- /dev/null +++ b/challenges/first-chall-second-path/config.yml @@ -0,0 +1,7 @@ +title: "Je ne suis pas LA POSTE " +description: "from get to post" +hint: "use POST request to get the flag" +template: "p0ste.html" +css: "./static/p0ste-style.css" +javascript: "./static/p0ste-script.js" +api: "./api.py" diff --git a/challenges/first-chall-second-path/p0ste.html b/challenges/first-chall-second-path/p0ste.html new file mode 100644 index 0000000..200031d --- /dev/null +++ b/challenges/first-chall-second-path/p0ste.html @@ -0,0 +1,11 @@ + + + + + + Je ne suis pas la poste + + +

Send a post request to {{chall_name}} to get the flag

+ + \ No newline at end of file diff --git a/challenges/first-chall-second-path/static/p0ste-script.js b/challenges/first-chall-second-path/static/p0ste-script.js new file mode 100644 index 0000000..e69de29 diff --git a/challenges/first-chall-second-path/static/p0ste-style.css b/challenges/first-chall-second-path/static/p0ste-style.css new file mode 100644 index 0000000..e69de29 diff --git a/challenges/second-chall-first-path/config.yml b/challenges/second-chall-first-path/config.yml new file mode 100644 index 0000000..74377e3 --- /dev/null +++ b/challenges/second-chall-first-path/config.yml @@ -0,0 +1,6 @@ +title: "A thousand problem" +description: "Can you count to that ?" +hint: "change data-number to 999 and click on the button or chec the script" +template: "th0usand.html" +css: "./static/th0usand-style.css" +javascript: "./static/th0usand-script.js" diff --git a/challenges/second-chall-first-path/static/th0usand-script.js b/challenges/second-chall-first-path/static/th0usand-script.js new file mode 100644 index 0000000..b766412 --- /dev/null +++ b/challenges/second-chall-first-path/static/th0usand-script.js @@ -0,0 +1 @@ +//empty \ No newline at end of file diff --git a/challenges/second-chall-first-path/static/th0usand-style.css b/challenges/second-chall-first-path/static/th0usand-style.css new file mode 100644 index 0000000..6ee5f63 --- /dev/null +++ b/challenges/second-chall-first-path/static/th0usand-style.css @@ -0,0 +1,8 @@ +#channel { + width: 400px; + height: 300px; + border: 1px solid black; + padding: 20px; + margin: 0 auto; + text-align: center; +} \ No newline at end of file diff --git a/challenges/second-chall-first-path/th0usand.html b/challenges/second-chall-first-path/th0usand.html new file mode 100644 index 0000000..d6dee6c --- /dev/null +++ b/challenges/second-chall-first-path/th0usand.html @@ -0,0 +1,67 @@ + + + + Chasse au trésor + + + + + + +
+

Chasse au trésor

+

Trouvez le drapeau pour gagner!

+ + + + + + Increment Button + + + + + + + + + +

+
+ + + + + \ No newline at end of file diff --git a/challenges/second-chall-initial/config.yml b/challenges/second-chall-initial/config.yml new file mode 100644 index 0000000..e066ca8 --- /dev/null +++ b/challenges/second-chall-initial/config.yml @@ -0,0 +1,6 @@ +title: "Choisis ta voie" +description: "Fromage ou dessert ?" +hint: "Clic on the chosen track (you might inspect the link and use the href)" +template: "s3parat3.html" +css: "./static/s3parat3-style.css" +javascript: "./static/s3parat3-script.js" diff --git a/challenges/second-chall-initial/s3parat3.html b/challenges/second-chall-initial/s3parat3.html new file mode 100644 index 0000000..4b5f26f --- /dev/null +++ b/challenges/second-chall-initial/s3parat3.html @@ -0,0 +1,27 @@ + + + + + Choose your Path + + + + + + +
+ +
+ +

Choose ur path

+ +
+ {% for path in PATH["PATHS"] %} + + {% endfor %} +
+ + + + + \ No newline at end of file diff --git a/challenges/second-chall-initial/static/s3parat3-script.js b/challenges/second-chall-initial/static/s3parat3-script.js new file mode 100644 index 0000000..0f88c85 --- /dev/null +++ b/challenges/second-chall-initial/static/s3parat3-script.js @@ -0,0 +1,267 @@ +// +// ---Retro Button--- +// +var buttons = document.querySelectorAll('.btn'); + +for(var i = 0; i < buttons.length; i++) { + // Click + buttons[i].addEventListener('mousedown', function() { + this.classList.add('btn-active'); + }); + buttons[i].addEventListener('mouseup', function() { + this.classList.remove('btn-active'); + }); + + // Hover + buttons[i].addEventListener('mouseleave', function() { + this.classList.remove('btn-center', 'btn-right', 'btn-left', 'btn-active'); + }); + + buttons[i].addEventListener("mousemove", function(e) { + var leftOffset = this.getBoundingClientRect().left; + var btnWidth = this.offsetWidth; + var myPosX = e.pageX; + var newClass = ""; + // if on left 1/3 width of btn + if(myPosX < (leftOffset + .3 * btnWidth) ) { + newClass = 'btn-left' + } else { + // if on right 1/3 width of btn + if(myPosX > (leftOffset + .65 * btnWidth) ) { + newClass = 'btn-right'; + } else { + newClass = 'btn-center'; + } + } + // remove prev class + var clearedClassList = this.className.replace(/btn-center|btn-right|btn-left/gi, "").trim(); + this.className = clearedClassList + " " + newClass; + }); +} + + +// // +// // ---Retro Submit Button--- +// // +// var pButton = document.querySelector('.loader-button'); + +// // Click +// pButton.addEventListener('mousedown', function() { +// this.classList.add('btn-active'); +// }); +// pButton.addEventListener('mouseup', function() { +// this.classList.remove('btn-active'); +// }); + + +// Classie Helper Functions +// https://github.com/desandro/classie + +function classReg( className ) { + return new RegExp("(^|\\s+)" + className + "(\\s+|$)"); +} + +// classList support for class management +// altho to be fair, the api sucks because it won't accept multiple classes at once +var hasClass, addClass, removeClass; + +if ( 'classList' in document.documentElement ) { + hasClass = function( elem, c ) { + return elem.classList.contains( c ); + }; + addClass = function( elem, c ) { + elem.classList.add( c ); + }; + removeClass = function( elem, c ) { + elem.classList.remove( c ); + }; +} +else { + hasClass = function( elem, c ) { + return classReg( c ).test( elem.className ); + }; + addClass = function( elem, c ) { + if ( !hasClass( elem, c ) ) { + elem.className = elem.className + ' ' + c; + } + }; + removeClass = function( elem, c ) { + elem.className = elem.className.replace( classReg( c ), ' ' ); + }; +} + +function toggleClass( elem, c ) { + var fn = hasClass( elem, c ) ? removeClass : addClass; + fn( elem, c ); +} + +var classie = { + // full names + hasClass: hasClass, + addClass: addClass, + removeClass: removeClass, + toggleClass: toggleClass, + // short names + has: hasClass, + add: addClass, + remove: removeClass, + toggle: toggleClass +}; + +// transport +if ( typeof define === 'function' && define.amd ) { + // AMD + define( classie ); +} else { + // browser global + window.classie = classie; +} + + +// Loader Progress Functionality + +function extend( a, b ) { + for( var key in b ) { + if( b.hasOwnProperty( key ) ) { + a[key] = b[key]; + } + } + return a; +} + +function LoaderButton( el, options ) { + this.button = el; + this.options = extend( {}, this.options ); + extend( this.options, options ); + this._init(); +} + +LoaderButton.prototype.options = { + statusTime : 1500 +}; + +LoaderButton.prototype._init = function() { + this._create(); + this._initEvents(); +}; + +LoaderButton.prototype._create = function() { + var textEl = document.createElement( 'span' ); + textEl.className = 'content'; + textEl.innerHTML = this.button.innerHTML; + var progressEl = document.createElement( 'span' ); + progressEl.className = 'progress'; + + var progressInnerEl = document.createElement( 'span' ); + progressInnerEl.className = 'progress-inner'; + progressEl.appendChild( progressInnerEl ); + + this.button.innerHTML = ''; + + this.button.appendChild( textEl ); + this.button.appendChild( progressEl ); + + // element for progress bar + this.progress = progressInnerEl; + + this.progressProp = 'width'; + this._enable(); +}; + +LoaderButton.prototype._setProgress = function( val ) { + this.progress.style[ this.progressProp ] = 100 * val + '%'; +}; + +LoaderButton.prototype._initEvents = function() { + var self = this; + this.button.addEventListener( 'click', function() { + // disable button + self.button.setAttribute( 'disabled', '' ); + // add class state-loading to button + classie.remove( self.progress, 'notransition' ); + classie.add( this, 'state-loading' ); + + setTimeout( function() { + if( typeof self.options.callback === 'function' ) { + self.options.callback( self ); + } + else { + self._setProgress( 1 ); + var onEndTransFn = function( ev ) { + if( ev.propertyName !== self.progressProp ) { + return; + } + this.removeEventListener( 'transitionend', onEndTransFn ); + self._stop(); + }; + + self.progress.addEventListener( 'transitionend', onEndTransFn ); + } + }, + 200 ); // 200ms timeout + } ); +}; + +LoaderButton.prototype._stop = function( status ) { + var self = this; + + setTimeout( function() { + // fade out progress bar + self.progress.style.opacity = 0; + var onEndTransFn = function( ev ) { + if( ev.propertyName !== 'opacity' ) return; + this.removeEventListener( 'transitionend', onEndTransFn ); + classie.add( self.progress, 'notransition' ); + self.progress.style[ self.progressProp ] = '0%'; + self.progress.style.opacity = 1; + }; + + self.progress.addEventListener( 'transitionend', onEndTransFn ); + + // add class state-success to button + if( typeof status === 'number' ) { + var statusClass = status >= 0 ? 'state-success' : 'state-error'; + classie.add( self.button, statusClass ); + // after options.statusTime remove status icon + setTimeout( function() { + classie.remove( self.button, statusClass ); + self._enable(); + }, self.options.statusTime ); + } + else { + self._enable(); + } + + // remove class state-loading from the button + classie.remove( self.button, 'state-loading' ); + }, 100 ); +}; + +// enable button +LoaderButton.prototype._enable = function() { + this.button.removeAttribute( 'disabled' ); +} + +// add to global namespace +window.LoaderButton = LoaderButton; + + +// Initialize Submit Button + +[].slice.call( document.querySelectorAll( 'button.loader-button' ) ).forEach( function( bttn ) { + new LoaderButton( bttn, { + callback : function( instance ) { + var progress = 0, + interval = setInterval( function() { + // progress is randomly calculated + progress = Math.min( progress + Math.random() * 0.1, 1 ); + instance._setProgress( progress ); + + if( progress === 1 ) { + instance._stop(1); + clearInterval( interval ); + } + }, 200 ); // 200ms interval + } + } ); +} ); diff --git a/challenges/second-chall-initial/static/s3parat3-style.css b/challenges/second-chall-initial/static/s3parat3-style.css new file mode 100644 index 0000000..50c6e57 --- /dev/null +++ b/challenges/second-chall-initial/static/s3parat3-style.css @@ -0,0 +1,323 @@ +body { + background: #e0e5ec; + font-family: Arial, Helvetica, sans-serif; +} +h1 { + position: relative; + text-align: center; + color: #353535; + font-size: 50px; +} +a{ + text-decoration: none; + color: white; +} +p { + font-family: 'Lato', sans-serif; + font-weight: 300; + text-align: center; + font-size: 18px; + color: #676767; +} +.frame { + width: 90%; + margin: 40px auto; + text-align: center; +} +button { + margin: 20px; +} +.custom-btn { + width: 130px; + height: 40px; + color: #fff; + border-radius: 5px; + padding: 10px 25px; + font-family: 'Lato', sans-serif; + font-weight: 500; + background: transparent; + cursor: pointer; + transition: all 0.3s ease; + position: relative; + display: inline-block; + box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5), + 7px 7px 20px 0px rgba(0,0,0,.1), + 4px 4px 5px 0px rgba(0,0,0,.1); + outline: none; +} + +/* 1 */ +.btn-1 { + background: rgb(6,14,131); + background: linear-gradient(0deg, rgba(6,14,131,1) 0%, rgba(12,25,180,1) 100%); + border: none; +} +.btn-1:hover { + background: rgb(0,3,255); +background: linear-gradient(0deg, rgba(0,3,255,1) 0%, rgba(2,126,251,1) 100%); +} + +/* 2 */ +.btn-2 { + background: rgb(96,9,240); + background: linear-gradient(0deg, rgba(96,9,240,1) 0%, rgba(129,5,240,1) 100%); + border: none; + +} +.btn-2:before { + height: 0%; + width: 2px; +} +.btn-2:hover { + box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5), + -4px -4px 6px 0 rgba(116, 125, 136, .5), + inset -4px -4px 6px 0 rgba(255,255,255,.2), + inset 4px 4px 6px 0 rgba(0, 0, 0, .4); +} + + +/* 3 */ +.btn-3 { + border: none; + transition: all 0.3s ease; + overflow: hidden; +} +.btn-3:after { + position: absolute; + content: " "; + z-index: -1; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: #1fd1f9; +background-image: linear-gradient(315deg, #1fd1f9 0%, #b621fe 74%); + transition: all 0.3s ease; +} +.btn-3:hover { + background: transparent; + box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5), + -4px -4px 6px 0 rgba(116, 125, 136, .2), + inset -4px -4px 6px 0 rgba(255,255,255,.5), + inset 4px 4px 6px 0 rgba(116, 125, 136, .3); + color: #fff; +} +.btn-3:hover:after { + -webkit-transform: scale(2) rotate(180deg); + transform: scale(2) rotate(180deg); + box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5), + -4px -4px 6px 0 rgba(116, 125, 136, .2), + inset -4px -4px 6px 0 rgba(255,255,255,.5), + inset 4px 4px 6px 0 rgba(116, 125, 136, .3); +} + +/* 4 */ +.btn-4 { + background: rgb(22,9,240); +background: linear-gradient(0deg, rgba(22,9,240,1) 0%, rgba(49,110,244,1) 100%); + color: #fff; + border: none; + transition: all 0.3s ease; + overflow: hidden; +} +.btn-4:after { + position: absolute; + content: " "; + top: 0; + left: 0; + z-index: -1; + width: 100%; + height: 100%; + transition: all 0.3s ease; + -webkit-transform: scale(.1); + transform: scale(.1); +} +.btn-4:hover { + color: #fff; + border: none; + background: transparent; +} +.btn-4:hover:after { + background: rgb(0,3,255); +background: linear-gradient(0deg, rgba(2,126,251,1) 0%, rgba(0,3,255,1)100%); + -webkit-transform: scale(1); + transform: scale(1); +} + +/* 5 */ +.btn-5 { + border: none; + background: rgb(251,33,117); + background: linear-gradient(0deg, rgba(251,33,117,1) 0%, rgba(234,76,137,1) 100%); + color: #fff; + overflow: hidden; +} +.btn-5:hover { + text-decoration: none; + color: #fff; +} +.btn-5:before { + position: absolute; + content: ''; + display: inline-block; + top: -180px; + left: 0; + width: 30px; + height: 100%; + background-color: #fff; + animation: shiny-btn1 3s ease-in-out infinite; +} +.btn-5:hover{ + opacity: .7; +} +.btn-5:active{ + box-shadow: 4px 4px 6px 0 rgba(255,255,255,.3), + -4px -4px 6px 0 rgba(116, 125, 136, .2), + inset -4px -4px 6px 0 rgba(255,255,255,.2), + inset 4px 4px 6px 0 rgba(0, 0, 0, .2); +} + + +@-webkit-keyframes shiny-btn1 { + 0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; } + 80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; } + 81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; } + 100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; } +} + + + +/* 6 */ +.btn-6 { + background-color: #89d8d3; +background-image: linear-gradient(315deg, #89d8d3 0%, #03c8a8 74%); + border: none; + z-index: 1; +} +.btn-6:after { + position: absolute; + content: ""; + width: 100%; + height: 0; + bottom: 0; + left: 0; + z-index: -1; + border-radius: 5px; + background-color: #4dccc6; +background-image: linear-gradient(315deg, #4dccc6 0%, #96e4df 74%); + box-shadow: + -7px -7px 20px 0px #fff9, + -4px -4px 5px 0px #fff9, + 7px 7px 20px 0px #0002, + 4px 4px 5px 0px #0001; + transition: all 0.3s ease; +} +.btn-6:hover { + color: #fff; +} +.btn-6:hover:after { + top: 0; + height: 100%; +} +.btn-6:active { + top: 2px; +} + + +/* 14 */ +.btn-7 { + background: rgb(255,151,0); + border: none; + z-index: 1; +} +.btn-7:after { + position: absolute; + content: ""; + width: 100%; + height: 0; + top: 0; + left: 0; + z-index: -1; + border-radius: 5px; + background-color: #eaf818; + background-image: linear-gradient(315deg, #eaf818 0%, #f6fc9c 74%); + box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5); + transition: all 0.3s ease; +} +.btn-7:hover { + color: #000; +} +.btn-7:hover:after { + top: auto; + bottom: 0; + height: 100%; +} +.btn-7:active { + top: 2px; +} + +/* 8 */ +.btn-8 { + background: #b621fe; + border: none; + z-index: 1; +} +.btn-8:after { + position: absolute; + content: ""; + width: 0; + height: 100%; + top: 0; + right: 0; + z-index: -1; + background-color: #663dff; + border-radius: 5px; + box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5), + 7px 7px 20px 0px rgba(0,0,0,.1), + 4px 4px 5px 0px rgba(0,0,0,.1); + transition: all 0.3s ease; +} +.btn-8:hover { + color: #fff; +} +.btn-8:hover:after { + left: 0; + width: 100%; +} +.btn-8:active { + top: 2px; +} + + +/* 9 */ +.btn-9 { + border: none; + color: #000; +} +.btn-9:after { + position: absolute; + content: ""; + width: 0; + height: 100%; + top: 0; + left: 0; + direction: rtl; + z-index: -1; + box-shadow: + -7px -7px 20px 0px #fff9, + -4px -4px 5px 0px #fff9, + 7px 7px 20px 0px #0002, + 4px 4px 5px 0px #0001; + transition: all 0.3s ease; +} +.btn-9:hover { + color: #000; +} +.btn-9:hover:after { + left: auto; + right: 0; + width: 100%; +} +.btn-9:active { + top: 2px; +} \ No newline at end of file diff --git a/paths_config.yml b/paths_config.yml new file mode 100644 index 0000000..71baa10 --- /dev/null +++ b/paths_config.yml @@ -0,0 +1,9 @@ +INITIAL: + - ./challenges/first-chall-initial/config.yml + - ./challenges/second-chall-initial/config.yml +PATHS: + path1: + - ./challenges/first-chall-first-path/config.yml + - ./challenges/second-chall-first-path/config.yml + path2: + - ./challenges/first-chall-second-path/config.yml