0001-general-add-basic-scss-blocks-and-publik-scss-to-use.patch

Frédéric Péters, 04 octobre 2015 19:20

Voir les différences: en ligne côte à côte

Subject: [PATCH] general: add basic scss blocks and publik-scss to use them
 (#8504)

 Makefile                               |   2 +-
 debian/control                         |   2 +-
 static/custom-publik-scss/_custom.scss |  54 +++++++++++++
 static/custom-publik-scss/logo.png     | Bin 0 -> 1460 bytes
 static/custom-publik-scss/style.scss   |  23 ++++++
 static/includes/_cells.scss            |  58 ++++++++++++++
 static/includes/_forms.scss            |  16 ++++
 static/includes/_general.scss          |  29 +++++++
 static/includes/_layout.scss           |  69 ++++++++++++++++
 static/includes/_misc.scss             |  20 +++++
 static/includes/_nav.scss              | 141 +++++++++++++++++++++++++++++++++
 static/includes/_user-info.scss        |  16 ++++
 static/includes/_wcs.scss              |  46 +++++++++++
 template.py                            |   3 +-
 14 files changed, 475 insertions(+), 4 deletions(-)
 create mode 100644 static/custom-publik-scss/_custom.scss
 create mode 100644 static/custom-publik-scss/logo.png
 create mode 100644 static/custom-publik-scss/style.scss
 create mode 100644 static/includes/_cells.scss
 create mode 100644 static/includes/_forms.scss
 create mode 100644 static/includes/_general.scss
 create mode 100644 static/includes/_layout.scss
 create mode 100644 static/includes/_misc.scss
 create mode 100644 static/includes/_nav.scss
 create mode 100644 static/includes/_user-info.scss
 create mode 100644 static/includes/_wcs.scss

     prefix = /usr
     all:
     	@(echo "Nothing to build. Please use make install.")
     	cd static/custom-publik-scss/ && sass style.scss:style.css
     clean:
     	rm -rf sdist

     Section: web
     Priority: optional
     Maintainer: Frédéric Péters <fpeters@entrouvert.com>
     Build-Depends: debhelper (>= 8.0.0)
     Build-Depends: debhelper (>= 8.0.0), ruby-sass
     Standards-Version: 3.9.4
     Homepage: http://git.entrouvert.org/publik-base-theme.git

     body {
     	background: #fcfcfc;
+    }
     body {
     	border-top: 3px solid $nav-selected-color;
+    }
     h1#logo {
     	background: url(logo.png) no-repeat left bottom;
     	padding-top: 35px;
     	font-size: 25px;
     	font-weight: normal;
     	& a {
     		text-decoration: none;
+    	}
+    }
     div#nav a {
     	font-weight: normal;
+    }
     div#nav ul {
     	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.16), 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
+    }
     div#services > ul > li > strong > a,
     #content div.textcell h2:first-child,
     #content div.cell h2:first-child {
     	overflow: hidden;
+    }
     div#services > ul > li > strong > a:after,
     #content div.textcell h2:first-child:after,
     #content div.cell h2:first-child:after {
     	width: 20%;
     	height: 200%;
     	background: rgba(255, 255, 255, 0.1) none repeat scroll 0% 0%;
     	z-index: 1;
     	right: -10%;
     	top: 0px;
     	margin: -5px 0px 0px -5px;
     	transform-origin: 0px 0px 0px;
     	transform: rotate(-20deg);
     	content: "";
     	position: absolute;
     	transition: all 0.3s ease 0s
+    }
     div#services > ul > li:hover > strong > a:after,
     #content div.textcell:hover h2:first-child:after,
     #content div.cell:hover h2:first-child:after {
     	width: 30%;
+    }

     @charset "UTF-8";
     $font-size: 13px !default;
     $font-family: sans-serif !default;
     $nav-background: #E80E89;
     $nav-color: white;
     $nav-selected-color: #910956;
     $border-radius: 3px;
     $top-logo-width: 100px;
     $button-background: $nav-background;
     $title-background: #910956;
     $title-color: white;
     @import '../includes/general';
     @import '../includes/layout';
     @import '../includes/nav';
     @import '../includes/cells';
     @import '../includes/user-info';
     @import '../includes/wcs';
     @import '../includes/forms';
     @import '../includes/misc';
     @import 'custom';

     $cell-border: 1px solid #ccc !default;
     $cell-border-radius: $border-radius !default;
     div#left div.block,
     #content #left .cell { margin-left: 0; }
     div#right div.block,
     #content #right .cell { margin-right: 0; }
     div#services > ul > li,
     div.a2-block,
     #content div.cell,
     div.block {
     	text-align: left;
     	background: white;
     	margin: 10px 10px;
     	padding: 0;
     	border-radius: $border-radius;
     	border: $cell-border;
     	& h2 + div {
     		padding: 1em;
+    	}
+    }
     div#services > ul > li > strong {
     	padding: 0;
     	margin: 0;
