aboutsummaryrefslogtreecommitdiff
path: root/p/themes/Origine/template.css
diff options
context:
space:
mode:
Diffstat (limited to 'p/themes/Origine/template.css')
-rw-r--r--p/themes/Origine/template.css686
1 files changed, 686 insertions, 0 deletions
diff --git a/p/themes/Origine/template.css b/p/themes/Origine/template.css
new file mode 100644
index 000000000..f68fdfca3
--- /dev/null
+++ b/p/themes/Origine/template.css
@@ -0,0 +1,686 @@
+@charset "UTF-8";
+
+/*=== GENERAL */
+/*============*/
+html, body {
+ margin: 0;
+ padding: 0;
+ font-size: 100%;
+}
+
+/*=== Links */
+a {
+ text-decoration: none;
+}
+a:hover {
+ text-decoration: underline;
+}
+
+/*=== Lists */
+ul, ol, dd {
+ margin: 0;
+ padding: 0;
+}
+
+/*=== Titles */
+h1 {
+ margin: 0.6em 0 0.3em;
+ font-size: 1.5em;
+ line-height: 1.6em;
+}
+h2 {
+ margin: 0.5em 0 0.25em;
+ font-size: 1.3em;
+ line-height: 2em;
+}
+h3 {
+ margin: 0.5em 0 0.25em;
+ font-size: 1.1em;
+ line-height: 2em;
+}
+
+/*=== Paragraphs */
+p {
+ margin: 1em 0 0.5em;
+ font-size: 1em;
+}
+
+/*=== Images */
+img {
+ height: auto;
+ max-width: 100%;
+}
+img.favicon {
+ height: 16px;
+ width: 16px;
+ vertical-align: middle;
+}
+
+/*=== Videos */
+iframe, embed, object, video {
+ max-width: 100%;
+}
+
+/*=== Forms */
+legend {
+ display: block;
+ width: 100%;
+ clear: both;
+}
+label {
+ display: block;
+}
+input {
+ width: 180px;
+}
+textarea {
+ width: 300px;
+}
+input, select, textarea {
+ display: inline-block;
+ max-width: 100%;
+}
+input[type="radio"],
+input[type="checkbox"] {
+ width: 15px !important;
+ min-height: 15px !important;
+}
+input.extend:focus {
+ width: 300px;
+}
+
+/*=== COMPONENTS */
+/*===============*/
+/*=== Forms */
+.form-group:after {
+ content: "";
+ display: block;
+ clear: both;
+}
+.form-group.form-actions {
+ min-width: 250px;
+}
+.form-group .group-name {
+ display: block;
+ float: left;
+ width: 200px;
+}
+.form-group .group-controls {
+ min-width: 250px;
+ margin: 0 0 0 220px;
+}
+.form-group .group-controls .control {
+ display: block;
+}
+
+/*=== Buttons */
+.stick {
+ display: inline-block;
+ white-space: nowrap;
+}
+.btn,
+a.btn {
+ display: inline-block;
+ cursor: pointer;
+ overflow: hidden;
+}
+.btn-important {
+ font-weight: bold;
+}
+
+/*=== Navigation */
+.nav-list .nav-header,
+.nav-list .item {
+ display: block;
+}
+.nav-list .item,
+.nav-list .item > a {
+ display: block;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+.nav-head {
+ display: block;
+}
+.nav-head .item {
+ display: inline-block;
+}
+
+/*=== Horizontal-list */
+.horizontal-list {
+ display: table;
+ table-layout: fixed;
+ width: 100%;
+}
+.horizontal-list .item {
+ display: table-cell;
+}
+
+/*=== Dropdown */
+.dropdown {
+ position: relative;
+ display: inline-block;
+}
+.dropdown-target {
+ display: none;
+}
+.dropdown-menu {
+ display: none;
+ min-width: 200px;
+ margin: 0;
+ position: absolute;
+ right: 0;
+ background: #fff;
+ border: 1px solid #aaa;
+}
+.dropdown-header {
+ display: block;
+}
+.dropdown-menu > .item {
+ display: block;
+}
+.dropdown-menu > .item > a {
+ display: block;
+}
+.dropdown-menu > .item[aria-checked="true"] > a:before {
+ content: '✓';
+}
+.dropdown-menu .input {
+ display: block;
+}
+.dropdown-menu .input select,
+.dropdown-menu .input input {
+ display: block;
+ max-width: 95%;
+}
+.dropdown-target:target ~ .dropdown-menu {
+ display: block;
+ z-index: 10;
+}
+.dropdown-close {
+ display: inline;
+}
+.dropdown-close a {
+ font-size: 0;
+ position: fixed;
+ top: 0; bottom: 0;
+ left: 0; right: 0;
+ display: block;
+ z-index: -10;
+}
+.separator {
+ display: block;
+ height: 0;
+ border-bottom: 1px solid #aaa;
+}
+
+/*=== Alerts */
+.alert {
+ display: block;
+ width: 90%;
+}
+.alert-head {
+ margin: 0;
+ font-weight: bold;
+}
+
+/*=== Icons */
+.icon {
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ vertical-align: middle;
+ line-height: 16px;
+}
+
+/*=== Pagination */
+.pagination {
+ display: table;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ table-layout: fixed;
+}
+.pagination .item {
+ display: table-cell;
+}
+.pagination .pager-first,
+.pagination .pager-previous,
+.pagination .pager-next,
+.pagination .pager-last {
+ width: 100px;
+}
+
+/*=== STRUCTURE */
+/*===============*/
+/*=== Header */
+.header {
+ display: table;
+ width: 100%;
+ table-layout: fixed;
+}
+.header > .item {
+ display: table-cell;
+}
+.header > .item.title {
+ width: 250px;
+ white-space: nowrap;
+}
+.header > .item.title h1 {
+ display: inline-block;
+}
+.header > .item.title .logo {
+ display: inline-block;
+ height: 32px;
+ width: 32px;
+ vertical-align: middle;
+}
+.header > .item.configure {
+ width: 100px;
+}
+
+/*=== Body */
+#global {
+ display: table;
+ width: 100%;
+ height: 100%;
+ table-layout: fixed;
+}
+.aside {
+ display: table-cell;
+ height: 100%;
+ width: 250px;
+ vertical-align: top;
+}
+.aside.aside_flux {
+ background: #fff;
+}
+
+/*=== Aside main page (categories) */
+.categories {
+ list-style: none;
+ margin: 0;
+}
+.category {
+ display: block;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+.category .btn:not([data-unread="0"]):after {
+ content: attr(data-unread);
+}
+
+/*=== Aside main page (feeds) */
+.categories .feeds {
+ width: 100%;
+ list-style: none;
+}
+.categories .feeds:not(.active) {
+ display: none;
+}
+.categories .feeds .feed {
+ display: inline-block;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ vertical-align: middle;
+}
+.categories .feeds .feed:not([data-unread="0"]):before {
+ content: "(" attr(data-unread) ") ";
+}
+.categories .feeds .dropdown-menu {
+ left: 0;
+}
+.categories .feeds .item .dropdown-toggle > .icon {
+ visibility: hidden;
+ cursor: pointer;
+ vertical-align: top;
+}
+.categories .feeds .item .dropdown-target:target ~ .dropdown-toggle > .icon,
+.categories .feeds .item:hover .dropdown-toggle > .icon,
+.categories .feeds .item.active .dropdown-toggle > .icon {
+ visibility: visible;
+}
+
+/*=== New article notification */
+#new-article {
+ display: none;
+}
+#new-article > a {
+ display: block;
+}
+
+/*=== Day indication */
+.day .name {
+ position: absolute;
+ right: 0;
+ width: 50%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+
+/*=== Feed article header and footer */
+.flux_header {
+ position: relative;
+}
+.flux .item {
+ line-height: 40px;
+ white-space: nowrap;
+}
+.flux .item.manage,
+.flux .item.link {
+ width: 40px;
+ text-align: center;
+}
+.flux .item.website {
+ width: 200px;
+}
+.flux.not_read .item.title,
+.flux.current .item.title {
+ font-weight: bold;
+}
+.flux:not(.current):hover .item.title {
+ position: absolute;
+ max-width: calc(100% - 320px);
+ background: #fff;
+}
+.flux .item.title a {
+ color: #000;
+ text-decoration: none;
+}
+.flux .item.date {
+ width: 145px;
+ text-align: right;
+}
+.flux .item > a {
+ display: block;
+}
+.flux .item > a {
+ display: block;
+ text-decoration: none;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+.flux .item.share > a {
+ display: list-item;
+ list-style-position: inside;
+ list-style-type: decimal;
+}
+
+/*=== Feed article content */
+.hide_posts > .flux:not(.active) > .flux_content {
+ display: none;
+}
+.content {
+ min-height: 20em;
+ margin: auto;
+ line-height: 1.7em;
+ word-wrap: break-word;
+}
+.content.large {
+ max-width: 1000px;
+}
+.content.medium {
+ max-width: 800px;
+}
+.content.thin {
+ max-width: 550px;
+}
+.content ul,
+.content ol,
+.content dd {
+ margin: 0 0 0 15px;
+ padding: 0 0 5px 15px;
+}
+.content pre {
+ overflow: auto;
+}
+
+/*=== Notification and actualize notification */
+.notification {
+ position: absolute;
+ top: 1em;
+ left: 25%; right: 25%;
+ z-index: 10;
+ background: #fff;
+ border: 1px solid #aaa;
+}
+.notification.closed {
+ display: none;
+}
+.notification a.close {
+ position: absolute;
+ top: 0; bottom: 0;
+ right: 0;
+ display: inline-block;
+}
+
+#actualizeProgress {
+ position: fixed;
+}
+#actualizeProgress progress {
+ max-width: 100%;
+ vertical-align: middle;
+}
+#actualizeProgress .progress {
+ vertical-align: middle;
+}
+
+/*=== Navigation menu (for articles) */
+#nav_entries {
+ position: fixed;
+ bottom: 0; left: 0;
+ display: table;
+ width: 250px;
+ background: #fff;
+ table-layout: fixed;
+}
+#nav_entries .item {
+ display: table-cell;
+ width: 30%;
+}
+#nav_entries a {
+ display: block;
+}
+
+/*=== "Load more" part */
+#load_more {
+ min-height: 40px;
+}
+.loading {
+ background: url("loader.gif") center center no-repeat;
+ font-size: 0;
+}
+#bigMarkAsRead {
+ display: block;
+ padding: 3em 0;
+ text-align: center;
+}
+.bigTick {
+ font-size: 7em;
+ line-height: 1.6em;
+}
+
+/*=== Statistiques */
+.stat > table {
+ width: 100%;
+}
+
+/*=== GLOBAL VIEW */
+/*================*/
+/*=== Category boxes */
+#stream.global .box-category {
+ display: inline-block;
+ width: 19em;
+ max-width: 95%;
+ margin: 20px 10px;
+ border: 1px solid #ccc;
+ vertical-align: top;
+}
+#stream.global .category {
+ width: 100%;
+}
+#stream.global .btn {
+ display: block;
+}
+#stream.global .box-category .feeds {
+ display: block;
+ overflow: auto;
+}
+#stream.global .box-category .feed {
+ width: 19em;
+ max-width: 90%;
+}
+
+/*=== Panel */
+#overlay {
+ display: none;
+ position: fixed;
+ top: 0; bottom: 0;
+ left: 0; right: 0;
+ background: rgba(0, 0, 0, 0.9);
+}
+#panel {
+ display: none;
+ position: fixed;
+ top: 1em; bottom: 1em;
+ left: 2em; right: 2em;
+ overflow: auto;
+ background: #fff;
+}
+#panel .close {
+ position: fixed;
+ top: 0; bottom: 0;
+ left: 0; right: 0;
+ display: block;
+}
+#panel .close img {
+ display: none;
+}
+
+/*=== DIVERS */
+/*===========*/
+.nav-login,
+.nav_menu .search,
+.nav_menu .toggle_aside {
+ display: none;
+}
+
+.aside .toggle_aside {
+ position: absolute;
+ right: 0;
+ display: none;
+ width: 30px;
+ height: 30px;
+ line-height: 30px;
+ text-align: center;
+}
+
+/*=== MOBILE */
+/*===========*/
+@media(max-width: 840px) {
+ .header,
+ .aside .btn-important,
+ .aside .feeds .dropdown,
+ .flux_header .item.website span,
+ .item.date, .day .date {
+ display: none;
+ }
+ .nav-login {
+ display: block;
+ }
+ .nav_menu .toggle_aside,
+ .aside .toggle_aside,
+ .nav_menu .search,
+ #panel .close img {
+ display: inline-block;
+ }
+
+ .aside {
+ position: fixed;
+ top: 0; bottom: 0;
+ left: 0;
+ width: 0;
+ overflow: hidden;
+ z-index: 100;
+ }
+ .aside:target {
+ width: 90%;
+ overflow: auto;
+ }
+ .aside .categories {
+ margin: 10px 0 75px;
+ }
+
+ .flux_header .item.website {
+ width: 40px;
+ }
+
+ .flux:not(.current):hover .item.title {
+ position: relative;
+ width: auto;
+ white-space: nowrap;
+ }
+
+ .notification {
+ top: 0;
+ left: 0;
+ right: 0;
+ }
+
+ #nav_entries {
+ width: 100%;
+ }
+
+ #stream.global .box-category {
+ margin: 10px 0;
+ }
+
+ #panel {
+ top: 0; bottom: 0;
+ left: 0; right: 0;
+ }
+ #panel .close {
+ top: 0; right: 0;
+ left: auto; bottom: auto;
+ display: inline-block;
+ width: 30px;
+ height: 30px;
+ }
+}
+
+/*=== PRINTER */
+/*============*/
+@media print {
+ .header, .aside,
+ .nav_menu, .day,
+ .flux_header,
+ .flux_content .bottom,
+ .pagination,
+ #nav_entries {
+ display: none;
+ }
+ html, body {
+ background: #fff;
+ color: #000;
+ font-family: Serif;
+ }
+ #global,
+ .flux_content {
+ display: block !important;
+ }
+ .flux_content .content {
+ width: 100% !important;
+ }
+ .flux_content .content a {
+ color: #000;
+ }
+ .flux_content .content a:after {
+ content: " [" attr(href) "] ";
+ font-style: italic;
+ }
+}