Merge branch 'tailwind' into 'master'

feat: Switch semantic-ui to tailwind

See merge request mythic-insight/legendary!18
This commit is contained in:
Robert Prehn 2020-09-23 20:25:26 +00:00
commit 40c304c451
23406 changed files with 2846 additions and 2845564 deletions

2
.gitignore vendored
View file

@ -26,7 +26,7 @@ legendary-*.tar
npm-debug.log
# The directory NPM downloads your dependencies sources to.
/assets/node_modules/
node_modules
# Since we are building assets from assets/,
# we ignore priv/static. You may want to comment

View file

@ -1,5 +0,0 @@
{
"presets": [
"@babel/preset-env"
]
}

View file

@ -1,31 +0,0 @@
/* This file is for your main application css. */
@import "./phoenix.css";
/* Alerts and form errors */
.alert {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
}
.alert-info {
color: #31708f;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-warning {
color: #8a6d3b;
background-color: #fcf8e3;
border-color: #faebcc;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
.alert p {
margin-bottom: 0;
}
.alert:empty {
display: none;
}

File diff suppressed because one or more lines are too long

View file

@ -1,15 +0,0 @@
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured
// in "webpack.config.js".
//
// Import deps with the dep name or local files with a relative path, for example:
//
// import {Socket} from "phoenix"
// import socket from "./socket"
//
import "phoenix_html"

View file

@ -1,63 +0,0 @@
// NOTE: The contents of this file will only be executed if
// you uncomment its entry in "assets/js/app.js".
// To use Phoenix channels, the first step is to import Socket,
// and connect at the socket path in "lib/web/endpoint.ex".
//
// Pass the token on params as below. Or remove it
// from the params if you are not using authentication.
import {Socket} from "phoenix"
let socket = new Socket("/socket", {params: {token: window.userToken}})
// When you connect, you'll often need to authenticate the client.
// For example, imagine you have an authentication plug, `MyAuth`,
// which authenticates the session and assigns a `:current_user`.
// If the current user exists you can assign the user's token in
// the connection for use in the layout.
//
// In your "lib/web/router.ex":
//
// pipeline :browser do
// ...
// plug MyAuth
// plug :put_user_token
// end
//
// defp put_user_token(conn, _) do
// if current_user = conn.assigns[:current_user] do
// token = Phoenix.Token.sign(conn, "user socket", current_user.id)
// assign(conn, :user_token, token)
// else
// conn
// end
// end
//
// Now you need to pass this token to JavaScript. You can do so
// inside a script tag in "lib/web/templates/layout/app.html.eex":
//
// <script>window.userToken = "<%= assigns[:user_token] %>";</script>
//
// You will need to verify the user token in the "connect/3" function
// in "lib/web/channels/user_socket.ex":
//
// def connect(%{"token" => token}, socket, _connect_info) do
// # max_age: 1209600 is equivalent to two weeks in seconds
// case Phoenix.Token.verify(socket, "user socket", token, max_age: 1209600) do
// {:ok, user_id} ->
// {:ok, assign(socket, :user, user_id)}
// {:error, reason} ->
// :error
// end
// end
//
// Finally, connect to the socket:
socket.connect()
// Now that you are connected, you can join channels with a topic:
let channel = socket.channel("topic:subtopic", {})
channel.join()
.receive("ok", resp => { console.log("Joined successfully", resp) })
.receive("error", resp => { console.log("Unable to join", resp) })
export default socket

File diff suppressed because it is too large Load diff

View file

@ -1,27 +0,0 @@
{
"repository": {},
"description": " ",
"license": "MIT",
"scripts": {
"deploy": "webpack --mode production",
"watch": "webpack --mode development --watch"
},
"dependencies": {
"phoenix": "file:../../../deps/phoenix",
"phoenix_html": "file:../../../deps/phoenix_html"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"babel-loader": "^8.0.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.2",
"sass-loader": "^8.0.2",
"node-sass": "^4.13.1",
"mini-css-extract-plugin": "^0.9.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"terser-webpack-plugin": "^2.3.2",
"webpack": "4.41.5",
"webpack-cli": "^3.3.2"
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View file

@ -1,5 +0,0 @@
# See http://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file
#
# To ban all spiders from the entire site uncomment the next two lines:
# User-agent: *
# Disallow: /

View file

@ -1,51 +0,0 @@
const path = require('path');
const glob = require('glob');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = (env, options) => {
const devMode = options.mode !== 'production';
return {
optimization: {
minimizer: [
new TerserPlugin({ cache: true, parallel: true, sourceMap: devMode }),
new OptimizeCSSAssetsPlugin({})
]
},
entry: {
'app': glob.sync('./vendor/**/*.js').concat(['./js/app.js'])
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, '../priv/static/js'),
publicPath: '/js/'
},
devtool: devMode ? 'source-map' : undefined,
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.[s]?css$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
}
]
},
plugins: [
new MiniCssExtractPlugin({ filename: '../css/app.css' }),
new CopyWebpackPlugin([{ from: 'static/', to: '../' }])
]
}
};

View file

@ -1,7 +1,7 @@
defmodule Admin.Kaffy.EditorExtension do
def stylesheets(_conn) do
[
{:safe, ~s(<link rel="stylesheet" href="/js/css/content-editor.css" />)},
{:safe, ~s(<link rel="stylesheet" href="/css/content-editor.css" />)},
{:safe, ~s(<link rel="stylesheet" href="/css/app.css" />)},
]
end

View file

@ -64,7 +64,8 @@ defmodule Admin.MixProject do
defp aliases do
[
setup: ["deps.get", "cmd npm install --prefix assets"],
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"]
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"],
"npm.install": [],
]
end
end

View file

@ -1,7 +1,7 @@
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
import "../css/app.css"
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured
@ -12,4 +12,4 @@ import "../css/app.scss"
// import {Socket} from "phoenix"
// import socket from "./socket"
//
import "phoenix_html"
import "phoenix_html"

View file

@ -62,7 +62,8 @@ defmodule App.MixProject do
defp aliases do
[
setup: ["deps.get", "cmd npm install --prefix assets"],
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"]
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"],
"npm.install": ["cmd npm install --prefix assets"],
]
end
end

View file

@ -1,19 +1,15 @@
<div class="ui top padded container">
<div class="ui grid">
<div class="row">
<div class="eight wide column">
<h1 class="ui header">Edit <%= schema.human_singular %></h1>
</div>
<div class="eight wide right aligned column">
<span><%%= link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index), class: "ui button" %></span>
</div>
<div class="p-6 mx-auto max-w-2xl">
<div class="flex pb-6">
<div class="w-/12 flex-1 text-4xl">
<h1>Edit <%= schema.human_singular %></h1>
</div>
<div class="centered row">
<div class="center aligned column">
<%%= changeset_error_block(@changeset) %>
<%%= render "form.html", Map.put(assigns, :action, Routes.<%= schema.route_helper %>_path(@conn, :update, @<%= schema.singular %>)) %>
</div>
<div class="w-/12 text-4xl text-right">
<%%= styled_button_link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index)%>
</div>
</div>
<%%= changeset_error_block(@changeset) %>
<div class="bg-white shadow rounded px-4 py-6 bg-gray-300">
<%%= render "form.html", Map.put(assigns, :action, Routes.<%= schema.route_helper %>_path(@conn, :update, @<%= schema.singular %>)) %>
</div>
</div>

View file

@ -1,10 +1,10 @@
<%%= form_for @changeset, @action, [class: "ui large form"], fn f -> %>
<div class="ui stacked left aligned segment">
<%%= form_for @changeset, @action, [], fn f -> %>
<div>
<%= for input <- Mix.Legendary.inputs(schema) do %>
<%= input %>
<% end %>
<div>
<%%= submit "Save", class: "ui primary fluid large submit button" %>
<%%= styled_button "Save" %>
</div>
</div>
<%% end %>

View file

@ -1,46 +1,52 @@
<div class="ui top padded container">
<div class="ui grid">
<div class="row">
<div class="eight wide column">
<h1 class="ui header"><%= schema.human_plural %></h1>
</div>
<div class="eight wide right aligned column">
<span><%%= link "New <%= schema.human_singular %>", to: Routes.<%= schema.route_helper %>_path(@conn, :new), class: "ui primary button" %></span>
</div>
<div class="p-6">
<div class="flex pb-6">
<div class="w-/12 flex-1 text-4xl">
<h1 class="px-4 -mb-2 mt-2"><%= schema.human_plural %></h1>
</div>
<div class="w-/12 text-4xl text-right px-4">
<%%= styled_button_link "New <%= schema.human_singular %>", to: Routes.<%= schema.route_helper %>_path(@conn, :new) %>
</div>
</div>
<table class="ui celled table">
<thead>
<tr>
<%= for {k, _} <- schema.attrs do %> <th><%= Phoenix.Naming.humanize(Atom.to_string(k)) %></th>
<% end %>
<th></th>
</tr>
</thead>
<tbody>
<%%= case @<%= schema.plural %> do %>
<%%= [] -> %>
<tr>
<td colspan="<%= schema.attrs |> Enum.count() %>">
No results.
</td>
</tr>
<%%= _ -> %>
<%%= for <%= schema.singular %> <- @<%= schema.plural %> do %>
<tr>
<%= for {k, _} <- schema.attrs do %> <td><%%= <%= schema.singular %>.<%= k %> %></td>
<% end %>
<td>
<div class="ui list">
<span class="item"><%%= link "Show", to: Routes.<%= schema.route_helper %>_path(@conn, :show, <%= schema.singular %>) %></span>
<span class="item"><%%= link "Edit", to: Routes.<%= schema.route_helper %>_path(@conn, :edit, <%= schema.singular %>) %></span>
<span class="item"><%%= link "Delete", to: Routes.<%= schema.route_helper %>_path(@conn, :delete, <%= schema.singular %>), method: :delete, data: [confirm: "Are you sure?"] %></span>
</div>
</td>
</tr>
<%% end %>
<%% end %>
</tbody>
</table>
<div class="shadow rounded px-1 py-1 bg-white">
<table class="min-w-full leading-normal">
<thead>
<tr>
<%= for {k, _} <- schema.attrs do %> <th class="px-4 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider"><%= Phoenix.Naming.humanize(Atom.to_string(k)) %></th>
<% end %>
<th class="px-4 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider"></th>
</tr>
</thead>
<tbody>
<%%= case @<%= schema.plural %> do %>
<%%= [] -> %>
<tr>
<td class="px-4 py-6 border-b border-gray-200 bg-white text-sm" colspan="<%= (schema.attrs |> Enum.count()) + 1 %>">
No results.
</td>
</tr>
<%%= _ -> %>
<%%= for <%= schema.singular %> <- @<%= schema.plural %> do %>
<tr>
<%= for {k, _} <- schema.attrs do %>
<td class="px-4 py-6 border-b border-gray-200 bg-white text-sm">
<%%= link <%= schema.singular %>.<%= k %>, to: Routes.<%= schema.route_helper %>_path(@conn, :show, <%= schema.singular %>) %>
</td>
<% end %>
<td class="px-4 py-6 border-b border-gray-200 bg-white text-sm">
<label class="relative">
...
<input type="checkbox" class="hidden hidden-options-toggle">
<div class="hidden absolute right-0 rounded bg-white border shadow-lg py-6 w-48">
<%%= link "Edit", to: Routes.<%= schema.route_helper %>_path(@conn, :edit, <%= schema.singular %>), class: "block px-4 py-2 hover:bg-gray-100" %>
<%%= link "Delete", to: Routes.<%= schema.route_helper %>_path(@conn, :delete, <%= schema.singular %>), method: :delete, data: [confirm: "Are you sure?"], class: "text-red-600 block px-4 py-2 hover:bg-gray-100" %>
</div>
</label>
</td>
</tr>
<%% end %>
<%% end %>
</tbody>
</table>
</div>
</div>

View file