+    }
     div#rub_service div.category h3,
     #content div.block h2,
     div#services > ul > li > strong > a,
     #content div.textcell h2:first-child,
     #content div.cell h2:first-child {
     	@extend %title;
     	border-bottom-left-radius: 0;
     	border-bottom-right-radius: 0;
+    }
     div#rub_service div.category ul,
     div#services > ul > li > ul,
     div.categoriescell ul,
     div.wcsformsofcategorycell ul,
     div.wcscurrentformscell ul {
     	padding: 0;
     	margin: 0;
     	list-style: none;
     	& a {
     		padding: 1em;
     		display: block;
     		border-bottom: 1px solid #ccc;
     		position: relative;
     		&:hover {
     			background: #eee;
+    		}
+    	}
+    }

     $button-background: #37a7da !default;
     $button-color: white !default;
     input[type=submit],
     div.buttons input {
     	background: $button-background;
     	color: $button-color;
     	padding: 5px 15px;
     	cursor: pointer;
     	border: 1px solid transparent;
     	transition: all 0.2s ease;
     	&:hover {
     		box-shadow: 0px 0px 5px #777;
+    	}
+    }

     $title-background: white !default;
     $title-color: black !default;
     $border-radius: 3px !default;
     html, body {
     	font-family: $font-family;
     	font-size: $font-size;
     	color: #333;
+    }
     a {
     	color: #028;
     	text-decoration: none;
+    }
     %title {
     	display: block;
     	position: relative;
     	text-transform: none;
     	background: $title-background;
     	color: $title-color;
     	padding: 1ex;
     	border-radius: $border-radius;
     	margin: 0;
     	text-decoration: none;
     	font-weight: normal;
     	font-size: $font-size * 1.1;
     	border: 0;
+    }

     $width: 1000px !default;
     $mobile-limit: 800px !default;
     $footer-background: #666666 !default;
     $footer-color: white !default;
     $top-logo-width: 0 !default;
     html, body {
     	margin: 0;
+    }
     div#footer, div#page {
     	clear: both;
     	max-width: $width;
     	margin: 0 auto;
+    }
     div#header {
     	width: 100%;
     	margin: 0 0 0 0;
     	position: relative;
     	top: 0px;
     	z-index: 0;
     	padding: 0 1ex;
     	& h1 {
     		margin: 0;
+    	}
     	@media screen and (max-width: $mobile-limit) {
     		position: absolute;
     		& h1 {
     			padding-left: $top-logo-width+70px;
     			background-position: 70px;
+    		}
+    	}
+    }
     div#main-content-wrapper {
     	position: relative;
     	z-index: 100;
     	max-width: $width;
     	margin: 0px auto 0px auto;
     	padding: 0 1ex;
+    }
     div#main-content {
     	margin: 0;
     	min-height: 300px;
+    }
     @media screen and (min-width: $mobile-limit) {
     	#right {
     		float: right;
     		width: 49.5%;
+    	}
     	#left {
     		float: left;
     		width: 49.5%;
+    	}
+    }
     #footer-wrapper {
     	clear: both;
     	padding: 1ex 0 2ex 0;
     	background: $footer-background;
     	color: $footer-color;
+    }
     h1#logo {
     	padding-left: $top-logo-width;
+    }

     div.textcell p {
     	margin: 1ex;
+    }
     div#footer div.cell.test-banner {
     	position: fixed;
     	top: 2em;
     	right: -5em;
     	background: red;
     	width: 15em;
     	z-index: 1000;
     	transform: rotate(45deg);
     	transform-origin: center center;
     	text-align: center;
     	border-radius: 10px;
+    }
     div#footer div.cell.test-banner p {
     	margin: 0;
+    }

     $nav-background: white !default;
     $nav-color: black !default;
     $nav-selected-color: #005EA9 !default;
     $nav-height: 3em !default;
     $mobile-limit: 800px !default;
     $nav-menu-side: 50px !default;
     $border-radius: 0 !default;
     div#nav {
     	background: $nav-background;
     	color: $nav-color;
     	padding: 0;
     	margin: 10px 0px;
     	height: $nav-height;
     	border-radius: $border-radius;
+    }
     div#nav ul {
     	border-color: $nav-selected-color;
     	height: $nav-height;
     	padding: 0;
+    }
     div#nav ul li:first-child a {
     	border-radius: $border-radius 0 0 $border-radius;
