Move About to front card, closes #29
This commit is contained in:
lostinlight
parent
d8d803f283
commit
31f5d80ab5
|
|
@ -17,15 +17,15 @@ Software submitted to **ALL APPS** website page **must be**:
|
|||
|
||||
Fork this repository. Add your project data to `./source/_data/miscellaneous.json` file.
|
||||
|
||||
A project **must have** *title, source, protocols (1 string, comma separated), license, categories* and appropriate protocol classes marked as `true`.
|
||||
A project **must have** *title, source, protocols (1 string, comma separated), license, categories* and appropriate protocol classes marked as `true`. Project's description (`about`) shouldn't excede 200 characters limit.
|
||||
|
||||
Please, choose no more than **2 categories** (array of strings) for the software. The ones it was initially designed for.
|
||||
Please, choose no more than **3 categories** (array of strings) for the software. The ones it was initially designed for.
|
||||
|
||||
#### Software categories (WIP, may change in the future)
|
||||
* `SN-ma` (social network: macroblogging)
|
||||
* `SN-mi` (social network: microblogging)
|
||||
* `Blog-Pub` (blog and publishing software)
|
||||
* `Media` (media sharing: images, audio, etc)
|
||||
* `Media` (media sharing: images, audio, video, etc)
|
||||
* `Links` (link sharing)
|
||||
* `Ev-Meet` (events, meetups, calendars)
|
||||
* `Files` (file hosting software)
|
||||
|
|
@ -33,23 +33,29 @@ Please, choose no more than **2 categories** (array of strings) for the software
|
|||
* `Open data` (dataset / corpora exchange)
|
||||
* `Reviews` (networks whose main purpose is reviewing stuff)
|
||||
* `Games` (gaming servers and apps)
|
||||
* `Develop` (software development applications)
|
||||
|
||||
A project may have a logo / image (45x45px), placed in `./source/img/misc` folder.
|
||||
|
||||
### [Submitting tools](#submitting-tools)
|
||||
Fork this repository. Add your project data to `./source/_data/tools.json` file.
|
||||
|
||||
A project **must have** *title, source, protocols (1 string, comma separated), license, categories* and appropriate protocol classes marked as `true`. Project's description (`about`) shouldn't excede 200 characters limit.
|
||||
|
||||
Please, choose no more than **2 categories** (array of strings) for the software. The ones it was initially designed for.
|
||||
|
||||
#### Tools categories (WIP, may change in the future)
|
||||
* `Libs` (frameworks, libraries, reference implementations in particular code language)
|
||||
* `Specs` (Fediverse protocol specifications)
|
||||
* `Tools` (for developer and geeky tools, like pastebins, git systems, pads, etc)
|
||||
* `Utils` (daemons, bots, resharers, and other such services for Fediverse)
|
||||
* `Utils` (Utilities: daemons, bots, resharers)
|
||||
* `Relays` (Fediverse relays)
|
||||
* `Bridges` (bridging other stuff to fediverse networks)
|
||||
* `Tests` (any kind of test tools)
|
||||
* `Plugins` (CMS plugins, apps to be installed inside other systems connecting to Fediverse)
|
||||
* `Other` (everything that doesn't quite fit into the above categories)
|
||||
|
||||
A project may have a logo / image (45x45px), placed in `./source/img/misc` folder.
|
||||
|
||||
### [Submitting news](#submitting-news)
|
||||
|
||||
Please, read our [guidelines](./GUIDELINES.md) for guest authors.
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "Node.js, LESS",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://writing.exchange/@write_as",
|
||||
"FediAccount": "@write_as@writing.exchange",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
"codeLanguage": "Rust",
|
||||
"techStack": "Rocket, Diesel, Ructe templates, WASM, SCSS",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://fediverse.blog/~/PlumeDev",
|
||||
"FediAccount": "@PlumeDev@fediverse.blog",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
"site": "https://epicyon.net",
|
||||
"logo": "/img/misc/epicyon.png",
|
||||
"servers": "https://the-federation.info/epicyon",
|
||||
"description": "ActivityPub server implementing S2S and C2S protocols, suitable for single board computers. Includes features such as moderation tools, post expiry, content warnings, and image descriptions.",
|
||||
"description": "ActivityPub server implementing S2S and C2S protocols, suitable for single board computers. Provides moderation tools, post expiry, content warnings, and image descriptions.",
|
||||
"codeLanguage": "Python",
|
||||
"techStack": "",
|
||||
"license": "AGPL-3.0",
|
||||
|
|
@ -84,7 +84,7 @@
|
|||
"codeLanguage": "Ruby",
|
||||
"techStack": "Node.js",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.social/@prismo",
|
||||
"FediAccount": "@prismo@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -174,7 +174,7 @@
|
|||
"codeLanguage": "PHP",
|
||||
"techStack": "",
|
||||
"license": "GPL-3.0",
|
||||
"FediAccount": "https://mastodon.xyz/@David",
|
||||
"FediAccount": "@David@mastodon.xyz",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -192,7 +192,7 @@
|
|||
"codeLanguage": "Python",
|
||||
"techStack": "Tornado, peewee",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.social/@anfora",
|
||||
"FediAccount": "@anfora@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -228,7 +228,7 @@
|
|||
"codeLanguage": "Rust",
|
||||
"techStack": "Actix, Diesel, Inferno, TypeScript",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.social/@LemmyDev",
|
||||
"FediAccount": "@LemmyDev@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -264,7 +264,7 @@
|
|||
"codeLanguage": "Elixir",
|
||||
"techStack": "Vue, TypeScript",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://framapiaf.org/@mobilizon",
|
||||
"FediAccount": "@mobilizon@ramapiaf.org",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -354,7 +354,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://metalhead.club/@mariusor",
|
||||
"FediAccount": "@mariusor@metalhead.club",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -408,7 +408,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "ISC",
|
||||
"FediAccount": "https://honk.tedunangst.com/u/tedu",
|
||||
"FediAccount": "@tedu@honk.tedunangst.com",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -426,7 +426,7 @@
|
|||
"codeLanguage": "Java",
|
||||
"techStack": "",
|
||||
"license": "Unlicense (public domain)",
|
||||
"FediAccount": "https://mastodon.social/@grishka",
|
||||
"FediAccount": "@grishka@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -606,7 +606,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://mastodon.social/@ngerakines",
|
||||
"FediAccount": "@ngerakines@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -624,7 +624,7 @@
|
|||
"codeLanguage": "Python",
|
||||
"techStack": "Django, Vue, Nuxt, Spectre.css, Zutre",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.etalab.gouv.fr/@scifed",
|
||||
"FediAccount": "@scifed@mastodon.etalab.gouv.fr",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -656,7 +656,7 @@
|
|||
"site": "https://skohub.io",
|
||||
"logo": "",
|
||||
"servers": "",
|
||||
"description": "SkoHub extends Knowledge Organization Systems (KOS) to create a publication / subscription infrastructure for Open Educational Resources. It allows to follow specific subjects and to be notified when new content about that subject is published.",
|
||||
"description": "SkoHub creates a publication / subscription infrastructure for Open Educational Resources. It allows to follow specific subjects and to be notified when new content about that subject is published.",
|
||||
"codeLanguage": "Javascript",
|
||||
"techStack": "",
|
||||
"license": "Apache-2.0",
|
||||
|
|
@ -732,7 +732,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "-",
|
||||
"FediAccount": "https://mastodon.lubar.me/@ben",
|
||||
"FediAccount": "@ben@mastodon.lubar.me",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -750,7 +750,7 @@
|
|||
"codeLanguage": "TypeScript",
|
||||
"techStack": "Node.js",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://mastodon.social/@kosinus",
|
||||
"FediAccount": "@kosinus@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -804,7 +804,7 @@
|
|||
"codeLanguage": "Javascript",
|
||||
"techStack": "Node.js",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://floss.social/@Readlebee",
|
||||
"FediAccount": "@Readlebee@floss.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -894,7 +894,7 @@
|
|||
"codeLanguage": "Python",
|
||||
"techStack": "",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.technology/@agateblue",
|
||||
"FediAccount": "@agateblue@mastodon.technology",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -948,7 +948,7 @@
|
|||
"codeLanguage": "Javascript",
|
||||
"techStack": "Node.js, Vue",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://misskey.io/@syuilo",
|
||||
"FediAccount": "@syuilo@misskey.io",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -984,7 +984,7 @@
|
|||
"codeLanguage": "PHP",
|
||||
"techStack": "",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.social/@pixelfed",
|
||||
"FediAccount": "@pixelfed@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -1002,7 +1002,7 @@
|
|||
"codeLanguage": "Elixir",
|
||||
"techStack": "Vue",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://pleroma.soykaf.com/lain",
|
||||
"FediAccount": "@lain@pleroma.soykaf.com",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -1016,11 +1016,11 @@
|
|||
"site": "https://socialhome.network",
|
||||
"logo": "/img/misc/socialhome.svg",
|
||||
"servers": "https://the-federation.info/socialhome",
|
||||
"description": "Personal webpage with social networking functionality. Column grid layout makes it a perfect network for sharing image content or creating personal portfolio",
|
||||
"description": "Personal webpage with social networking functionality. Column grid layout makes it a perfect network for sharing image content or creating personal portfolio.",
|
||||
"codeLanguage": "Python",
|
||||
"techStack": "Django, Vue",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://jasonrobinson.me/p/da323072-e566-4b6e-a8b6-b2bda0c6ace4",
|
||||
"FediAccount": "@jaywink@jasonrobinson.me",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": true,
|
||||
|
|
@ -1038,7 +1038,7 @@
|
|||
"codeLanguage": "Ruby",
|
||||
"techStack": "React, SASS, Node.js",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://mastodon.social/@gargron",
|
||||
"FediAccount": "@gargron@mastodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -1056,7 +1056,7 @@
|
|||
"codeLanguage": "",
|
||||
"techStack": "",
|
||||
"license": "",
|
||||
"FediAccount": "https://chaos.social/@redaktor",
|
||||
"FediAccount": "@redaktor@chaos.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -1074,7 +1074,7 @@
|
|||
"codeLanguage": "",
|
||||
"techStack": "",
|
||||
"license": "-",
|
||||
"FediAccount": "https://bitcoinhackers.org@berkes",
|
||||
"FediAccount": "@berkes@bitcoinhackers.org",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -1092,7 +1092,7 @@
|
|||
"codeLanguage": "C",
|
||||
"techStack": "Elm",
|
||||
"license": "CNPL",
|
||||
"FediAccount": "https://octodon.social/@parastat",
|
||||
"FediAccount": "@parastat@octodon.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
"codeLanguage": "",
|
||||
"techStack": "",
|
||||
"license": "CC-1.0",
|
||||
"FediAccount": "https://floss.social/@forgefed",
|
||||
"FediAccount": "@forgefed@floss.social",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -174,7 +174,7 @@
|
|||
"codeLanguage": "PHP",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://mastodon.technology/@jdormit",
|
||||
"FediAccount": "@jdormit@mastodon.technology",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -372,7 +372,7 @@
|
|||
"codeLanguage": "PHP",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://mastodon.technology/@jdormit",
|
||||
"FediAccount": "@jdormit@mastodon.technology",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -426,7 +426,7 @@
|
|||
"codeLanguage": "PHP",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://cybre.space/@landrok",
|
||||
"FediAccount": "@landrok@cybre.space",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -444,7 +444,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "AGPL-3.0",
|
||||
"FediAccount": "https://social.matej-lach.me/@MatejLach",
|
||||
"FediAccount": "@MatejLach@social.matej-lach.me",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
@ -570,7 +570,7 @@
|
|||
"codeLanguage": "Go",
|
||||
"techStack": "",
|
||||
"license": "MIT",
|
||||
"FediAccount": "https://metalhead.club/@mariusor",
|
||||
"FediAccount": "@mariusor@metalhead.club",
|
||||
"apClass": true,
|
||||
"zotClass": false,
|
||||
"diasporaClass": false,
|
||||
|
|
|
|||
|
|
@ -74,9 +74,11 @@ layout: layout
|
|||
<h4 class="card__subtitle">Servers</h4>
|
||||
<p><a href="<%= apps[item].servers %>">list</a> <svg role="img"><title>remote link</title><use xlink:href="#icon-link"></use></svg></p>
|
||||
<% } %>
|
||||
<% if (apps[item].FediAccount) { %>
|
||||
<h4 class="card__subtitle">Contact</h4>
|
||||
<p><a href="<%= apps[item].FediAccount %>">account</a> <svg role="img"><title>remote link</title><use xlink:href="#icon-link"></use></svg></p>
|
||||
<% if (apps[item].description) { %>
|
||||
<h4 class="card__subtitle">About</h4>
|
||||
<p class="card__about">
|
||||
<%- truncate( (apps[item].description), {length: 200, omission: '...'}) %>
|
||||
</p>
|
||||
<% } %>
|
||||
<span class="card__more u-emphasize">more info<i>▶</i</span>
|
||||
</div>
|
||||
|
|
@ -91,11 +93,9 @@ layout: layout
|
|||
<% } %>
|
||||
<h4 class="card__subtitle">Protocols</h4>
|
||||
<p><%= apps[item].protocols %></p>
|
||||
<% if (apps[item].description) { %>
|
||||
<h4 class="card__subtitle">About</h4>
|
||||
<p class="card__about">
|
||||
<%- truncate( (apps[item].description), {length: 250, omission: '...'}) %>
|
||||
</p>
|
||||
<% if (apps[item].FediAccount) { %>
|
||||
<h4 class="card__subtitle">Contact</h4>
|
||||
<p><%= apps[item].FediAccount %></p>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ layout: layout
|
|||
|
||||
const apps = site.data.tools.apps;
|
||||
const langList = langCount(apps).sort((a,b) => b.count - a.count);
|
||||
const byCategory = [['libs', 'Libraries'], ['specs', 'Specifications'], ['utils', 'Utilities (bots, daemons, federators)'], ['relays', 'Relays'], ['bridges', 'Bridges'], ['plugins', 'Plugins (addon apps)'], ['tests', 'Testing'], ['other', 'Other']];
|
||||
const byCategory = [['libs', 'Libraries'], ['specs', 'Specifications'], ['utils', 'Utilities (bots, daemons, federators)'], ['relays', 'Relays'], ['bridges', 'Bridges'], ['plugins', 'Plugins (addons)'], ['tests', 'Testing'], ['other', 'Other']];
|
||||
const byProtocol = [['sortDiaspora', 'diaspora'], ['sortAP', 'ActivityPub'], ['sortOstatus', 'OStatus'], ['sortZot', 'Zot']];
|
||||
%>
|
||||
|
||||
|
|
@ -73,9 +73,11 @@ layout: layout
|
|||
<h4 class="card__subtitle">Servers</h4>
|
||||
<p><a href="<%= apps[item].servers %>">list</a> <svg role="img"><title>remote link</title><use xlink:href="#icon-link"></use></svg></p>
|
||||
<% } %>
|
||||
<% if (apps[item].FediAccount) { %>
|
||||
<h4 class="card__subtitle">Contact</h4>
|
||||
<p><a href="<%= apps[item].FediAccount %>">account</a> <svg role="img"><title>remote link</title><use xlink:href="#icon-link"></use></svg></p>
|
||||
<% if (apps[item].description) { %>
|
||||
<h4 class="card__subtitle">About</h4>
|
||||
<p class="card__about">
|
||||
<%- truncate( (apps[item].description), {length: 200, omission: '...'}) %>
|
||||
</p>
|
||||
<% } %>
|
||||
<span class="card__more u-emphasize">more info<i>▶</i</span>
|
||||
</div>
|
||||
|
|
@ -90,11 +92,9 @@ layout: layout
|
|||
<% } %>
|
||||
<h4 class="card__subtitle">Protocols</h4>
|
||||
<p><%= apps[item].protocols %></p>
|
||||
<% if (apps[item].description) { %>
|
||||
<h4 class="card__subtitle">About</h4>
|
||||
<p class="card__about">
|
||||
<%- truncate( (apps[item].description), {length: 250, omission: '...'}) %>
|
||||
</p>
|
||||
<% if (apps[item].FediAccount) { %>
|
||||
<h4 class="card__subtitle">Contact</h4>
|
||||
<p><%= apps[item].FediAccount %></p>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@
|
|||
}
|
||||
|
||||
.card__body {
|
||||
padding: 2em;
|
||||
padding: 1.5em;
|
||||
}
|
||||
|
||||
.card__subtitle {
|
||||
|
|
@ -141,20 +141,20 @@
|
|||
position: relative;
|
||||
background: $white;
|
||||
border-radius: inherit;
|
||||
width: 270px;
|
||||
height: 360px;
|
||||
width: 300px;
|
||||
height: 420px;
|
||||
transition: .3s cubic-bezier(.175, .885, .32, 1.275);
|
||||
}
|
||||
|
||||
.card__extra {
|
||||
position: absolute;
|
||||
width: 350px;
|
||||
height: 360px;
|
||||
width: 300px;
|
||||
height: 420px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-radius: 0 8px 8px 0;
|
||||
transition: .15s cubic-bezier(.175, .885, .32, 1);
|
||||
transform: translateX(70%) rotateX(90deg);
|
||||
transform: translateX(90%) rotateX(90deg);
|
||||
opacity: 0;
|
||||
transform-origin: top;
|
||||
overflow: hidden;
|
||||
|
|
@ -183,13 +183,13 @@
|
|||
border-radius: 20%;
|
||||
background: linear-gradient(45deg, rgba(255, 255, 255, 1.0e-05) calc(50% - 2px), #fff calc(50% - 2px), #fff calc(50% + 2px), rgba(255, 255, 255, 1.0e-05) calc(50% + 2px)), linear-gradient(-45deg, rgba(255, 255, 255, 1.0e-05) calc(50% - 2px), #fff calc(50% - 2px), #fff calc(50% + 2px), rgba(255, 255, 255, 1.0e-05) calc(50% + 2px)), $golden;
|
||||
top: -30px;
|
||||
right: -360px;
|
||||
right: -290px;
|
||||
box-shadow: inset 0 0 0 5px $golden;
|
||||
z-index: $zIndex--5;
|
||||
}
|
||||
|
||||
.card__content:before {
|
||||
width: 660px;
|
||||
width: 625px;
|
||||
height: 30px;
|
||||
top: -35px;
|
||||
left: -20px;
|
||||
|
|
@ -212,8 +212,8 @@
|
|||
.card:focus:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
min-width: 660px;
|
||||
min-height: 395px;
|
||||
min-width: 625px;
|
||||
min-height: 455px;
|
||||
top: -15px;
|
||||
left: -100px;
|
||||
background-color: rgba(0, 0, 0, .9);
|
||||
|
|
@ -229,7 +229,7 @@
|
|||
background: inherit;
|
||||
transition: opacity 0s ease-in, transform .2s ease-in;
|
||||
transition-delay: .1s;
|
||||
transform: translateX(77%) rotateX(0deg);
|
||||
transform: translateX(95%) rotateX(0deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
|
@ -295,6 +295,7 @@
|
|||
.card {
|
||||
flex: 95% 0 0;
|
||||
outline: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.card:focus {
|
||||
|
|
@ -306,7 +307,6 @@
|
|||
flex-wrap: wrap;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.card__content:before,
|
||||
|
|
@ -318,6 +318,7 @@
|
|||
|
||||
.card:focus .card__content {
|
||||
transform: none;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.card:focus .card__extra {
|
||||
|
|
@ -335,7 +336,7 @@
|
|||
|
||||
.card__extra {
|
||||
position: static;
|
||||
flex: 60% 0 0;
|
||||
flex: 50% 0 0;
|
||||
background: inherit;
|
||||
transition: opacity 0s ease-in, transform .2s ease-in;
|
||||
transition-delay: .1s;
|
||||
|
|
@ -361,17 +362,12 @@
|
|||
@media screen and (max-width: $mq-small) {
|
||||
.card {
|
||||
flex: 100% 0 0;
|
||||
font-size: 95%;
|
||||
}
|
||||
|
||||
.card__body,
|
||||
.card__extra {
|
||||
padding: 1.3em;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mq-xsmall) {
|
||||
.card__body,
|
||||
.card__extra {
|
||||
flex: 100% 0 0;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue