Skip to content

frontend-html-test #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
xPusHx wants to merge 1 commit into
base: master
Choose a base branch
from
Open

frontend-html-test #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions .gitattributes
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
# Auto detect text files and perform LF normalization
* text=auto

# Custom for Visual Studio
*.cs diff=csharp
*.sln merge=union
*.csproj merge=union
*.vbproj merge=union
*.fsproj merge=union
*.dbproj merge=union

# Standard to msysgit
*.doc diff=astextplain
*.DOC diff=astextplain
*.docx diff=astextplain
*.DOCX diff=astextplain
*.dot diff=astextplain
*.DOT diff=astextplain
*.pdf diff=astextplain
*.PDF diff=astextplain
*.rtf diff=astextplain
*.RTF diff=astextplain
43 changes: 43 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
# Windows image file caches
Thumbs.db
ehthumbs.db

# Folder config file
Desktop.ini

# Recycle Bin used on file shares
$RECYCLE.BIN/

# Windows Installer files
*.cab
*.msi
*.msm
*.msp

# =========================
# Operating System Files
# =========================

# OSX
# =========================

.DS_Store
.AppleDouble
.LSOverride

# Icon must end with two \r
Icon

# Thumbnails
._*

# Files that might appear on external disk
.Spotlight-V100
.Trashes

# Directories potentially created on remote AFP share
.AppleDB
.AppleDesktop
Network Trash Folder
Temporary Items
.apdisk
Expand Down
103 changes: 103 additions & 0 deletions components.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
<!DOCTYPE html>
<html>
<head>
<title>Компоненты</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<link href="css/components.css" rel="stylesheet">
<link href="css/normalize.css" rel="stylesheet">

<!--[if lt IE 9]>
<link href="css/progress-polyfill.css" rel="stylesheet">
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="component-container">
<h1>1. Компонент оценки</h1>
<div class="rating-component" data-rating="5">
<ul class="rating-component__stars">
<li></li>
<li class="rating-component__star-even"></li>
<li></li>
<li class="rating-component__star-even"></li>
<li></li>
<li class="rating-component__star-even"></li>
<li></li>
<li class="rating-component__star-even"></li>
<li></li>
<li class="rating-component__star-even"></li>
</ul>
<!--Обернул список блоком, так как кроме него в компоненте может присутствовать текст-->
</div>
</div>

<div class="component-container">
<h1>2. Прогресс-бар</h1>
<div class="progress-component">
<progress max="100" value="80"></progress>
<span class="progress-component__value">0%</span>
</div>
</div>
<div class="component-container">
<h1>3. Кнопка</h1>
<div class="group">
<h4>Виды</h4>
<div class="button-component normal"><span>DIV</span></div>
<a href="#" class="button-component normal"><span>A</span></a>
<button type="button" class="button-component normal"><span>BUTTON</span></button>

</div>
<div class="group">
<h4>Размеры</h4>
<button type="button" class="button-component small"><span>Small</span></button>
<button type="button" class="button-component normal"><span>Normal</span></button>
<button type="button" class="button-component big"><span>Big</span></button>
</div>
<div class="group">
<h4>Длины</h4>
<button type="button" class="button-component small short"><span>Ок</span></button>
<button type="button" class="button-component normal short"><span>Отмена</span></button>
<button type="button" class="button-component big short"><span>Кнопка</span></button>
<br><br>
<button type="button" class="button-component small long"><span>Длинная кнопка</span></button>
<button type="button" class="button-component normal long"><span>Длинная кнопка</span></button>
<button type="button" class="button-component big long"><span>Длинная кнопка</span></button>
</div>
<div class="group">
<h4>Окружение</h4>
<div class="test-container test-form">
<h5>Форма</h5>
<form>
<div class="form-inputs">
<div class="form-inputs__input-container">
<input placeholder="Имя" />
</div>
<div class="form-inputs__input-container">
<input placeholder="Email" />
</div>
<textarea placeholder="Сообщение"></textarea>
</div>
<div class="form-inputs__button-container">
<button type="button" class="button-component normal short"><span>ОК</span></button>
<button type="button" class="button-component normal"><span>Очистить</span></button>
</div>
</form>
</div>
<div class="test-container test-paragraph">
<h5>Текст</h5>
<p>Дип-скай объект перечеркивает центральный восход, а время ожидания ответа составило бы 80 миллиардов лет. Исполинская звездная спираль с поперечником в 50 кпк традиционно выслеживает первоначальный ионный хвост. Угловая скорость вращения отражает астероидный натуральный логарифм.<button type="button" class="button-component normal long"><span>Читать далее...</span></button></p>

</div>
</div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!--[if lt IE 9]>
<script>document.createElement('progress');</script>
<script src='js/progress-polyfill.min.js'></script>
<![endif]-->
<script src='js/all.js'></script>
</body>
</html>
Loading