+    }
     div#nav a {
     	color: $nav-color;
     	font-weight: bold;
     	padding: 0px 20px;
     	display: inline-block;
     	line-height: 3em;
     	transition: background 0.5s, color 0.5s;
     	text-decoration: none;
+    }
     div#nav li {
     	float: left;
     	display: inline-block;
     	margin: 0;
     	padding: 0;
+    }
     div#nav li:hover a,
     div#nav li.selected a {
     	background-color: $nav-selected-color;
     	color: $nav-color;
+    }
     #nav-button {
     	display: none;
     	border-radius: $border-radius;
+    }
     @media screen and (max-width: $mobile-limit) {
     	div#nav {
     		height: auto;
     		background: transparent;
+    	}
     	div#nav #nav-button {
     		display: block;
     		position: relative;
     		width: $nav-menu-side+2px;
     		height: $nav-menu-side;
     		padding: 0;
     		margin: 0;
     		background: $nav-selected-color;
     		transition: all 0.25s ease;
     		border: 0;
     		& .sr-only {
     			display: none;
+    		}
     		& .icon-bar {
     			position: absolute;
     			top: 0px;
     			left: $nav-menu-side/6;
     			width: $nav-menu-side/6*4;
     			margin: 0;
     			border: 1px solid white;
     			transition: all 0.25s ease;
+    		}
     		& .icon-bar + .icon-bar {
     			xxmargin-top: $nav-menu-side/10;
+    		}
     		& .icon-bar-1 {
     			top: $nav-menu-side/4;
+    		}
     		& .icon-bar-2 {
     			top: $nav-menu-side/2;
+    		}
     		& .icon-bar-3 {
     			top: $nav-menu-side/4*3;
+    		}
     		& + ul {
     			height: 0px;
     			overflow: hidden;
     			border-top: 2px solid $nav-selected-color;
     			margin-top: 0;
     			background: #eee;
     			& a {
     				color: black;
     				border-radius: 0;
+    			}
     			& li.selected a {
     				color: white;
+    			}
+    		}
     		& + ul li:last-child {
     			border-bottom: 2px solid $nav-selected-color;
+    		}
+    	}
     	div#nav #nav-button.toggled {
     		& .icon-bar-1 {
     			top: $nav-menu-side/2;
     			transform: rotate(45deg);
+    		}
     		& .icon-bar-2 {
     			opacity: 0;
+    		}
     		& .icon-bar-3 {
     			top: $nav-menu-side/2;
     			transform: rotate(-45deg);
+    		}
     		& + ul {
     			display: block;
     			height: auto;
+    		}
     		& + ul li {
     			float: none;
     			display: block;
+    		}
     		& + ul li a {
     			width: 100%;
+    		}
+    	}
+    }

     #toplinks {
     	position: absolute;
     	top: 0;
     	left: auto;
     	right: 1em;
     	border-radius: 0 0 1em 1em;
     	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.16), 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
     	width: auto;
     	padding: 1ex 2em 0.3ex 2em;
     	border: 3px solid #910956;
     	border-width: 0 1px 1px 1px;
+    }
     #toplinks span.connected-user {
     	padding-right: 1ex;
+    }

     div#services ul li li {
     	list-style: none;
+    }
     div#services > ul > li {
     	margin: 0;
     	margin-bottom: 10px;
     	width: 100%;
+    }
     div#rub_service h2 {
     	@extend %title;
+    }
     div.large div#rub_service h3,
     div#rub_service h3 {
     	border: none;
     	text-align: left;
     	border-bottom: 2px solid $title-background;
+    }
     div#steps ol {
     	& li {
     		border: 0;
     		border-bottom: 1px solid #ccc;
     		margin-bottom: 2ex;
     		border-radius: $border-radius;
+    	}
     	& li.current {
     		border: 0;
     		background: $title-background;
     		color: $title-color;
+    	}
+    }
     li.required-authentication span {
     	display: none;
+    }
     li.required-authentication a:after {
     	content: "\f084";
     	font-family: FontAwesome;
     	position: absolute;
     	right: 1ex;
     	color: #444;
+    }

             extra_head = """
     [script]
     <script type="text/javascript" src="/themes/publik-base/static/dataview.js"></script>
     <link rel="stylesheet" type="text/css" href="[css]">
     """
             extra_top_head = """
     <link rel="stylesheet" type="text/css" href="/qo/css/qommon.css">
     <link rel="stylesheet" type="text/css" href="[css]">
     """
             user_info = """
+    -

Projet

Général

Profil

Produits Entr'ouvert » Publik

0001-general-add-basic-scss-blocks-and-publik-scss-to-use.patch