LICENSE AGREEMENT (the parties do hereby agree that) :
- The software (app) is for the sole use of licensee and shall be used only for the purpose set forth in this agreement.
- The licensee is granted a non-exclusive, non-transferable and non-assignable right to use the software solely for their intended use (no ownership rights to the products and documentation are transferred to the licensee. title to and ownership of the software and documentation and all applicable proprietary rights, including but not limited to, rights in patents, copyrights , author's rights, trademarks, trade names, graphic design and design elements, order of operations, algorithms, data structure, organizational features, know-how and identified trade secrets in the software and documentation if any, shall remain at all times with licensor).
- The licensee may not reverse engineer, decompile, alter, transfer, modify or create a derivative work of the software (licensee shall not reverse engineer, decompile or disassemble the software or any portion thereof, nor otherwise attempt to create or derive the source code (or the underlying ideas, algorithms, graphic designs, order of operations, or any other structures or organization)).
- Any such usage of the software must be made only on equipment owned or controlled by the licensee (the software (on other storage media) is a product proprietary to licensor, licensee shall protect the software with security measures which are the same as licensee employs to protect its like proprietary information).
- Licensee recognizes that the software, and customizations, updates or corrections, if any are the property of, and all rights thereto, are owned by licensor, licensee also acknowledges that such are a trade secret of licensor, are valuable and confidential to licensor, and that its use and disclosure must be carefully and continuously controlled (licensee hereby agrees and acknowledges that licensor shall own all code and modifications to the code and all copyrights, trade secrets and other intellectual property rights).
- Licensor shall have no liability to licensee for any damage sustained by licensee as a result of licensee use of the software (licensee agrees to indemnify and hold licensor harmless from any loss or damage to related to the software).
- Licensor provides the software to licensee "as is" licensor makes no warranties or representations that the software is free of errors or defects, or that it adequately performs the functions it is intended to perform (licensor is providing the software "as is" and there are no warranties, covenants, terms, express or implied, granted for the software).
- If licensee requests additional services, licensor shall inform licensee that the services requested constitute additional services and provide a quote for such services to licensee.
- Licensor further warrants that it shall not install or insert any virus or disabling code or take any action which would permit licensor or any third party to interfere with licensee quiet enjoyment of the software.
- It is our right to update any section of these license agreement, with or without notice. Help :
Units
there are two types of length units : absolute and relative.
- absolute lengths :
the units of absolute length are always fixed, and the length expressed in each of these appears exactly as its size:
px : pixels
pt : points
- relative lengths :
relative length units define a length relative to another length property :
vw : relative to 1% of the width of the viewport (the browser window size)
vh : relative to 1% of the height of the viewport (the browser window size)
% : relative to the parent element (defines the height/width in percent of the containing block)
Note : none & auto (the browser calculates) are not units.
Animation
- duration :
defines how long an animation should take to complete one cycle.
- delay :
if you use negative values, it specifies the number of seconds to wait before starting the animation. the animation starts as if it had already been playing for n seconds.
- iteration-count :
defines the number of times an animation has to be played.
number : a number that defines how many times an animation should be played.
infinite : defines that the animation should play infinitely (for ever).
- direction :
defines whether an animation should be played forwards, backwards or in alternate cycles.
normal : the animation is played as normal (forwards).
reverse : the animation is played in reverse direction (backwards).
alternate : the animation is played forwards first, then backwards.
alternate-reverse : the animation is played backwards first, then forwards.
- timing :
progress of an animation through the period of each cycle.
cubic-bezier (possible values are numeric values from 0 to 1) :
cubic-bezier(0.0, 0.0, 1.0, 1.0) : the animation has the same speed from start to end (linear).
cubic-bezier(0.25, 0.1, 0.25, 1.0) : the animation has a slow start, then fast, before it ends slowly (ease).
cubic-bezier(0.42, 0, 1.0, 1.0) : the animation has a slow start (ease-in).
cubic-bezier(0, 0, 0.58, 1.0) : the animation has a slow end (ease-out).
cubic-bezier(0.42, 0, 0.58, 1.0) : the animation has both a slow start and a slow end (ease-in-out).
- steps :
the first parameter defines the number of intervals of the function, it must be a positive integer (greater than 0). the second parameter is either the "start" or "end" value and defines the point at which the change of values occurs in the time interval.
- play-state :
specifies whether the animation is running or paused, inside a range, the play-state is specified by the last set (for all animations, inside the range).
- hue-rotate :
the hue-rotate is specified by the last set.
- by holding down the Set or Clear button for more than one second, the automatic Set or Clear feature will be activated (left to right select: Set and right to left select: Clear).
- Copy clean code.
- Convert code to image :
- The dimensions of the box must be in pixels.
- It support text & box style (no animation), select font & image (no url).
Content type :
- When using the draggable feature, the page position must be relative.
margin-top :margin-right :margin-bottom :margin-left :
- The top and bottom margins of elements sometimes combine to a single margin equal to the largest margin of two, it does not occur in the right and left margins! only in the top and bottom margins!
- In order to center the element horizontally, you can put the margin property as auto, then the element occupies the specified width and the remaining space is divided equally between the left and right margins.
position : : :
- Elements are then positioned using the top, bottom, left, and right properties. nonetheless, they will not work unless the position property is adjusted initially. Depending on the position value, they also work differently.
- top, bottom, left and right properties does not affect statically deployed elements, they are not positioned in a particular way. it always follows the normal flow of the page.
- Adjusting the top, right, bottom, and left properties of a relatively positioned element causes it to move away from its normal position. the content is no longer modified to fit into whatever gap the element leaves.
- An element with position: fixed, it is positioned relative to the viewport, meaning it always stays in the same position even if the page is scrolled. the top, right, bottom, and left properties are used to position the element, a fixed element does not create a gap in the page it would normally be placed on.
- An element with position: absolute, it is positioned relative to the nearest positioned ancestor (rather than relative to the viewport, as in fixed), however if an element of absolute positioned has no positioned ancestors, it uses the body of the document and moves along with page scrolling does, elements with absolute positions are removed of normal flow, and can overlap elements.
- An element with position: sticky, referring to the users scroll position, a sticky element switches between relative and fixed depending on the scroll position. it will be relative until a given offset position is seen in the viewport - then it will "sticks" in place (like position: fixed). for sticky positions to work, you must also specify at least one of top, right, bottom, or left properties.
overflow :
- The overflow property only operates for block elements having a definite height.
z-index :
- Z index works only on positioned elements (position: absolute, position: relative, position: fixed, or position: sticky).
- If background is not set, it defaults to no background.
duration :delay :iteration-count :
direction :timing :
play-state :
direction (angle) :background-size : background :color1 :color2 :color3 :color4 :color5 :color6 :color7 : background : background-position : background-size :hue-rotate : TO background :hue-rotate : TO background-position : TO background-size :
duration :delay :iteration-count :
direction :timing :
play-state :
vertical-align : TO vertical-align :
duration :delay :iteration-count :
direction :timing :
play-state :
- The outline is adjusted outside the border of the element and it might overlap with other content. As well as, the outline is not part of the dimensions of the element, the width and height of the entire element is not affected by the width of the outline.
duration :delay :iteration-count :
direction :timing :
play-state :
duration :delay :iteration-count :
direction :timing :
play-state :
blur : TO blur :
duration :delay :iteration-count :
direction :timing :
play-state :
transparent : TO transparent :
duration :delay :iteration-count :
direction :timing :
play-state :
mask-position : mask-size : TO mask-size :
duration :delay :iteration-count :
direction :timing :
play-state :
spacing : TO spacing :
duration :delay :iteration-count :
direction :timing :
play-state :
height : TO height :
font-size (px) :color :background :
duration :delay :iteration-count :
direction :timing :
play-state :
text-align : TO text-align :
duration :delay :iteration-count :
direction :timing :
play-state :
thickness : TO thickness :
duration :delay :iteration-count :
direction :timing :
play-state :
size : TO size :
- Select font : for offline content.
- Suggested formats : ttf, otf, woff, woff2
- Import font : for online content.
- Just select or import a new font the first time, you don't need to do it again (just remember the correct font name).
- Before using the font, get the permission of the owner of this font.
duration :delay :iteration-count :
direction :timing :
play-state :
TO TO
duration :delay :iteration-count :
direction :timing :
play-state :
or border-radius :
- Select image : for offline content.
- Suggested formats : jpg, jpeg, png, gif
- Url image : for online content.
- Before using the image, get the permission of the owner of this image.
or
- Select audio : for offline content.
- Suggested formats : mp3, wav, ogg
- Url audio : for online content.
- Before using the audio, get the permission of the owner of this audio.
or border-radius :
- Select video : for offline content.
- Suggested formats : mp4, webm, ogg
- Url video : for online content.
- Before using the video, get the permission of the owner of this video.
active page :insert page (after number page) :delete page :
display :
duration :delay :iteration-count :
direction :timing :
play-state :
- The top and bottom margins of elements sometimes combine to a single margin equal to the largest margin of two, it does not occur in the right and left margins! only in the top and bottom margins!
- In order to center the element horizontally, you can put the margin property as auto, then the element occupies the specified width and the remaining space is divided equally between the left and right margins.
- Elements are then positioned using the top, bottom, left, and right properties. nonetheless, they will not work unless the position property is adjusted initially. Depending on the position value, they also work differently.
- top, bottom, left and right properties does not affect statically deployed elements, they are not positioned in a particular way. it always follows the normal flow of the page.
- Adjusting the top, right, bottom, and left properties of a relatively positioned element causes it to move away from its normal position. the content is no longer modified to fit into whatever gap the element leaves.
- An element with position: fixed, it is positioned relative to the viewport, meaning it always stays in the same position even if the page is scrolled. the top, right, bottom, and left properties are used to position the element, a fixed element does not create a gap in the page it would normally be placed on.
- An element with position: absolute, it is positioned relative to the nearest positioned ancestor (rather than relative to the viewport, as in fixed), however if an element of absolute positioned has no positioned ancestors, it uses the body of the document and moves along with page scrolling does, elements with absolute positions are removed of normal flow, and can overlap elements.
- An element with position: sticky, referring to the users scroll position, a sticky element switches between relative and fixed depending on the scroll position. it will be relative until a given offset position is seen in the viewport - then it will "sticks" in place (like position: fixed). for sticky positions to work, you must also specify at least one of top, right, bottom, or left properties.
position : : :
- The overflow property only operates for block elements having a definite height.
overflow :
- Z index works only on positioned elements (position: absolute, position: relative, position: fixed, or position: sticky).
z-index :
- If background is not set, it defaults to no background.
duration :delay :iteration-count :
direction :timing :
play-state :
direction (angle) :background-size : background :color1 :color2 :color3 :color4 :color5 :color6 :color7 : background : background-position : background-size :hue-rotate : TO background :hue-rotate : TO background-position : TO background-size :
duration :delay :iteration-count :
direction :timing :
play-state :
vertical-align : TO vertical-align :
duration :delay :iteration-count :
direction :timing :
play-state :
- The outline is adjusted outside the border of the element and it might overlap with other content. As well as, the outline is not part of the dimensions of the element, the width and height of the entire element is not affected by the width of the outline.
duration :delay :iteration-count :
direction :timing :
play-state :