@ -1,19 +1,15 @@
<div class="ui top padded container">
<div class="ui grid">
<div class="row">
<div class="eight wide column">
<h1 class="ui header">New <%= schema.human_singular %></h1>
</div>
<div class="eight wide right aligned column">
<span><%%= link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index), class: "ui button" %></span>
</div>
<div class="p-6 mx-auto max-w-2xl">
<div class="flex pb-6">
<div class="w-/12 flex-1 text-4xl">
<h1 class="-mb-2 mt-2"><%= schema.human_singular %></h1>
</div>
<div class="centered row">
<div class="center aligned column">
<%%= changeset_error_block(@changeset) %>
<%%= render "form.html", Map.put(assigns, :action, Routes.<%= schema.route_helper %>_path(@conn, :create)) %>
</div>
<div class="w-/12 text-4xl text-right">
<%%= styled_button_link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index)%>
</div>
</div>
<%%= changeset_error_block(@changeset) %>
<div class="bg-white shadow rounded px-4 py-6 bg-gray-300">
<%%= render "form.html", Map.put(assigns, :action, Routes.<%= schema.route_helper %>_path(@conn, :create)) %>
</div>
</div>

View file

@ -1,26 +1,20 @@
<div class="ui top padded container">
<div class="ui grid">
<div class="row">
<div class="eight wide column">
<h1 class="ui header"><%= schema.human_singular %></h1>
</div>
<div class="eight wide right aligned column">
<%%= link "Edit", to: Routes.<%= schema.route_helper %>_path(@conn, :edit, @<%= schema.singular %>), class: "ui button primary" %>
<span><%%= link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index), class: "ui button" %></span>
</div>
<div class="p-6 mx-auto max-w-2xl">
<div class="flex pb-6">
<div class="w-/12 flex-1 text-4xl">
<h1 class="-mb-2 mt-2"><%= schema.human_singular %></h1>
</div>
<div class="w-/12 text-4xl text-right">
<%%= styled_button_link "Edit", to: Routes.<%= schema.route_helper %>_path(@conn, :edit, @<%= schema.singular %>) %>
<%%= styled_button_link "Back", to: Routes.<%= schema.route_helper %>_path(@conn, :index) %>
</div>
</div>
<div class="ui segment">
<div class="ui list">
<%= for {k, _} <- schema.attrs do %>
<div class="item">
<div class="content">
<strong><%= Phoenix.Naming.humanize(Atom.to_string(k)) %>:</strong>
<%%= @<%= schema.singular %>.<%= k %> %>
</div>
</div>
<% end %>
</div>
<div class="bg-white shadow rounded px-4 py-6 bg-white">
<%= for {k, _} <- schema.attrs do %>
<div>
<strong><%= Phoenix.Naming.humanize(Atom.to_string(k)) %>:</strong>
<%%= @<%= schema.singular %>.<%= k %> %>
</div>
<% end %>
</div>
</div>

View file

@ -1,3 +0,0 @@
{
"lockfileVersion": 1
}

View file

@ -27,7 +27,7 @@ defmodule Auth.User do
user_or_changeset
|> pow_user_id_field_changeset(attrs)
|> Changeset.cast(attrs, [:roles])
|> Changeset.cast(attrs, [:roles, :display_name])
|> pow_extension_changeset(attrs)
end

View file

@ -56,7 +56,8 @@ defmodule Auth.MixProject do
setup: ["deps.get", "ecto.setup"],
"ecto.setup": ["ecto.create", "ecto.migrate", "run priv/repo/seeds.exs"],
"ecto.reset": ["ecto.drop", "ecto.setup"],
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"]
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"],
"npm.install": [],
]
end
end

View file

@ -1,5 +0,0 @@
{
"presets": [
"@babel/preset-env"
]
}

View file

@ -1,31 +0,0 @@
/* This file is for your main application css. */
@import "./phoenix.css";
/* Alerts and form errors */
.alert {
padding: 15px;
margin-bottom: 20px;
border: 1px solid transparent;
border-radius: 4px;
}
.alert-info {
color: #31708f;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-warning {
color: #8a6d3b;
background-color: #fcf8e3;
border-color: #faebcc;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
.alert p {
margin-bottom: 0;
}
.alert:empty {
display: none;
}

File diff suppressed because one or more lines are too long

View file

@ -1,15 +0,0 @@
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured
// in "webpack.config.js".
//
// Import deps with the dep name or local files with a relative path, for example:
//
// import {Socket} from "phoenix"
// import socket from "./socket"
//
import "phoenix_html"

View file

@ -1,63 +0,0 @@
// NOTE: The contents of this file will only be executed if
// you uncomment its entry in "assets/js/app.js".
// To use Phoenix channels, the first step is to import Socket,
// and connect at the socket path in "lib/web/endpoint.ex".
//
// Pass the token on params as below. Or remove it
// from the params if you are not using authentication.
import {Socket} from "phoenix"
let socket = new Socket("/socket", {params: {token: window.userToken}})
// When you connect, you'll often need to authenticate the client.
// For example, imagine you have an authentication plug, `MyAuth`,
// which authenticates the session and assigns a `:current_user`.
// If the current user exists you can assign the user's token in
// the connection for use in the layout.
//
// In your "lib/web/router.ex":
//
// pipeline :browser do
// ...
// plug MyAuth
// plug :put_user_token
// end
//
// defp put_user_token(conn, _) do
// if current_user = conn.assigns[:current_user] do
// token = Phoenix.Token.sign(conn, "user socket", current_user.id)
// assign(conn, :user_token, token)
// else
// conn
// end
// end
//
// Now you need to pass this token to JavaScript. You can do so
// inside a script tag in "lib/web/templates/layout/app.html.eex":
//
// <script>window.userToken = "<%= assigns[:user_token] %>";</script>
//
// You will need to verify the user token in the "connect/3" function
// in "lib/web/channels/user_socket.ex":
//
// def connect(%{"token" => token}, socket, _connect_info) do
// # max_age: 1209600 is equivalent to two weeks in seconds
// case Phoenix.Token.verify(socket, "user socket", token, max_age: 1209600) do
// {:ok, user_id} ->
// {:ok, assign(socket, :user, user_id)}
// {:error, reason} ->
// :error
// end
// end
//
// Finally, connect to the socket:
socket.connect()
// Now that you are connected, you can join channels with a topic:
let channel = socket.channel("topic:subtopic", {})
channel.join()
.receive("ok", resp => { console.log("Joined successfully", resp) })
.receive("error", resp => { console.log("Unable to join", resp) })
export default socket

File diff suppressed because it is too large Load diff

View file

@ -1,27 +0,0 @@
{
"repository": {},
"description": " ",
"license": "MIT",
"scripts": {
"deploy": "webpack --mode production",
"watch": "webpack --mode development --watch"
},
"dependencies": {
"phoenix": "file:../../../deps/phoenix",
"phoenix_html": "file:../../../deps/phoenix_html"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"babel-loader": "^8.0.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.2",
"sass-loader": "^8.0.2",
"node-sass": "^4.13.1",
"mini-css-extract-plugin": "^0.9.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"terser-webpack-plugin": "^2.3.2",
"webpack": "4.41.5",
"webpack-cli": "^3.3.2"
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View file

@ -1,5 +0,0 @@
# See http://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file
#
# To ban all spiders from the entire site uncomment the next two lines:
# User-agent: *
# Disallow: /

View file

@ -1,51 +0,0 @@
const path = require('path');
const glob = require('glob');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = (env, options) => {
const devMode = options.mode !== 'production';
return {
optimization: {
minimizer: [
new TerserPlugin({ cache: true, parallel: true, sourceMap: devMode }),
new OptimizeCSSAssetsPlugin({})
]
},
entry: {
'app': glob.sync('./vendor/**/*.js').concat(['./js/app.js'])
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, '../priv/static/js'),
publicPath: '/js/'
},
devtool: devMode ? 'source-map' : undefined,
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.[s]?css$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
}
]
},
plugins: [
new MiniCssExtractPlugin({ filename: '../css/app.css' }),
new CopyWebpackPlugin([{ from: 'static/', to: '../' }])
]
}
};

View file

@ -1,24 +1,19 @@
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Update My Account
</div>
</h2>
<%= flash_block(@conn) %>
<%= changeset_error_block(@changeset) %>
<%= form_for @changeset, @action, [as: :user, class: "ui large form"], fn f -> %>
<div class="ui stacked left aligned segment">
<%= styled_input f, :current_password, icon: "lock", type: "password" %>
<%= floating_page_wrapper do %>
<%= floating_form "Update My Account", @changeset do %>
<%= form_for @changeset, @action, [as: :user], fn f -> %>
<div>
<%= styled_input f, :current_password, type: "password", autocomplete: "current-password" %>
<%= styled_input f, Pow.Ecto.Schema.user_id_field(@changeset), icon: "user" %>
<%= styled_input f, Pow.Ecto.Schema.user_id_field(@changeset) %>
<%= styled_input f, :password, icon: "lock", label: "New Password", type: "password", class: "right labeled" do %>
<div class="ui label js-passwordRevealer"><i class="eye icon" style="margin: 0;"></i></div>
<%= styled_input f, :password, [label: "New Password", type: "password", autocomplete: "new-password"], nil do %>
<div class="password-revealer js-passwordRevealer flex items-center justify-center text-gray-500 bg-gray-200 hover:bg-gray-300 rounded-r">
<span class="fa fa-eye inline"></span>
</div>
<% end %>
<%= submit "Create My Account", class: "ui fluid large teal submit button" %>
<%= styled_button "Create My Account" %>
</div>
<% end %>
</div>
</div>
<% end %>
<% end %>

View file

@ -1,37 +1,20 @@
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Create My Account
</div>
</h2>
<%= flash_block(@conn) %>
<%= changeset_error_block(@changeset) %>
<%= form_for @changeset, @action, [as: :user, class: "ui large form"], fn f -> %>
<div class="ui stacked left aligned segment">
<div class="field <%= error_class(f, :password) %>">
<%= label f, Pow.Ecto.Schema.user_id_field(@changeset) %>
<div class="ui left icon input">
<i class="user icon"></i>
<%= text_input f, Pow.Ecto.Schema.user_id_field(@changeset), placeholder: "E-mail address" %>
</div>
<%= error_tag f, Pow.Ecto.Schema.user_id_field(@changeset), class: "ui pointing red basic label" %>
<%= floating_page_wrapper do %>
<%= floating_form "Sign Up", @changeset do %>
<%= form_for @changeset, @action, [as: :user], fn f -> %>
<%= styled_input f, Pow.Ecto.Schema.user_id_field(@changeset), placeholder: "E-mail address" %>
<%= styled_input f, :password, [placeholder: "Password", autocomplete: "new-password"], nil do %>
<div class="password-revealer js-passwordRevealer flex items-center justify-center text-gray-500 bg-gray-200 hover:bg-gray-300 rounded-r">
<span class="fa fa-eye inline"></span>
</div>
<div class="field <%= error_class(f, :password) %>">
<%= label f, :password %>
<div class="ui left icon right labeled input">
<i class="lock icon"></i>
<%= password_input f, :password, placeholder: "Password" %>
<div class="ui label js-passwordRevealer"><i class="eye icon" style="margin: 0;"></i></div>
</div>
<%= error_tag f, :password, class: "ui pointing red basic label" %>
</div>
<%= submit "Create My Account", class: "ui fluid large teal submit button" %>
</div>
<% end %>
<% end %>
<div class="ui message">
Already have an account? <span><%= link "Sign in", to: Routes.pow_session_path(@conn, :new) %></span>
<%= styled_button "Create My Account" %>
<% end %>
<% end %>
<div class="flex flex-wrap mt-6">
<div class="w-full relative min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-500 border-0 py-6 px-4">
Already have an account? <span><%= link "Sign in", to: Routes.pow_session_path(@conn, :new), class: "text-blue-100" %></span>
</div>
</div>
</div>
<% end %>

View file

