mirror of
https://github.com/encounter/react-add-to-calendar.git
synced 2026-07-10 21:18:44 -07:00
Publish new docs (automated commit)
This commit is contained in:
Jason Salzman
-51824
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 7.6 KiB |
@@ -1,17 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<title>React Add to Calendar Button crafted by Jason Salzman</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="description" content="A simple and reusable Add to Calendar component for React.">
|
||||
<meta name="keywords" content="React, HTML, CSS, JavaScript, JSX, date, calendar, add to calendar, event">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
<!-- vendors -->
|
||||
<script src="bundle.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,25 +0,0 @@
|
||||
#!/usr/bin/env bash
|
||||
|
||||
DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
|
||||
|
||||
npm run build
|
||||
|
||||
mkdir -p tmp
|
||||
|
||||
if [ ! -d "tmp/gh-pages" ]; then
|
||||
git clone git@github.com:jasonsalzman/react-add-to-calendar.git --branch gh-pages --single-branch tmp/gh-pages
|
||||
fi
|
||||
|
||||
cd tmp/gh-pages
|
||||
|
||||
git pull
|
||||
|
||||
find . -maxdepth 1 ! -name '.git' ! -name '.' -exec rm -r {} \;
|
||||
|
||||
cp -r $DIR/{bundle.js,index.html,style.css,images} ./
|
||||
|
||||
git add --all
|
||||
|
||||
git commit -m "Publish new docs (automated commit)"
|
||||
|
||||
git push
|
||||
@@ -1,5 +0,0 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import Root from './root'
|
||||
|
||||
ReactDOM.render(<Root />, document.getElementById('app'))
|
||||
@@ -1,3 +0,0 @@
|
||||
@mixin breakpoint($breakpoint) {
|
||||
@media (min-width: $breakpoint) { @content; }
|
||||
}
|
||||
@@ -1,18 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'CodeExampleComponent',
|
||||
|
||||
propTypes: {
|
||||
children: React.PropTypes.element,
|
||||
id: React.PropTypes.number,
|
||||
title: React.PropTypes.string
|
||||
},
|
||||
|
||||
render () {
|
||||
return <div key={this.props.id} id={`example-${this.props.id}`} className="example">
|
||||
<h2 className="example__heading">{this.props.title}</h2>
|
||||
{this.props.children}
|
||||
</div>
|
||||
}
|
||||
})
|
||||
@@ -1,52 +0,0 @@
|
||||
import React from 'react'
|
||||
import hljs from 'highlight.js'
|
||||
import Default from './examples/default'
|
||||
import CodeExampleComponent from './code_example_component'
|
||||
|
||||
import 'react-add-to-calendar/dist/react-add-to-calendar.css'
|
||||
import './style.scss'
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'exampleComponents',
|
||||
|
||||
componentDidMount () {
|
||||
hljs.initHighlightingOnLoad()
|
||||
},
|
||||
|
||||
examples: [
|
||||
{
|
||||
title: 'Default',
|
||||
component: <Default />
|
||||
}
|
||||
],
|
||||
|
||||
renderExamples () {
|
||||
return this.examples.map((example, index) =>
|
||||
<CodeExampleComponent key={`example-${index}`} id={index} title={example.title}>
|
||||
{example.component}
|
||||
</CodeExampleComponent>
|
||||
)
|
||||
},
|
||||
|
||||
renderLeftColumn () {
|
||||
return this.examples.map((example, index) =>
|
||||
<li className="examples__navigation-item" key={`link-${index}`}>
|
||||
<a href={`#example-${index}`}>
|
||||
{example.title}
|
||||
</a>
|
||||
</li>
|
||||
)
|
||||
},
|
||||
|
||||
render () {
|
||||
return <div>
|
||||
<h1>Examples</h1>
|
||||
<ul className="examples__navigation">
|
||||
{this.renderLeftColumn()}
|
||||
</ul>
|
||||
<div className="examples">
|
||||
{this.renderExamples()}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
})
|
||||
@@ -1,95 +0,0 @@
|
||||
.examples__navigation {
|
||||
display: none;
|
||||
|
||||
@include breakpoint(640px) {
|
||||
width: 200px;
|
||||
float: left;
|
||||
display: block;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
margin-right: 20px;
|
||||
border: 1px solid #e4e4e4;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.examples__navigation-item {
|
||||
border-bottom: 1px solid #e4e4e4;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
a {
|
||||
padding: 10px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
|
||||
&:hover {
|
||||
background: #f5f5f5;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.examples {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.example {
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #e4e4e4;
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
&__heading {
|
||||
color: #216ba5;
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
&__code {
|
||||
background-color: #f5f8fb;
|
||||
padding: 20px;
|
||||
margin: 0 -20px 20px;
|
||||
border-top: 1px solid #d8e4ef;
|
||||
border-bottom: 1px solid #d8e4ef;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
white-space: nowrap;
|
||||
|
||||
@include breakpoint(768px) {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
border-right: 1px solid #d8e4ef;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
code {
|
||||
background: none;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.red-border {
|
||||
border-color: #f00;
|
||||
}
|
||||
|
||||
.example-custom-input {
|
||||
cursor: pointer;
|
||||
padding: 5px 15px;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
background-color: #216ba5;
|
||||
font: inherit;
|
||||
color: #fff;
|
||||
}
|
||||
@@ -1,19 +0,0 @@
|
||||
import React from 'react'
|
||||
import AddToCalendar from 'react-add-to-calendar'
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'Default',
|
||||
|
||||
render () {
|
||||
return <div className="row">
|
||||
<pre className="column example__code">
|
||||
<code className="jsx">
|
||||
{"<AddToCalendar/>"}
|
||||
</code>
|
||||
</pre>
|
||||
<div className="column">
|
||||
<AddToCalendar/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
})
|
||||
@@ -1,44 +0,0 @@
|
||||
.hero {
|
||||
color: #fff;
|
||||
background-color: #216ba5;
|
||||
|
||||
&__content {
|
||||
@extend %container-styling;
|
||||
text-align: center;
|
||||
padding: 175px 0;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 34px;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-bottom: 0;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
&__image {
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
&__example {
|
||||
width: 210px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
&__crafted-by {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
&__crafted-by-link {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.github-ribbon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border: 0;
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
import React from 'react'
|
||||
import AddToCalendar from 'react-add-to-calendar'
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'HeroExample',
|
||||
|
||||
render () {
|
||||
return <AddToCalendar buttonTemplate={{'calendar-plus-o': 'left'}}/>
|
||||
}
|
||||
})
|
||||
@@ -1,122 +0,0 @@
|
||||
/*
|
||||
|
||||
github.com style (c) Vasily Polovnyov <vast@whiteants.net>
|
||||
|
||||
*/
|
||||
|
||||
.hljs {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
padding: 0.5em;
|
||||
color: #333;
|
||||
-webkit-text-size-adjust: none;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.diff .hljs-header {
|
||||
color: #998;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.css .rule .hljs-keyword,
|
||||
.hljs-winutils,
|
||||
.nginx .hljs-title,
|
||||
.hljs-subst,
|
||||
.hljs-request,
|
||||
.hljs-status {
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-number,
|
||||
.hljs-hexcolor,
|
||||
.ruby .hljs-constant {
|
||||
color: #008080;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-tag .hljs-value,
|
||||
.hljs-doctag,
|
||||
.tex .hljs-formula {
|
||||
color: #d14;
|
||||
}
|
||||
|
||||
.hljs-title,
|
||||
.hljs-id,
|
||||
.scss .hljs-preprocessor {
|
||||
color: #900;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-list .hljs-keyword,
|
||||
.hljs-subst {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.hljs-class .hljs-title,
|
||||
.hljs-type,
|
||||
.vhdl .hljs-literal,
|
||||
.tex .hljs-command {
|
||||
color: #458;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-tag,
|
||||
.hljs-tag .hljs-title,
|
||||
.hljs-rule .hljs-property,
|
||||
.django .hljs-tag .hljs-keyword {
|
||||
color: #000080;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.hljs-attribute,
|
||||
.hljs-variable,
|
||||
.lisp .hljs-body,
|
||||
.hljs-name {
|
||||
color: #008080;
|
||||
}
|
||||
|
||||
.hljs-regexp {
|
||||
color: #009926;
|
||||
}
|
||||
|
||||
.hljs-symbol,
|
||||
.ruby .hljs-symbol .hljs-string,
|
||||
.lisp .hljs-keyword,
|
||||
.clojure .hljs-keyword,
|
||||
.scheme .hljs-keyword,
|
||||
.tex .hljs-special,
|
||||
.hljs-prompt {
|
||||
color: #990073;
|
||||
}
|
||||
|
||||
.hljs-built_in {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-preprocessor,
|
||||
.hljs-pragma,
|
||||
.hljs-pi,
|
||||
.hljs-doctype,
|
||||
.hljs-shebang,
|
||||
.hljs-cdata {
|
||||
color: #999;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
background: #fdd;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
background: #dfd;
|
||||
}
|
||||
|
||||
.diff .hljs-change {
|
||||
background: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-chunk {
|
||||
color: #aaa;
|
||||
}
|
||||
@@ -1,142 +0,0 @@
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font: inherit;
|
||||
font-size: 100%;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
html {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
caption,
|
||||
th,
|
||||
td {
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
q,
|
||||
blockquote {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
q:before,
|
||||
q:after,
|
||||
blockquote:before,
|
||||
blockquote:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
|
||||
a img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
@@ -1,61 +0,0 @@
|
||||
import React from 'react'
|
||||
import ExampleComponents from './example_components.jsx'
|
||||
import HeroExample from './hero_example.jsx'
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'Root',
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<div className="hero">
|
||||
<div className="hero__content">
|
||||
<h1 className="hero__title">
|
||||
React Add to Calendar Button
|
||||
</h1>
|
||||
<div className="hero__crafted-by">
|
||||
<a href="http://4one.io" className="hero__crafted-by-link">
|
||||
Crafted by Jason Salzman
|
||||
</a>
|
||||
</div>
|
||||
<div className="hero__example">
|
||||
<HeroExample />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="wrapper">
|
||||
<h1>React Add to Calendar Button</h1>
|
||||
{ /* <p>
|
||||
<a href="https://npmjs.org/package/react-datepicker">
|
||||
<img src="https://badge.fury.io/js/react-datepicker.svg" className="badge" />
|
||||
</a>
|
||||
<a href="https://travis-ci.org/Hacker0x01/react-datepicker">
|
||||
<img src="https://travis-ci.org/Hacker0x01/react-datepicker.svg?branch=master" className="badge" />
|
||||
</a>
|
||||
<a href="https://david-dm.org/Hacker0x01/react-datepicker">
|
||||
<img src="https://david-dm.org/Hacker0x01/react-datepicker.svg" className="badge" />
|
||||
</a>
|
||||
<a href={'https://npmjs.org/package/react-datepicker' +
|
||||
'?__hstc=72727564.ca821b01b5b29b1831f0936a681f0483.1428679773810.1435582678273.1438354735499.5' +
|
||||
'&__hssc=72727564.1.1438354735499' +
|
||||
'&__hsfp=2497064007'}>
|
||||
<img src="https://img.shields.io/npm/dm/react-datepicker.svg" className="badge" />
|
||||
</a>
|
||||
</p> */}
|
||||
<p>A simple and reusable Add to Calendar component for React.</p>
|
||||
|
||||
<h2>Installation</h2>
|
||||
<p>The package can be installed via NPM:</p>
|
||||
<p><code>npm install react-add-to-calendar --save</code></p>
|
||||
</div>
|
||||
<div className="wrapper">
|
||||
<ExampleComponents/>
|
||||
</div>
|
||||
|
||||
<a href="https://github.com/jasonsalzman/react-add-to-calendar/">
|
||||
<img className="github-ribbon" src="images/ribbon.png" alt="Fork me on GitHub" />
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
})
|
||||
@@ -1,110 +0,0 @@
|
||||
@import "reset";
|
||||
@import "higlight";
|
||||
@import "breakpoint";
|
||||
@import "hero";
|
||||
@import "examples";
|
||||
|
||||
%container-styling {
|
||||
max-width: 1100px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
background: #f5f5f5;
|
||||
font-family: "Open Sans", sans-serif;
|
||||
color: #555;
|
||||
font-size: 14px;
|
||||
line-height: 21px;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc;
|
||||
margin-left: 40px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
h1 {
|
||||
padding-bottom: .3em;
|
||||
font-size: 2.25em;
|
||||
line-height: 1.2;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding-bottom: .3em;
|
||||
font-size: 1.75em;
|
||||
line-height: 1.225;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 2px 4px;
|
||||
border: 1px solid #ccc;
|
||||
margin: 0;
|
||||
font-size: 85%;
|
||||
background-color: #e8e7e7;
|
||||
border-radius: 3px;
|
||||
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
@extend %container-styling;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.row {
|
||||
@include breakpoint(768px) {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.column {
|
||||
@include breakpoint(768px) {
|
||||
width: 50%;
|
||||
|
||||
&:first-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 13px;
|
||||
border-radius: 4px;
|
||||
box-shadow: inset 0 2px 2px #e9e9e9;
|
||||
border: 1px solid #aeaeae;
|
||||
line-height: 16px;
|
||||
padding: 6px 10px 5px;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
border-color: #aeaeae;
|
||||
box-shadow: inset 0 2px 2px #e9e9e9, 0 0 10px 0 rgba(73, 107, 125, .3);
|
||||
}
|
||||
}
|
||||
-2658
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user