@ -1,41 +1,23 @@
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Log-in To My Account
</div>
</h2>
<%= flash_block(@conn) %>
<%= changeset_error_block(@changeset) %>
<%= form_for @changeset, @action, [as: :user, class: "ui large form"], fn f -> %>
<div class="ui stacked segment">
<div class="field <%= error_class(f, :password) %>">
<div class="ui left icon input">
<i class="user icon"></i>
<%= text_input f, Pow.Ecto.Schema.user_id_field(@changeset), placeholder: "E-mail address" %>
</div>
<%= error_tag f, Pow.Ecto.Schema.user_id_field(@changeset), class: "ui error message" %>
</div>
<div class="field <%= error_class(f, :password) %>">
<div class="ui left icon input">
<i class="lock icon"></i>
<%= password_input f, :password, placeholder: "Password" %>
</div>
<%= error_tag f, :password, class: "ui error message" %>
</div>
<%= hidden_input f, :persistent_session, value: "true" %>
<%= submit "Login", class: "ui fluid large teal submit button" %>
<%= floating_page_wrapper do %>
<%= floating_form "Log In", @changeset do %>
<%= form_for @changeset, @action, [as: :user], fn f -> %>
<%= styled_input f, Pow.Ecto.Schema.user_id_field(@changeset), placeholder: "joe@example.org" %>
<%= styled_input f, :password, type: "password", autocomplete: "current-password" %>
<%= hidden_input f, :persistent_session, value: "true" %>
<div class="text-center mt-6">
<%= styled_button "Sign In" %>
</div>
<% end %>
<div class="ui message">
New to us? <span><%= link "Register", to: Routes.pow_registration_path(@conn, :new) %></span>
<% end %>
<div class="w-full flex flex-wrap mt-6">
<div class="w-full relative min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-500 border-0 py-6 px-4">
New to us? <span><%= link "Register", to: Routes.pow_registration_path(@conn, :new), class: "text-blue-100" %></span>
</div>
<%= if pow_extension_enabled?(PowResetPassword) do %>
<div class="ui message">
Forgot your password? <span><%= link("Reset password", to: Routes.pow_reset_password_reset_password_path(@conn, :new)) %></span>
<div class="w-full relative min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-500 border-0 py-6 px-4">
Forgot your password? <span><%= link("Reset password", to: Routes.pow_reset_password_reset_password_path(@conn, :new), class: "text-blue-100") %></span>
</div>
<% end %>
</div>
</div>
<% end %>

View file

@ -1,19 +1,12 @@
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Reset Password
</div>
</h2>
<%= flash_block(@conn) %>
<%= changeset_error_block(@changeset) %>
<%= form_for @changeset, @action, [as: :user, class: "ui large form"], fn f -> %>
<div class="ui stacked left aligned segment">
<%= styled_input f, :password, [icon: "lock", type: "password", class: "right labeled"] do %>
<div class="ui label js-passwordRevealer"><i class="eye icon" style="margin: 0;"></i></div>
<% end %>
</div>
<%= submit "Reset My Password", class: "ui fluid large teal submit button" %>
<%= floating_page_wrapper do %>
<%= floating_form "Reset Password", @changeset do %>
<%= form_for @changeset, @action, [as: :user], fn f -> %>
<%= styled_input f, :password, [label: "New Password", type: "password", autocomplete: "new-password"], nil do %>
<div class="password-revealer js-passwordRevealer flex items-center justify-center text-gray-500 bg-gray-200 hover:bg-gray-300 rounded-r">
<span class="fa fa-eye inline"></span>
</div>
<% end %>
<%= styled_button "Reset My Password" %>
<% end %>
</div>
</div>
<% end %>
<% end %>

View file

@ -1,25 +1,16 @@
<div class="ui middle aligned center aligned grid">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Reset Password
</div>
</h2>
<%= flash_block(@conn) %>
<%= changeset_error_block(@changeset) %>
<%= form_for @changeset, @action, [as: :user, class: "ui large form"], fn f -> %>
<div class="ui stacked left aligned segment">
<%= styled_input f, :email, [placeholder: "joe@example.org", icon: "user"] %>
</div>
<%= submit "Reset My Password", class: "ui fluid large teal submit button" %>
<%= floating_page_wrapper do %>
<%= floating_form "Reset Password", @changeset do %>
<%= form_for @changeset, @action, [as: :user], fn f -> %>
<%= styled_input f, :email, [placeholder: "joe@example.org"] %>
<%= styled_button "Reset My Password" %>
<% end %>
<% end %>
<div class="ui message">
Remembered your password? <span><%= link "Sign in", to: Routes.pow_session_path(@conn, :new) %></span>
</div>
<div class="ui message">
New to us? <span><%= link "Register", to: Routes.pow_registration_path(@conn, :new) %></span>
</div>
<div class="w-full relative min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-500 border-0 py-6 px-4">
Remembered your password? <span><%= link "Sign in", to: Routes.pow_session_path(@conn, :new), class: "text-blue-100" %></span>
</div>
</div>
<div class="w-full relative min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-500 border-0 py-6 px-4">
New to us? <span><%= link "Register", to: Routes.pow_registration_path(@conn, :new), class: "text-blue-100" %></span>
</div>
<% end %>

View file

@ -64,6 +64,7 @@ defmodule AuthWeb.MixProject do
setup: ["deps.get", "cmd npm install --prefix assets"],
test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"],
"ecto.migrate": [],
"npm.install": [],
]
end
end

View file

@ -1,5 +0,0 @@
{
"presets": [
"@babel/preset-env"
]
}

View file

@ -1,15 +0,0 @@
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured
// in "webpack.config.js".
//
// Import deps with the dep name or local files with a relative path, for example:
//
// import {Socket} from "phoenix"
// import socket from "./socket"
//
import "phoenix_html"

View file

@ -1,63 +0,0 @@
// NOTE: The contents of this file will only be executed if
// you uncomment its entry in "assets/js/app.js".
// To use Phoenix channels, the first step is to import Socket,
// and connect at the socket path in "lib/web/endpoint.ex".
//
// Pass the token on params as below. Or remove it
// from the params if you are not using authentication.
import {Socket} from "phoenix"
let socket = new Socket("/socket", {params: {token: window.userToken}})
// When you connect, you'll often need to authenticate the client.
// For example, imagine you have an authentication plug, `MyAuth`,
// which authenticates the session and assigns a `:current_user`.
// If the current user exists you can assign the user's token in
// the connection for use in the layout.
//
// In your "lib/web/router.ex":
//
// pipeline :browser do
// ...
// plug MyAuth
// plug :put_user_token
// end
//
// defp put_user_token(conn, _) do
// if current_user = conn.assigns[:current_user] do
// token = Phoenix.Token.sign(conn, "user socket", current_user.id)
// assign(conn, :user_token, token)
// else
// conn
// end
// end
//
// Now you need to pass this token to JavaScript. You can do so
// inside a script tag in "lib/web/templates/layout/app.html.eex":
//
// <script>window.userToken = "<%= assigns[:user_token] %>";</script>
//
// You will need to verify the user token in the "connect/3" function
// in "lib/web/channels/user_socket.ex":
//
// def connect(%{"token" => token}, socket, _connect_info) do
// # max_age: 1209600 is equivalent to two weeks in seconds
// case Phoenix.Token.verify(socket, "user socket", token, max_age: 1209600) do
// {:ok, user_id} ->
// {:ok, assign(socket, :user, user_id)}
// {:error, reason} ->
// :error
// end
// end
//
// Finally, connect to the socket:
socket.connect()
// Now that you are connected, you can join channels with a topic:
let channel = socket.channel("topic:subtopic", {})
channel.join()
.receive("ok", resp => { console.log("Joined successfully", resp) })
.receive("error", resp => { console.log("Unable to join", resp) })
export default socket

File diff suppressed because it is too large Load diff

View file

@ -1,27 +0,0 @@
{
"repository": {},
"description": " ",
"license": "MIT",
"scripts": {
"deploy": "webpack --mode production",
"watch": "webpack --mode development --watch"
},
"dependencies": {
"phoenix": "file:../../../deps/phoenix",
"phoenix_html": "file:../../../deps/phoenix_html"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"babel-loader": "^8.0.0",
"copy-webpack-plugin": "^5.1.1",
"css-loader": "^3.4.2",
"sass-loader": "^8.0.2",
"node-sass": "^4.13.1",
"mini-css-extract-plugin": "^0.9.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"terser-webpack-plugin": "^2.3.2",
"webpack": "4.41.5",
"webpack-cli": "^3.3.2"
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View file

@ -1,5 +0,0 @@
# See http://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file
#
# To ban all spiders from the entire site uncomment the next two lines:
# User-agent: *
# Disallow: /

View file

@ -1,51 +0,0 @@
const path = require('path');
const glob = require('glob');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = (env, options) => {
const devMode = options.mode !== 'production';
return {
optimization: {
minimizer: [
new TerserPlugin({ cache: true, parallel: true, sourceMap: devMode }),
new OptimizeCSSAssetsPlugin({})
]
},
entry: {
'app': glob.sync('./vendor/**/*.js').concat(['./js/app.js'])
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, '../priv/static/js'),
publicPath: '/js/'
},
devtool: devMode ? 'source-map' : undefined,
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.[s]?css$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
}
]
},
plugins: [
new MiniCssExtractPlugin({ filename: '../css/app.css' }),
new CopyWebpackPlugin([{ from: 'static/', to: '../' }])
]
}
};

View file

@ -53,7 +53,6 @@ defmodule Content.PostAdmin do
sticky: nil,
comment_status: %{choices: [{"open", :open}, {"closed", :closed}]},
ping_status: %{choices: [{"open", :open}, {"closed", :closed}]},
password: nil,
menu_order: nil,
]
end

View file

@ -1,101 +0,0 @@
defmodule Content.ShortcodeParser do
use Neotomex.ExGrammar
@root true
define :document, "(comment / shortcode / notcode)*" do
tail ->
tail |> Enum.join
end
define :notcode, "not_open_bracket+" do
content ->
content |> Enum.join
end
define :comment, "<open_bracket> <open_bracket> ([^\\]]+ close_bracket?)+ <close_bracket>" do
[inner] ->
inner
|> Enum.map(fn [chars, nil] -> "#{chars |> Enum.join}]" end)
|> Enum.join
|> (&("[#{&1}")).()
end
define :shortcode, "<open_bracket> <spaces?> name <spaces?> attribute* <close_bracket> <!'('> (notcode? <open_bracket> <'/'> <spaces?> name <spaces?> <close_bracket>)?" do
[name, attributes, nil] ->
Content.Shortcodes.dispatch(name, attributes)
[name, attributes, [content, closing_name]] when closing_name == name ->
Content.Shortcodes.dispatch(name, attributes, content || "")
end
define :attribute, "name <spaces?>"
define :name, "(namechar+)", do: (chars -> Enum.join(chars))
define :namechar, "[A-Za-z0-9] / dash / underscore"
define :dash, "<'-'>"
define :underscore, "<'_'>"
define :open_bracket, "<'['>", do: ["["]
define :not_open_bracket, "[^\\[]"
define :close_bracket, "<']'>", do: ["]"]
define :close_comment, "close_bracket close_bracket"
define :spaces, "[\s\\r\\n]*"
@_neotomex_definitions Map.put(@_neotomex_definitions,
:not_open_bracket,
{{:terminal, ~r/^[^[]/u}, nil})
end
defmodule Content.Shortcodes do
@moduledoc """
For handling wordpress style shortcodes in strings.
"""
def expand_shortcodes(frag) do
{:ok, tree} = Floki.parse_fragment(frag)
case tree do
[text] when is_binary(text) ->
{:ok, result} = processed_text(text) |> Floki.parse_fragment
result
_ ->
tree
|> Floki.traverse_and_update(fn
tag ->
tag |> transform_text_nodes
end)
end
|> Floki.raw_html(encode: false)
end
defp transform_text_nodes({tag_name, attrs, children}) do
new_children =
children
|> Enum.map(fn
text when is_binary(text) ->
{:ok, [result]} = processed_text(text) |> Floki.parse_fragment
result
other -> other
end)
{tag_name, attrs, new_children}
end
defp transform_text_nodes(comment = {:comment, _}) do
comment
end
defp processed_text(text) do
text =
text
|> String.replace("\r", "")
case Content.ShortcodeParser.parse(text) do
{:ok, result, remainder} ->
[result, remainder] |> Enum.join
{:ok, result} ->
result
end
end
def dispatch(tag, _attrs), do: String.upcase(String.reverse(tag))
def dispatch(_tag, _attrs, content) do
String.upcase(String.reverse(content))
end
end

View file

@ -42,8 +42,7 @@ defmodule Content do
def process_content(text) do
text
|> Content.Shortcodes.expand_shortcodes()
|> Earmark.as_html!()
|> Earmark.as_html!(encode: false)
end
# Include shared imports and aliases for views

View file

@ -1,22 +1,20 @@
<div class="ui feed">
<div>
<%= Enum.map(Content.Comments.children(@parent_id, @post.comments), fn comment -> %>
<div class="event">
<div class="label">
<img src="<%= comment.author_email |> gravatar_url_for_email %>" />
</div>
<div class="content">
<div class="summary">
<span class="user">
<div class="rounded shadow bg-gray-200 px-4 py-6 my-6">
<div class="flex pb-6 items-center">
<img class="w-10 h-10 rounded-full mr-2" src="<%= comment.author_email |> gravatar_url_for_email %>" />
<div class="flex-1 px-2">
<p class="text-base font-bold text-base md:text-xl leading-none mb-2">
<%= comment.author || "Anonymous" %>
</span>
<div class="date">
</p>
<p class="text-gray-600 text-xs md:text-base date">
<%= comment.date |> Timex.format!("%F", :strftime) %>
</div>
</div>
<div class="extra text">
<%= sanitize comment.content |> auto_paragraph_tags |> elem(1) |> IO.iodata_to_binary() %>
</p>
</div>
</div>
<div>
<%= sanitize comment.content |> auto_paragraph_tags |> elem(1) |> IO.iodata_to_binary() %>
</div>
</div>
<% end) %>
</div>

View file

@ -1,84 +1,52 @@
<%= for post <- @posts do %>
<article class="ui text container <%= post_class(post) %> h-entry">
<div class="ui main padded text container">
<h1 class="ui header p-name">
<%= link to: Routes.posts_path(@conn, :show, post), class: "u-url" do %>
<%= raw post.title %>
<% end %>
</h1>
<%= post_topmatter(@conn, post) %>
</div>
<div class="Article-content <%= if post.format, do: post.format.slug %> e-content">
<%= if authenticated_for_post?(@conn, post) do %>
<%= render "thumb.html", post: post, thumbs: @thumbs %>
<div class="Article-content-words" style="padding-bottom: 4em; padding-top: 4em;">
<%= raw post |> Content.Post.content_page(1) |> Content.Post.before_more |> process_content |> raw %>
<%= if post.content =~ "<!--more-->" do %>
<p>
<%= link "Keep Reading", to: Routes.posts_path(@conn, :show, post) %>
</p>
<% end %>
<%= render "pagination.html", conn: @conn, post: post %>
</div>
<% else %>
<%= render "password_form.html", post: post, conn: @conn %>
<article class="max-w-xl mx-auto <%= post_class(post) %> h-entry py-12">
<h1 class="text-4xl font-bold">
<%= link to: Routes.posts_path(@conn, :show, post), class: "u-url" do %>
<%= raw post.title %>
<% end %>
</div>
<div class="ui grid">
<div class="ui center aligned one column row CategoryBlock" style="padding-top: 2rem;">
<div class="ui column">
<%= case post.categories || [] do %>
<% [] -> %>
<%= "" %>
<% categories -> %>
<%= for term <- categories do %>
<div class="ui label">
<%= link term.name, to: Routes.category_path(@conn, :index_posts, term.slug), class: "p-category" %>
</div>
<% end %>
<% end %>
</div>
</h1>
<%= post_topmatter(@conn, post) %>
<div class="Article-content <%= if post.format, do: post.format.slug %> e-content">
<%= render "thumb.html", post: post, thumbs: @thumbs %>
<div class="Article-content-words">
<%= raw post |> Content.Post.content_page(1) |> Content.Post.before_more |> process_content |> () |> raw %>
<%= if post.content =~ "<!--more-->" do %>
<p>
<%= link "Keep Reading", to: Routes.posts_path(@conn, :show, post) %>
</p>
<% end %>
<%= render "pagination.html", conn: @conn, post: post %>
</div>
</div>
<%= case post.categories || [] do %>
<% [] -> %>
<%= "" %>
<% categories -> %>
<div class="flex pt-6">
<h3 class="text-xl mr-4">Categories</h3>
<%= for term <- categories do %>
<%= link term.name, to: Routes.category_path(@conn, :index_posts, term.slug), class: "rounded-full bg-gray-300 px-4 py-1 mr-2" %>
<% end %>
</div>
<% end %>
</article>
<% end %>
<nav class="ui text container paginator">
<div class="ui grid">
<div class="ui center aligned one column row">
<div class="column">
<h3 class="ui header">
Pages
</h3>
<div class="ui buttons">
<%= if @page > 1 do %>
<%= link 1, to: paginated_posts_path(@conn, @category, 1), class: "ui button" %>
<% end %>
<%= if @page > 3 do %>
<span class="paginator-page ui button disabled">...</span>
<% end %>
<%= if @page > 2 do %>
<%= link @page - 1, to: paginated_posts_path(@conn, @category, @page - 1), class: "ui button" %>
<% end %>
<span class="paginator-page ui button disabled"><%= @page %></span>
<%= if @page + 1 < @last_page do %>
<%= link @page + 1, to: paginated_posts_path(@conn, @category, @page + 1), class: "ui button" %>
<% end %>
<%= if @page + 2 < @last_page do %>
<span class="paginator-page ui button disabled">...</span>
<% end %>
<%= if @page < @last_page do %>
<%= link @last_page, to: paginated_posts_path(@conn, @category, @last_page), class: "ui button" %>
<% end %>
</div>
</div>
</div>
<nav class="max-w-xl mx-auto flex justify-center">
<div class="flex shadow rounded">
<%= paginator(1..@last_page, @page, fn first..last, page ->
link page,
to: paginated_posts_path(@conn, @category, page),
style: "min-width: 3.5rem",
class: "#{if page == @page, do: "font-bold"} text-center flex-1 border bg-gray-100 hover:bg-gray-300 text-gray-500 p-4 #{group_rounding_class(first..last, page)}"
end)
%>
</div>
</nav>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/highlight.min.js"></script>
<script charset="UTF-8"
src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/languages/elixir.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

View file

@ -1,11 +0,0 @@
<%= form_for @conn, "/wp-login.php?action=postpass", [class: "post-password-form"], fn f -> %>
<p>This content is password protected. To view it please enter your password below:</p>
<p>
<%= label f, :post_password do %>
Password: <input name="post_password" id="pwbox-131" type="password" size="20">
<% end %>
</p>
<p class="form-group">
<input type="submit" name="Submit" value="Enter">
</p>
<% end %>

View file

@ -1,35 +1,13 @@
<div class="ui middle aligned grid" style="padding-top: 2em;">
<div class="column">
<h2 class="ui teal image header">
<div class="content">
Leave My Comment
</div>
</h2>
<%= changeset_error_block(@comment_changeset) %>
<div class="ui stacked left aligned segment">
<%= form_for @comment_changeset, Routes.comment_path(@conn, :create), [class: "ui form"], fn f -> %>
<%= hidden_input f, :parent %>
<%= hidden_input f, :post_id %>
<%= label f, :author do %>
Your Name
<%= text_input f, :author %>
<% end %>
<%= label f, :author_email do %>
Your Email
<%= email_input f, :author_email %>
<% end %>
<%= label f, :author_url do %>
Your Website
<%= text_input f, :author_url %>
<% end %>
<%= label f, :content do %>
Comment
<%= textarea f, :content %>
<% end %>
<div class="form-group">
<%= submit "Leave My Comment", class: "ui fluid large teal submit button" %>
</div>
<% end %>
</div>
</div>
<div class="mt-12">
<%= floating_form "Leave My Comment", @comment_changeset do %>
<%= form_for @comment_changeset, Routes.comment_path(@conn, :create), fn f -> %>
<%= hidden_input f, :parent %>
<%= hidden_input f, :post_id %>
<%= styled_input f, :author, label: "Your Name" %>
<%= styled_input f, :author_email, label: "Your Email" %>
<%= styled_input f, :author_url, label: "Your Website" %>
<%= styled_input f, :content, label: "Comment", input_helper: :textarea %>
<%= styled_button "Leave My Comment" %>
<% end %>
<% end %>
</div>

View file

@ -1,41 +1,46 @@
<article class="ui <%= post_class(@post) %> h-entry text container">
<div class="ui main padded text container">
<h1 class="ui header p-name">
<article class="max-w-xl mx-auto <%= post_class(@post) %> h-entry py-12">
<div>
<h1 class="text-4xl font-bold">
<%= link to: Routes.posts_path(@conn, :show, @post), class: "u-url" do %>
<%= raw @post.title %>
<% end %>
</h1>
<%= post_topmatter(@conn, @post) %>
</div>
<div class="ui text container <%= if @post.format, do: @post.format.slug %> e-content" style="padding-bottom: 4em; padding-top: 4em;">
<div class="<%= if @post.format, do: @post.format.slug %> e-content py-12 Article-content">
<%= render "thumb.html", post: @post, thumbs: @thumbs %>
<%= @post |> Content.Post.content_page(@page) |> process_content |> raw %>
<div class="ui grid">
<div class="ui center aligned one column row CategoryBlock" style="padding-top: 2rem;">
<div class="ui column">
<%= case @post.categories || [] do %>
<% [] -> %>
<%= "" %>
<% categories -> %>
<%= for term <- categories do %>
<div class="ui label">
<%= link term.name, to: Routes.category_path(@conn, :index_posts, term.slug), class: "p-category" %>
</div>
<% end %>
<%= case @post.categories || [] do %>
<% [] -> %>
<%= "" %>
<% categories -> %>
<div class="flex pt-6">
<h3 class="text-xl font-bold mr-4">Categories</h3>
<%= for term <- categories do %>
<%= link term.name, to: Routes.category_path(@conn, :index_posts, term.slug), class: "rounded-full bg-gray-300 px-4 py-1 mr-2" %>
<% end %>
</div>
</div>
</div>
<% end %>
</div>
<%= render "pagination.html", conn: @conn, post: @post, current_page: @page %>
<%= if @post.comment_status == "open" do %>
<h3>Comments</h3>
<%= render "comments.html", post: @post, parent_id: 0, conn: @conn %>
<%=
render "reply_form.html",
comment_changeset: comment_changeset_for_post(@post),
post: @post,
conn: @conn
%>
<% end %>
</article>
<%= if @post.comment_status == "open" do %>
<div class="w-full bg-gray-800 py-12">
<div class="max-w-xl mx-auto">
<h3 class="text-3xl text-white">Comments</h3>
<%= render "comments.html", post: @post, parent_id: 0, conn: @conn %>
<%=
render "reply_form.html",
comment_changeset: comment_changeset_for_post(@post),
post: @post,
conn: @conn
%>
</div>
</div>
<% end %>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/highlight.min.js"></script>
<script charset="UTF-8"
src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.2/languages/elixir.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

View file

@ -1,180 +1,170 @@
<style type="text/css">
.hidden.menu {
display: none;
}
.heroic {
min-height: 700px;
padding: 1em 0em;
}
.masthead .logo.item img {
margin-right: 1em;
}
.masthead .ui.menu .ui.button {
margin-left: 0.5em;
}
.masthead h1.ui.header {
margin-top: 3em;
margin-bottom: 0em;
font-size: 4em;
font-weight: normal;
}
.masthead h2 {
font-size: 1.7em;
font-weight: normal;
}
.ui.vertical.stripe {
padding: 8em 0em;
}
.ui.vertical.stripe h3 {
font-size: 2em;
}
.ui.vertical.stripe .button + h3,
.ui.vertical.stripe p + h3 {
margin-top: 3em;
}
.ui.vertical.stripe .floated.image {
clear: both;
}
.ui.vertical.stripe p {
font-size: 1.33em;
}
.ui.vertical.stripe .horizontal.divider {
margin: 3em 0em;
}
.quote.stripe.segment {
padding: 0em;
}
.quote.stripe.segment .grid .column {
padding-top: 5em;
padding-bottom: 5em;
}
.footer.segment {
padding: 5em 0em;
}
.secondary.pointing.menu .toc.item {
display: none;
}
@media only screen and (max-width: 700px) {
.ui.fixed.menu {
display: none !important;
}
.secondary.pointing.menu .item,
.secondary.pointing.menu .menu {
display: none;
}
.secondary.pointing.menu .toc.item {
display: block;
}
.masthead.segment {
min-height: 350px;
}
.masthead h1.ui.header {
font-size: 2em;
margin-top: 1.5em;
}
.masthead h2 {
margin-top: 0.5em;
font-size: 1.5em;
}
}
</style>
<div class="pusher">
<div class="ui inverted vertical heroic masthead center aligned segment">
<div class="ui text container">
<h1 class="ui inverted header">
Imagine-a-Company
</h1>
<h2>Do whatever you want when you want to.</h2>
<div class="ui huge primary button">Get Started <i class="right arrow icon"></i></div>
<main>
<div
class="relative pt-16 flex content-center items-center justify-center"
style="min-height: 75vh;"
>
<div
class="absolute top-0 w-full h-full bg-center bg-cover bg-gray-700"
>
</div>
</div>
</div>
<div class="ui vertical stripe segment">
<div class="ui middle aligned stackable grid container">
<div class="row">
<div class="eight wide column">
<h3 class="ui header">We Help Companies and Companions</h3>
<p>We can give your company superpowers to do things that they never thought possible. Let us delight your customers and empower your needs...through pure data analytics.</p>
<h3 class="ui header">We Make Bananas That Can Dance</h3>
<p>Yes that's right, you thought it was the stuff of dreams, but even bananas can be bioengineered.</p>
</div>
<div class="six wide right floated column">
<img src="/images/wireframe/white-image.png" class="ui large bordered rounded image">
</div>
</div>
<div class="row">
<div class="center aligned column">
<a class="ui huge button">Check Them Out</a>
</div>
</div>
</div>
</div>
<div class="ui vertical stripe quote segment">
<div class="ui equal width stackable internally celled grid">
<div class="center aligned row">
<div class="column">
<h3>"What a Company"</h3>
<p>That is what they all say about us</p>
</div>
<div class="column">
<h3>"I shouldn't have gone with their competitor."</h3>
<p>
<img src="/images/avatar/nan.jpg" class="ui avatar image"> <b>Nan</b> Chief Fun Officer Acme Toys
</p>
</div>
</div>
</div>
</div>
<div class="ui vertical stripe segment">
<div class="ui text container">
<h3 class="ui header">Breaking The Grid, Grabs Your Attention</h3>
<p>Instead of focusing on content creation and hard work, we have learned how to master the art of doing nothing by providing massive amounts of whitespace and generic content that can seem massive, monolithic and worth your attention.</p>
<a class="ui large button">Read More</a>
<h4 class="ui horizontal header divider">
<a href="#">Case Studies</a>
</h4>
<h3 class="ui header">Did We Tell You About Our Bananas?</h3>
<p>Yes I know you probably disregarded the earlier boasts as non-sequitur filler content, but its really true. It took years of gene splicing and combinatory DNA research, but our bananas can really dance.</p>
<a class="ui large button">I'm Still Quite Interested</a>
</div>
</div>
<div class="ui inverted vertical footer segment">
<div class="ui container">
<div class="ui stackable inverted divided equal height stackable grid">
<div class="three wide column">
<h4 class="ui inverted header">About</h4>
<div class="ui inverted link list">
<a href="#" class="item">Sitemap</a>
<a href="#" class="item">Contact Us</a>
<a href="#" class="item">Religious Ceremonies</a>
<a href="#" class="item">Gazebo Plans</a>
<div class="relative mx-auto">
<div class="items-center flex flex-wrap">
<div class="w-full lg:w-8/12 px-4 ml-auto mr-auto text-center">
<div>
<h1 class="text-white font-semibold text-4xl">
The Stuff of Legend.
</h1>
<p class="mt-6 text-lg text-gray-100">
Legendary makes it easy to quickly build Phoenix applications with all the bells and whistles.
</p>
</div>
</div>
<div class="w-full lg:w-8/12 px-4 ml-auto mr-auto text-center my-12">
<%= styled_button_link "Log In", to: AuthWeb.Router.Helpers.pow_session_path(%URI{path: "/auth"}, :new) %>
<%= styled_button_link "Sign Up", to: AuthWeb.Router.Helpers.pow_registration_path(%URI{path: "/auth"}, :new) %>
</div>
</div>
</div>
<div class="three wide column">
<h4 class="ui inverted header">Services</h4>
<div class="ui inverted link list">
<a href="#" class="item">Banana Pre-Order</a>
<a href="#" class="item">DNA FAQ</a>
<a href="#" class="item">How To Access</a>
<a href="#" class="item">Favorite X-Men</a>
</div>
<section class="pb-20 bg-gray-300 -mt-24">
<div class="container mx-auto px-4">
<div class="flex flex-wrap">
<div class="w-full md:w-4/12 px-4 text-center">
<div
class="relative flex flex-col min-w-0 break-words bg-white w-full h-full mb-6 shadow-lg rounded-lg"
>
<div class="px-4 py-6 flex-auto">
<div
class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-6 shadow-lg rounded-full bg-red-400"
>
<i class="fa fa-battery-full"></i>
</div>
<h6 class="text-xl font-semibold">Batteries Included</h6>
<p class="mt-2 mb-6 text-gray-600">
We include authentication, content management, administration, Tailwind styles,
and fluid email templates so that you can build your app as quickly as possible.
</p>
</div>
</div>
</div>
<div class="w-full md:w-4/12 px-4 text-center">
<div
class="relative flex flex-col min-w-0 break-words bg-white w-full h-full mb-6 shadow-lg rounded-lg"
>
<div class="px-4 py-6 flex-auto">
<div
class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-6 shadow-lg rounded-full bg-blue-400"
>
<i class="fas fa-chart-line"></i>
</div>
<h6 class="text-xl font-semibold">Hyper-scalable</h6>
<p class="mt-2 mb-6 text-gray-600">
Legendary is built on top of Phoenix and Elixir, so it can handle millions of connections without a problem.
</p>
</div>
</div>
</div>
<div class="w-full md:w-4/12 px-4 text-center">
<div
class="relative flex flex-col min-w-0 break-words bg-white w-full h-full mb-6 shadow-lg rounded-lg"
>
<div class="px-4 py-6 flex-auto">
<div
class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-5 shadow-lg rounded-full bg-green-400"
>
<i class="fas fa-toolbox"></i>
</div>
<h6 class="text-xl font-semibold">Flexible Toolbox</h6>
<p class="mt-2 mb-6 text-gray-600">
We used our years of experience building Phoenix applications at scale to design Legendary with everything you need.
But we stay out of your way while you create your application.
</p>
</div>
</div>
</div>
</div>
<div class="flex flex-wrap items-center mt-32">
<h2 class="w-full text-3xl text-center">
Features
</h2>
<div class="w-full border-gray-400 border-t-2 border-b-2 py-12 px-4 mt-12 flex">
<div class="lg:w-1/2 mr-12">
<h1 class="text-2xl">Authentication</h1>
<p class="text-xl mt-6">
Look, you don't want to build yet another auth system. You want to build an application. Authentication
is a solved problem. With Legendary you don't need to reinvent the wheel.
</p>
</div>
<div class="lg:w-1/2">
<img src="/images/auth.svg" />
</div>
</div>
<div class="w-full border-gray-400 border-b-2 py-12 px-4 flex">
<div class="lg:w-1/2">
<img src="/images/content.svg" />
</div>
<div class="lg:w-1/2 ml-12">
<h1 class="text-2xl">Content Management</h1>
<p class="text-xl mt-6">
Legendary comes with a simple content management system for building custom pages and blog posts. Don't
get stuck building simple content pages when your development talent is better spent elsewhere.
</div>
</div>
<div class="w-full border-gray-400 border-b-2 py-12 px-4 flex">
<div class="lg:w-1/2 mr-12">
<h1 class="text-2xl">Admin Dashboard</h1>
<p class="text-xl mt-6">
There are plenty of tasks that don't require custom code. Legendary integrates the Kaffy admin dashboard
so that you can focus on what is unique to your application instead of churning out CRUD or editing database
rows by hand.
</p>
</div>
<div class="lg:w-1/2">
<img src="/images/dashboard.svg" />
</div>
</div>
<div class="w-full border-gray-400 border-b-2 py-12 px-4 flex">
<div class="lg:w-1/2">
<img src="/images/tailwind.svg" />
</div>
<div class="lg:w-1/2 ml-12">
<h1 class="text-2xl">Tailwind CSS</h1>
<p class="text-xl mt-6">
Tailwind is a rad CSS framework that gives you the building blocks you need to implement
any design, without fighting a super-opinionated CSS framework.
</p>
</div>
</div>
<div class="w-full border-gray-400 py-12 px-4 pb-24 flex">
<div class="lg:w-1/2">
<h1 class="text-2xl">Battle-tested Fluid Email Templates</h1>
<p class="text-xl mt-6">
HTML email is hard. But it's also a solved problem. We include an HTML email template and toolkit that has been
tested across all the major email clients from mobile to desktop. You probably didn't get into this to code yet
another email template. So don't. Use ours.
</p>
</div>
<div class="lg:w-1/2">
<img src="/images/email.svg" />
</div>
</div>
</div>
</div>
<div class="seven wide column">
<h4 class="ui inverted header">Footer Header</h4>
<p>Extra space for a call to action inside the footer that could help re-engage users.</p>
</section>
<section class="bg-gray-100 py-12 pb-32">
<div class="relative mx-auto">
<div class="items-center flex flex-wrap">
<div class="w-full lg:w-8/12 px-4 ml-auto mr-auto text-center">
<h1 class="text-purple-600 font-semibold text-4xl">
What are you waiting for?
</h1>
</div>
<div class="w-full lg:w-8/12 px-4 ml-auto mr-auto text-center my-12">
<%= styled_button_link "Log In", to: AuthWeb.Router.Helpers.pow_session_path(%URI{path: "/auth"}, :new) %>
<%= styled_button_link "Sign Up", to: AuthWeb.Router.Helpers.pow_registration_path(%URI{path: "/auth"}, :new) %>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>

View file

@ -1,28 +0,0 @@
<style>
.ui.container > h2.dividing.header {
font-size: 2em;
font-weight: normal;
margin: 4em 0em 3em;
}
</style>
<div class="ui container">
<h1>Theming Examples</h1>
<h2 class="ui dividing header">Site</h2>
<%= render "static_pages/theming/_site.html", conn: @conn %>
<h2 class="ui dividing header">Menu</h2>
<%= render "static_pages/theming/_menu.html", conn: @conn %>
<h2 class="ui dividing header">Buttons</h2>
<%= render "static_pages/theming/_buttons.html", conn: @conn %>
<h2 class="ui dividing header">Table</h2>
<%= render "static_pages/theming/_tables.html", conn: @conn %>
<h2 class="ui dividing header">Input</h2>
<%= render "static_pages/theming/_input.html", conn: @conn %>
<h2 class="ui dividing header">Card</h2>
<%= render "static_pages/theming/_card.html", conn: @conn %>
</div>

View file

@ -1,160 +0,0 @@
<div class="ui container">
<div class="ui stackable equal width grid">
<div class="column">
<button class="ui button">Default</button>
<button class="ui primary button">Primary</button>
<button class="ui secondary button">Secondary</button>
<button class="ui basic button">Basic</button>
<button class="ui compact button">
Compact
</button>
<div class="ui divider"></div>
<button class="ui icon button">
<i class="heart icon"></i>
</button>
<button class="ui labeled icon button">
<i class="heart icon"></i>
Labeled
</button>
<button class="ui right labeled icon button">
<i class="heart icon"></i>
Labeled
</button>
<div class="ui divider"></div>
<div class="ui buttons">
<button class="ui button">Combo</button>
<div class="ui floating dropdown icon button">
<i class="dropdown icon"></i>
<div class="menu">
<div class="item">Choice 1</div>
<div class="item">Choice 2</div>
<div class="item">Choice 3</div>
</div>
</div>
</div>
<div class="ui floating search dropdown button">
<span class="text">Search Dropdown</span>
<div class="menu">
<div class="item">Arabic</div>
<div class="item">Chinese</div>
<div class="item">Danish</div>
<div class="item">Dutch</div>
<div class="item">English</div>
<div class="item">French</div>
<div class="item">German</div>
<div class="item">Greek</div>
<div class="item">Hungarian</div>
<div class="item">Italian</div>
<div class="item">Japanese</div>
<div class="item">Korean</div>
<div class="item">Lithuanian</div>
<div class="item">Persian</div>
<div class="item">Polish</div>
<div class="item">Portuguese</div>
<div class="item">Russian</div>
<div class="item">Spanish</div>
<div class="item">Swedish</div>
<div class="item">Turkish</div>
<div class="item">Vietnamese</div>
</div>
</div>
<div class="ui divider"></div>
<div class="ui animated button" tabindex="0">
<div class="visible content">Horizontal</div>
<div class="hidden content">
Hidden
</div>
</div>
<div class="ui vertical animated button" tabindex="0">
<div class="visible content">Vertical</div>
<div class="hidden content">
Hidden
</div>
</div>
<div class="ui animated fade button" tabindex="0">
<div class="visible content">Fade In</div>
<div class="hidden content">
Hidden
</div>
</div>
<div class="ui divider"></div>
<button class="ui disabled button">Disabled</button>
<button class="ui loading button">Loading</button>
<div class="ui divider"></div>
<div class="ui buttons">
<button class="ui button">1</button>
<button class="ui button">2</button>
<button class="ui button">3</button>
</div>
<div class="ui icon buttons">
<button class="ui button"><i class="align left icon"></i></button>
<button class="ui button"><i class="align center icon"></i></button>
<button class="ui button"><i class="align right icon"></i></button>
<button class="ui button"><i class="align justify icon"></i></button>
</div>
<div class="ui buttons">
<button class="ui button">1</button>
<div class="or"></div>
<button class="ui button">2</button>
</div>
<div class="ui divider"></div>
<div class="ui two top attached buttons">
<div class="ui button">One</div>
<div class="ui button">Two</div>
</div>
<div class="ui attached segment">
<img src="<%= Routes.static_path(@conn, "/images/wireframe/paragraph.png") %>" class="ui wireframe image">
</div>
<div class="ui two bottom attached buttons">
<div class="ui button">One</div>
<div class="ui button">Two</div>
</div>
</div>
<div class="column">
<button class="ui mini button">Mini</button>
<button class="ui tiny button">Tiny</button>
<button class="ui small button">Small</button>
<button class="ui large button">Large</button>
<button class="ui big button">Big</button>
<button class="ui huge button">Huge</button>
<button class="ui massive button">Massive</button>
<div class="ui divider"></div>
<div class="spaced">
<button class="yellow ui button">Yellow</button>
<button class="orange ui button">Orange</button>
<button class="green ui button">Green</button>
<button class="teal ui button">Teal</button>
<button class="blue ui button">Blue</button>
<button class="purple ui button">Purple</button>
<button class="pink ui button">Pink</button>
<button class="red ui button">Red</button>
<button class="black ui button">Black</button>
</div>
<div class="ui divider"></div>
<div class="ui inverted segment">
<button class="ui inverted button">Inverted</button>
<button class="ui inverted basic button">Basic</button>
<button class="ui inverted blue button">Colored</button>
<button class="ui inverted blue basic button">Basic Colored</button>
</div>
</div>
</div>
</div>

View file

@ -1,244 +0,0 @@
<div class="ui four cards">
<div class="ui card">
<div class="image">
<div class="ui blurring inverted dimmer">
<div class="content">
<div class="center">
<div class="ui teal button">Add Friend</div>
</div>
</div>
</div>
<img src="/images/wireframe/image.png">
</div>
<div class="content">
<div class="header">Title</div>
<div class="meta">
<a class="group">Meta</a>
</div>
<div class="description">One or two sentence description that may go to several lines</div>
</div>
<div class="extra content">
<a class="right floated created">Arbitrary</a>
<a class="friends">
Arbitrary</a>
</div>
</div>
<div class="ui card">
<div class="blurring dimmable image">
<div class="ui dimmer">
<div class="content">
<div class="center">
<div class="ui inverted button">Call to Action</div>
</div>
</div>
</div>
<img src="/images/wireframe/image.png">
</div>
<div class="content">
<a class="header">Name</a>
<div class="meta">
<span class="date">Date</span>
</div>
</div>
<div class="extra content">
<a>
<i class="users icon"></i>
Users
</a>
</div>
</div>
<div class="ui card">
<div class="ui slide right reveal image">
<div class="visible content">
<img class="ui fluid image" src="/images/avatar/nan.jpg">
</div>
<div class="hidden content">
<img class="ui fluid image" src="/images/avatar/tom.jpg">
</div>
</div>
<div class="content">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
</div>
<div class="ui card">
<div class="ui move reveal image">
<div class="visible content">
<img class="ui fluid image" src="/images/avatar/tom.jpg">
</div>
<div class="hidden content">
<img class="ui fluid image" src="/images/avatar/nan.jpg">
</div>
</div>
<div class="content">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
</div>
</div>
<div class="ui four cards">
<div class="ui card">
<div class="extra content">
<span class="left floated like">
<i class="like icon"></i>
Like
</span>
<span class="right floated star">
<i class="star icon"></i>
Favorite
</span>
</div>
<div class="content">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
</div>
<div class="ui card">
<div class="content">
<div class="header">
<img src="/images/wireframe/square-image.png" class="ui avatar right spaced image">
Abbreviated Header
</div>
<div class="description">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
</div>
<div class="ui two bottom attached buttons">
<div class="ui button">
Action 1
</div>
<div class="ui button">
Action 2
</div>
</div>
</div>
<a href="#" class="ui card">
<div class="content">
<div class="header">Cute Dog</div>
<div class="meta">
<span class="category">Animals</span>
</div>
<div class="description">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
</div>
<div class="extra content">
<div class="right floated author">
<img src="/images/wireframe/square-image.png" class="ui avatar image"> Username
</div>
</div>
</a>
<div class="ui card">
<div class="ui two top attached basic buttons">
<div class="ui button">
Action 1
</div>
<div class="ui button">
Action 2
</div>
</div>
<div class="content">
<img src="/images/wireframe/paragraph.png" class="ui wireframe image">
</div>
<div class="ui two bottom attached basic buttons">
<div class="ui button">
Action 3
</div>
<div class="ui button">
Action 4
</div>
</div>
</div>
</div>
<div class="ui four cards">
<div class="card">
<div class="content">
Content 1
</div>
<div class="content">
Content 2
</div>
<div class="content">
Content 3
</div>
<div class="extra content">
Extra Content
</div>
</div>
<div class="card">
<div class="content">
Content 1
</div>
<div class="content">
Content 2
</div>
<div class="content">
Content 3
</div>
<div class="extra content">
Extra Content
</div>
</div>
<div class="card">
<div class="content">
Content 1
</div>
<div class="content">
Content 2
</div>
<div class="content">
Content 3
</div>
<div class="extra content">
Extra Content
</div>
</div>
<div class="card">
<div class="content">
Content 1
</div>
<div class="content">
Content 2
</div>
<div class="content">
Content 3
</div>
<div class="extra content">
Extra Content
</div>
</div>
</div>
<div class="ui four cards">
<div class="card">
<div class="image">
<img src="/images/wireframe/image.png">
</div>
<div class="extra center aligned">
<div data-rating="4" class="ui star rating"></div>
</div>
</div>
<div class="card">
<div class="image">
<img src="/images/wireframe/image.png">
</div>
<div class="extra center aligned">
<div data-rating="2" class="ui star rating"></div>
</div>
</div>
<div class="card">
<div class="image">
<img src="/images/wireframe/image.png">
</div>
<div class="extra center aligned">
<div data-rating="3" class="ui star rating"></div>
</div>
</div>
<div class="card">
<div class="image">
<img src="/images/wireframe/image.png">
</div>
<div class="extra center aligned">
<div data-rating="4" class="ui star rating"></div>
</div>
</div>
</div>

View file

@ -1,98 +0,0 @@
<div class="ui content">
<div class="ui two column stackable grid">
<div class="column">
<div class="ui action left icon input">
<i class="search icon"></i>
<input type="text" placeholder="Search...">
<div class="ui teal button">Search</div>
</div>
<div class="ui divider"></div>
<div class="ui input error">
<input placeholder="Search..." type="text">
</div>
<div class="ui divider"></div>
<div class="ui right labeled input">
<input placeholder="Placeholder" type="text">
<div class="ui dropdown label">
<div class="text">Dropdown</div>
<i class="dropdown icon"></i>
<div class="menu">
<div class="item">Choice 1</div>
<div class="item">Choice 2</div>
<div class="item">Choice 3</div>
</div>
</div>
</div>
<div class="ui divider"></div>
<div class="ui transparent icon input">
<input placeholder="Search..." type="text">
<i class="search icon"></i>
</div>
<div class="ui transparent left icon input">
<input placeholder="Search..." type="text">
<i class="search icon"></i>
</div>
<div class="ui divider"></div>
<div class="ui left icon input loading">
<input placeholder="Loading..." type="text">
<i class="search icon"></i>
</div>
<div class="ui icon input loading">
<input placeholder="Loading..." type="text">
<i class="search icon"></i>
</div>
</div>
<div class="column">
<div class="ui right labeled left icon input">
<i class="tags icon"></i>
<input placeholder="Enter tags" type="text">
<a class="ui tag label">
Add Tag
</a>
</div>
<div class="ui divider"></div>
<div class="ui labeled input">
<a class="ui label">
Label
</a>
<input type="text" placeholder="Placeholder...">
</div>
<div class="ui divider"></div>
<div class="ui right labeled input">
<input type="text" placeholder="Placeholder...">
<a class="ui label">
Label
</a>
</div>
<div class="ui divider"></div>
<div class="ui labeled icon input">
<div class="ui label">
http://
</div>
<input type="text" placeholder="domain.com">
<i class="add circle link icon"></i>
</div>
<div class="ui right action input">
<input type="text" placeholder="domain.com">
<div class="ui teal button">
<i class="add icon"></i>
Add
</div>
</div>
<div class="ui divider"></div>
<div class="ui corner labeled input">
<input type="text" placeholder="Required Field">
<div class="ui corner label">
<i class="asterisk icon"></i>
</div>
</div>
</div>
</div>
</div>

View file

@ -1,140 +0,0 @@
<div class="ui container">
<div class="ui menu">
<div class="header item">Brand</div>
<a class="active item">Link</a>
<a class="item">Link</a>
<div class="ui dropdown item">
Dropdown
<i class="dropdown icon"></i>
<div class="menu">
<div class="item">Action</div>
<div class="item">Another Action</div>
<div class="item">Something else here</div>
<div class="divider"></div>
<div class="item">Separated Link</div>
<div class="divider"></div>
<div class="item">One more separated link</div>
</div>
</div>
<div class="right menu">
<div class="item">
<div class="ui action left icon input">
<i class="search icon"></i>
<input type="text" placeholder="Search">
<button class="ui button">Submit</button>
</div>
</div>
<a class="item">Link</a>
</div>
</div>
<div class="ui inverted menu">
<div class="header item">Brand</div>
<div class="active item">Link</div>
<a class="item">Link</a>
<div class="ui dropdown item">
Dropdown
<i class="dropdown icon"></i>
<div class="menu">
<div class="item">Action</div>
<div class="item">Another Action</div>
<div class="item">Something else here</div>
<div class="divider"></div>
<div class="item">Separated Link</div>
<div class="divider"></div>
<div class="item">One more separated link</div>
</div>
</div>
<div class="right menu">
<div class="item">
<div class="ui transparent inverted icon input">
<i class="search icon"></i>
<input type="text" placeholder="Search">
</div>
</div>
<a class="item">Link</a>
</div>
</div>
<div class="ui secondary menu">
<div class="active item">Link</div>
<a class="item">Link</a>
<div class="ui dropdown item">
Dropdown
<i class="dropdown icon"></i>
<div class="menu">
<div class="item">Action</div>
<div class="item">Another Action</div>
<div class="item">Something else here</div>
<div class="divider"></div>
<div class="item">Separated Link</div>
<div class="divider"></div>
<div class="item">One more separated link</div>
</div>
</div>
<div class="right menu">
<div class="item">
<div class="ui action left icon input">
<i class="search icon"></i>
<input type="text" placeholder="Search">
<button class="ui button">Submit</button>
</div>
</div>
<div class="ui dropdown item">
Dropdown Left<i class="dropdown icon"></i>
<div class="menu">
<a class="item">Link</a>
<a class="item">Link</a>
<div class="divider"></div>
<div class="header">Header</div>
<div class="item">
<i class="dropdown icon"></i>
Sub Menu
<div class="menu">
<a class="item">Link</a>
<div class="item">
<i class="dropdown icon"></i>
Sub Sub Menu
<div class="menu">
<a class="item">Link</a>
<a class="item">Link</a>
</div>
</div>
<a class="item">Link</a>
</div>
</div>
<a class="item">Link</a>
</div>
</div>
<a class="item">Link</a>
</div>
</div>
<div class="ui three column doubling grid">
<div class="column">
<div class="ui secondary pointing menu">
<div class="active item">Link</div>
<a class="item">Link</a>
<a class="item">Link</a>
</div>
</div>
<div class="column">
<div class="ui tabular menu">
<div class="active item">Link</div>
<a class="item">Link</a>
<a class="item">Link</a>
</div>
</div>
<div class="column">
<div class="ui pointing menu">
<div class="active item">Link</div>
<a class="item">Link</a>
<div class="right item">
Right Text
</div>
</div>
</div>
</div>
</div>

View file

@ -1,36 +0,0 @@
<div class="ui container">
<div class="ui three column stackable grid">
<div class="column">
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
</div>
<div class="column">
<h2>Example body text</h2>
<p>Nullam quis risus eget <a href="#">urna mollis ornare</a> vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
<p><small>This line of text is meant to be treated as fine print.</small></p>
<p>The following snippet of text is <strong>rendered as bold text</strong>.</p>
<p>The following snippet of text is <em>rendered as italicized text</em>.</p>
<p>An abbreviation of the word attribute is <abbr title="attribute">attr</abbr>.</p>
</div>
<div class="column">
<div class="ui three column stackable padded middle aligned centered color grid">
<div class="red column">Red</div>
<div class="orange column">Orange</div>
<div class="yellow column">Yellow</div>
<div class="olive column">Olive</div>
<div class="green column">Green</div>
<div class="teal column">Teal</div>
<div class="blue column">Blue</div>
<div class="violet column">Violet</div>
<div class="purple column">Purple</div>
<div class="pink column">Pink</div>
<div class="brown column">Brown</div>
<div class="grey column">Grey</div>
<div class="black column">Black</div>
</div>
</div>
</div>

View file

@ -1,423 +0,0 @@
<div class="ui content">
<div class="ui two column relaxed grid">
<div class="column">
<table class="ui right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Delmar</td>
<td>36</td>
<td>36g</td>
<td>2g</td>
</tr>
<tr>
<td class="left aligned">Louise</td>
<td>24</td>
<td>24g</td>
<td>29g</td>
</tr>
<tr>
<td class="left aligned">Terrell</td>
<td>22</td>
<td>11g</td>
<td>9g</td>
</tr>
<tr>
<td class="left aligned">Marion</td>
<td>7</td>
<td>35g</td>
<td>3g</td>
</tr>
<tr>
<td class="left aligned">Clayton</td>
<td>7</td>
<td>38g</td>
<td>20g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui right aligned celled table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Drema</td>
<td class="positive">15</td>
<td class="negative">26g</td>
<td class="warning">8g</td>
</tr>
<tr class="positive">
<td class="left aligned">Nona</td>
<td>11</td>
<td>21g</td>
<td>16g</td>
</tr>
<tr class="negative">
<td class="left aligned">Isidra</td>
<td>34</td>
<td>43g</td>
<td>11g</td>
</tr>
<tr class="warning">
<td class="left aligned">Bart</td>
<td>41</td>
<td>40g</td>
<td>30g</td>
</tr>
<tr class="selected">
<td class="left aligned">Nguyet</td>
<td>41</td>
<td>44g</td>
<td>28g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui basic right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Mirna</td>
<td>1</td>
<td>28g</td>
<td>29g</td>
</tr>
<tr>
<td class="left aligned">Fernando</td>
<td>38</td>
<td>2g</td>
<td>48g</td>
</tr>
<tr>
<td class="left aligned">Lisette</td>
<td>18</td>
<td>9g</td>
<td>23g</td>
</tr>
<tr>
<td class="left aligned">Ahmad</td>
<td>42</td>
<td>26g</td>
<td>49g</td>
</tr>
<tr>
<td class="left aligned">Laquanda</td>
<td>27</td>
<td>27g</td>
<td>49g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui very basic right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Drema</td>
<td>15</td>
<td>26g</td>
<td>8g</td>
</tr>
<tr>
<td class="left aligned">Nona</td>
<td>11</td>
<td>21g</td>
<td>16g</td>
</tr>
<tr>
<td class="left aligned">Isidra</td>
<td>34</td>
<td>43g</td>
<td>11g</td>
</tr>
<tr>
<td class="left aligned">Bart</td>
<td>41</td>
<td>40g</td>
<td>30g</td>
</tr>
<tr>
<td class="left aligned">Nguyet</td>
<td>41</td>
<td>44g</td>
<td>28g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui celled selectable right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Tasia</td>
<td>12</td>
<td>7g</td>
<td>21g</td>
</tr>
<tr>
<td class="left aligned">Ronnie</td>
<td>38</td>
<td>37g</td>
<td>38g</td>
</tr>
<tr>
<td class="left aligned">Gabriel</td>
<td>30</td>
<td>46g</td>
<td>46g</td>
</tr>
<tr>
<td class="left aligned">Logan</td>
<td>12</td>
<td>21g</td>
<td>39g</td>
</tr>
<tr>
<td class="left aligned">Clare</td>
<td>39</td>
<td>41g</td>
<td>2g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui striped right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Rosaline</td>
<td>5</td>
<td>35g</td>
<td>6g</td>
</tr>
<tr>
<td class="left aligned">Barrie</td>
<td>27</td>
<td>23g</td>
<td>28g</td>
</tr>
<tr>
<td class="left aligned">Trinidad</td>
<td>14</td>
<td>50g</td>
<td>7g</td>
</tr>
<tr>
<td class="left aligned">Jaqueline</td>
<td>31</td>
<td>30g</td>
<td>50g</td>
</tr>
<tr>
<td class="left aligned">Tamala</td>
<td>18</td>
<td>6g</td>
<td>13g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui padded celled right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Lianne</td>
<td>23</td>
<td>32g</td>
<td>43g</td>
</tr>
<tr>
<td class="left aligned">Joette</td>
<td>21</td>
<td>13g</td>
<td>31g</td>
</tr>
<tr>
<td class="left aligned">Le</td>
<td>28</td>
<td>39g</td>
<td>23g</td>
</tr>
<tr>
<td class="left aligned">Sacha</td>
<td>46</td>
<td>43g</td>
<td>13g</td>
</tr>
<tr>
<td class="left aligned">Bruna</td>
<td>9</td>
<td>47g</td>
<td>12g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui definition celled right aligned table">
<thead>
<th></th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Lianne</td>
<td>23</td>
<td>32g</td>
<td>43g</td>
</tr>
<tr>
<td class="left aligned">Joette</td>
<td>21</td>
<td>13g</td>
<td>31g</td>
</tr>
<tr>
<td class="left aligned">Le</td>
<td>28</td>
<td>39g</td>
<td>23g</td>
</tr>
<tr>
<td class="left aligned">Sacha</td>
<td>46</td>
<td>43g</td>
<td>13g</td>
</tr>
<tr>
<td class="left aligned">Bruna</td>
<td>9</td>
<td>47g</td>
<td>12g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui inverted right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Lianne</td>
<td>23</td>
<td>32g</td>
<td>43g</td>
</tr>
<tr>
<td class="left aligned">Joette</td>
<td>21</td>
<td>13g</td>
<td>31g</td>
</tr>
<tr>
<td class="left aligned">Le</td>
<td>28</td>
<td>39g</td>
<td>23g</td>
</tr>
<tr>
<td class="left aligned">Sacha</td>
<td>46</td>
<td>43g</td>
<td>13g</td>
</tr>
<tr>
<td class="left aligned">Bruna</td>
<td>9</td>
<td>47g</td>
<td>12g</td>
</tr>
</tbody>
</table>
</div>
<div class="column">
<table class="ui inverted blue selectable celled right aligned table">
<thead>
<th class="left aligned">Person</th>
<th>Calories</th>
<th>Fat</th>
<th>Protein</th>
</thead>
<tbody>
<tr>
<td class="left aligned">Lianne</td>
<td>23</td>
<td>32g</td>
<td>43g</td>
</tr>
<tr>
<td class="left aligned">Joette</td>
<td>21</td>
<td>13g</td>
<td>31g</td>
</tr>
<tr>
<td class="left aligned">Le</td>
<td>28</td>
<td>39g</td>
<td>23g</td>
</tr>
<tr>
<td class="left aligned">Sacha</td>
<td>46</td>
<td>43g</td>
<td>13g</td>
</tr>
<tr>
<td class="left aligned">Bruna</td>
<td>9</td>
<td>47g</td>
<td>12g</td>
</tr>
</tbody>
</table>
</div>
</div>

View file

@ -1,5 +0,0 @@
<h2>Edit comment</h2>
<%= render "form.html", Map.put(assigns, :action, Routes.comment_path(@conn, :update, @comment)) %>
<span><%= link "Back", to: Routes.comment_path(@conn, :index) %></span>

View file

@ -1,11 +0,0 @@
<%= form_for @changeset, @action, fn f -> %>
<%= if @changeset.action do %>
<div class="alert alert-danger">
<p>Oops, something went wrong! Please check the errors below.</p>
</div>
<% end %>
<div class="form-group">
<%= submit "Submit", class: "btn btn-primary" %>
</div>
<% end %>

View file

@ -1,24 +0,0 @@
<h2>Listing comments</h2>
<table class="table">
<thead>
<tr>
<th></th>
</tr>
</thead>
<tbody>
<%= for comment <- @comments do %>
<tr>
<td class="text-right">
<span><%= link "Show", to: Routes.comment_path(@conn, :show, comment), class: "btn btn-default btn-xs" %></span>
<span><%= link "Edit", to: Routes.comment_path(@conn, :edit, comment), class: "btn btn-default btn-xs" %></span>
<span><%= link "Delete", to: Routes.comment_path(@conn, :delete, comment), method: :delete, data: [confirm: "Are you sure?"], class: "btn btn-danger btn-xs" %></span>
</td>
</tr>
<% end %>
</tbody>
</table>
<span><%= link "New comment", to: Routes.comment_path(@conn, :new) %></span>

View file

@ -1,5 +0,0 @@
<h2>New comment</h2>
<%= render "form.html", Map.put(assigns, :action, Routes.comment_path(@conn, :create)) %>
<span><%= link "Back", to: Routes.comment_path(@conn, :index) %></span>

View file

@ -1,8 +0,0 @@
<h2>Show comment</h2>
<ul>
</ul>
<span><%= link "Edit", to: Routes.comment_path(@conn, :edit, @comment) %></span>
<span><%= link "Back", to: Routes.comment_path(@conn, :index) %></span>

View file

@ -67,20 +67,23 @@ defmodule Content.PostsView do
assigns = %{post: post, author: author, conn: conn}
~E"""
<% _ = assigns # suppress unused assigns warning %>
<div class="Comment-topmatter">
<h4>
<%= link to: author.homepage_url || "#", rel: "author", class: "p-author h-card" do %>
<%= img_tag gravatar_url_for_email(author.email), alt: "Photo of #{author.display_name}", class: "Gravatar u-photo ui avatar image" %>
<span><%= author.display_name %></span>
&#8226;
<%= link to: Routes.posts_path(conn, :show, post) do %>
<div class="flex w-full items-center font-sans py-6">
<%= link to: author.homepage_url || "#", rel: "author", class: "p-author h-card" do %>
<%= img_tag gravatar_url_for_email(author.email), alt: "Photo of #{author.display_name}", class: "Gravatar u-photo w-10 h-10 rounded-full mr-4" %>
<div class="flex-1 px-2">
<p class="text-base font-bold text-base md:text-xl leading-none mb-2">
<%= author.display_name %>
</p>
<%= link to: Routes.posts_path(conn, :show, post) do %>
<p class="text-gray-600 text-xs md:text-base">
Published
<time class="dt-published" datetime="<%= post.date %>">
<%= post.date |> Timex.format!("%F", :strftime) %>
</time>
<% end %>
</p>
<% end %>
</h4>
</div>
<% end %>
</div>
"""
end

View file

@ -1,3 +0,0 @@
defmodule Content.CommentView do
use Content, :view
end

View file

@ -42,7 +42,7 @@ defmodule Content.MixProject do
{:auth, in_umbrella: true},
{:auth_web, in_umbrella: true},
{:core, in_umbrella: true},
{:earmark, "~> 1.4.2" },
{:earmark, "1.4.3"},
{:excoveralls, "~> 0.10", only: [:dev, :test]},
{:floki, "~> 0.25.0"},
{:gettext, "~> 0.11"},
@ -77,7 +77,8 @@ defmodule Content.MixProject do
[
"ecto.setup": ["ecto.create", "ecto.migrate", "run priv/repo/seeds.exs"],
"ecto.reset": ["ecto.drop", "ecto.setup"],
test: ["ecto.create --quiet", "ecto.migrate", "test"]
test: ["ecto.create --quiet", "ecto.migrate", "test"],
"npm.install": [],
]
end
end

View file

@ -1,75 +0,0 @@
defmodule Content.ShortcodesTest do
use ExUnit.Case
import Content.Shortcodes
describe "shortcodes" do
test "no shortcodes, no problem" do
assert expand_shortcodes("test") == "test"
end
test "double bracket escapes work" do
assert expand_shortcodes("[[test]]") == "[test]"
end
test "escapes enclosing shortcodes" do
assert expand_shortcodes("[[test] abc [/test]]") == "[test] abc [/test]"
end
test "escapes shortcodes with args" do
assert expand_shortcodes("[[test with-args][/test]]") == "[test with-args][/test]"
end
test "expands shortcodes" do
assert expand_shortcodes("[test]") == "TSET"
end
test "expands shortcodes in the middle" do
assert expand_shortcodes("this is a [test] of the shortcode system") == "this is a TSET of the shortcode system"
end
test "expands shortcodes at the end" do
assert expand_shortcodes("this is a [test]") == "this is a TSET"
end
test "expands shortcodes at the beginning" do
assert expand_shortcodes("[test] it up") == "TSET it up"
end
test "handles shortcodes with args" do
assert expand_shortcodes("[test with-args]") == "TSET"
end
test "handles enclosing shortcodes" do
assert expand_shortcodes("[test]Content[/test]") == "TNETNOC"
end
test "handles enclosing shortcodes with args" do
assert expand_shortcodes("[test with-args]Content[/test]") == "TNETNOC"
end
test "handles enclosing shortcodes with no content" do
assert expand_shortcodes("[test with-args][/test]") == ""
end
test "handles strings with carriage returns" do
assert expand_shortcodes(" | \r\n ") == " | \n "
end
test "handles strings with high unicode characters" do
assert expand_shortcodes("") == ""
end
test "handles shortcodes within tags" do
assert expand_shortcodes("<p>[test]<em>chacha</em></p>") == "<p>TSET<em>chacha</em></p>"
end
test "handles mangled shortcodes gracefully" do
assert expand_shortcodes("[[unclosed shortcode") == "[[unclosed shortcode"
end
test "handles comments in html" do
assert expand_shortcodes("<!-- comment -->") == "<!-- comment -->"
end
end
end

View file

@ -0,0 +1,82 @@
{
"extends": "stylelint-config-standard",
"plugins": [
"stylelint-order"
],
"rules": {
"order/properties-order": [
[
{
groupName: "display",
emptyLineBefore: "never",
properties: [
"display",
"flex-wrap",
"justify-content"
]
},
{
groupName: "positioning",
emptyLineBefore: "never",
properties: [
"position",
"top",
"right",
"bottom",
"left",
"z-index"
],
},
{
groupName: "box-model",
emptyLineBefore: "never",
properties: [
"min-width",
"width",
"max-width",
"min-height",
"height",
"max-height",
"margin",
"margin-top",
"margin-right",
"margin-bottom",
"margin-left",
"overflow",
"overflow-x",
"overflow-y",
"padding",
"padding-top",
"padding-right",
"padding-bottom",
"padding-left"
],
},
{
groupName: "color-and-type",
emptyLineBefore: "never",
properties: [
"background-color",
"color",
"font-family",
"font-size",
"font-weight",
],
},
{
groupName: "decoration",
emptyLineBefore: "never",
properties: [
"border",
"border-color",
"box-shadow"
],
}
],
{
unspecified: "bottomAlphabetical"
}
]
},
"ignoreFiles": ["node_modules/**/*.css"]
}

View file

@ -0,0 +1,36 @@
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
@import "@fortawesome/fontawesome-free/css/all.css";
@import "blog";
@import "code";
input[type="checkbox"]::after {
content: "";
color: currentColor;
width: 100%;
height: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
}
input[type="checkbox"]:checked::after {
content: "✓";
}
.hidden-options-toggle:checked+.hidden {
display: block;
}
.password-revealer {
@apply absolute;
height: 45px;
width: 45px;
right: 0;
bottom: 0;
}

View file

@ -1,8 +0,0 @@
// Menu buttons get a little spacing
.masthead .ui.menu .ui.button {
margin-left: 0.5em;
}
[class*="top padded"] {
padding-top: 4em;
}

View file

@ -0,0 +1,71 @@
.Article-content a {
@apply text-blue-700 underline;
}
.Article-content h1 a {
@apply text-black no-underline;
}
.Article-content p {
@apply mb-6;
}
.Article-content h1 {
@apply text-4xl font-bold mt-6 mb-3;
}
.Article-content h2 {
@apply text-2xl font-bold mt-6 mb-3;
}
.Article-content h3 {
@apply text-xl font-semibold mt-3 mb-3;
}
.Article-content h4 {
@apply text-lg font-semibold mt-3;
}
.Article-content h5 {
@apply uppercase mt-3;
}
.Article-content h6 {
@apply uppercase font-light mt-3;
}
.Article-content blockquote {
@apply border-l-2 pl-4 italic mb-6;
}
.Article-content blockquote cite {
@apply not-italic font-bold mt-6 block;
}
.Article-content table {
@apply min-w-full leading-normal;
}
.Article-content th {
@apply px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider;
}
.Article-content td {
@apply px-5 py-5 border-b border-gray-200 bg-white text-sm;
}
.Article-content dt {
@apply uppercase font-light mt-3;
}
.Article-content ul {
@apply list-disc;
}
.Article-content ol {
@apply list-decimal;
}
.Article-content li {
@apply ml-6 pl-2;
}

View file

@ -0,0 +1,104 @@
/* hljs theme built using tailwind
/* Comment */
.hljs-comment,
.hljs-quote {
color: var(--positive-color);
}
/* Red */
.hljs-variable,
.hljs-template-variable,
.hljs-tag,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class,
.hljs-regexp,
.hljs-deletion {
color: var(--highlight-color);
}
/* Orange */
.hljs-number,
.hljs-built_in,
.hljs-builtin-name,
.hljs-literal,
.hljs-type,
.hljs-params,
.hljs-meta,
.hljs-link {
color: var(--warning-color);
}
/* Yellow */
.hljs-attribute {
color: var(--attribute-color);
}
/* Green */
.hljs-string,
.hljs-symbol,
.hljs-bullet,
.hljs-addition {
color: var(--string-color);
}
/* Blue */
.hljs-title,
.hljs-section {
color: var(--section-color);
}
/* Purple */
.hljs-keyword,
.hljs-selector-tag {
color: var(--keyword-color);
}
.hljs {
@apply mt-6 mb-12 border-l-4 border-indigo-900 font-mono;
--background-color: theme("colors.indigo.100");
--attribute-color: theme("colors.orange.700");
--section-color: theme("colors.teal.700");
--string-color: theme("colors.green.700");
--keyword-color: theme("colors.indigo.900");
display: block;
overflow-x: auto;
padding: 0.5em;
color: var(--body-color);
background: var(--background-color);
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bold;
}
@media screen and (-ms-high-contrast: active) {
.hljs-addition,
.hljs-attribute,
.hljs-built_in,
.hljs-builtin-name,
.hljs-bullet,
.hljs-comment,
.hljs-link,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-params,
.hljs-string,
.hljs-symbol,
.hljs-type,
.hljs-quote {
color: highlight;
}
.hljs-keyword,
.hljs-selector-tag {
font-weight: bold;
}
}

View file

@ -1,8 +1,7 @@
import '../semantic/src/semantic.less';
// We need to import the CSS so that webpack will load it.
// The MiniCssExtractPlugin is used to separate it out into
// its own CSS file.
import "../css/app.scss"
import "../css/app.css"
// webpack automatically bundles all modules in your
// entry points. Those entry points can be configured
@ -38,6 +37,10 @@ const toggleSidebar = (event) => {
}
ready(() => {
document.getElementById('nav-toggle').onclick = function(){
document.getElementById("nav-content").classList.toggle("hidden");
}
document.querySelectorAll('.js-passwordRevealer').forEach((el) => {
el.addEventListener('click', togglePasswordFieldVisibility)
})
@ -45,4 +48,10 @@ ready(() => {
document.querySelectorAll('.js-SidebarOpener').forEach((el) => {
el.addEventListener('click', toggleSidebar)
})
document.querySelectorAll('.js-flash-closer').forEach((el) => {
el.addEventListener('click', () => {
el.closest('.js-flash').remove()
})
})
})

View file

@ -1 +0,0 @@
../acorn/bin/acorn

View file

@ -1 +0,0 @@
../atob/bin/atob.js

View file

@ -1 +0,0 @@
../autoprefixer/bin/autoprefixer

View file

@ -1 +0,0 @@
../browserslist/cli.js

View file

@ -1 +0,0 @@
../color-support/bin.js

View file

@ -1 +0,0 @@
../js-beautify/js/bin/css-beautify.js

View file

@ -1 +0,0 @@
../cssesc/bin/cssesc

View file

@ -1 +0,0 @@
../cwebp-bin/cli.js

View file

@ -1 +0,0 @@
../editorconfig/bin/editorconfig

View file

@ -1 +0,0 @@
../errno/cli.js

View file

@ -1 +0,0 @@
../esprima/bin/esparse.js

View file

@ -1 +0,0 @@
../esprima/bin/esvalidate.js

View file

@ -1 +0,0 @@
../findup/bin/findup.js

View file

@ -1 +0,0 @@
../gifsicle/cli.js

View file

@ -1 +0,0 @@
../gulp/bin/gulp.js

View file

@ -1 +0,0 @@
../js-beautify/js/bin/html-beautify.js

View file

@ -1 +0,0 @@
../image-size/bin/image-size.js

Some files were not shown because too many files have changed in this diff Show more