TiddlyWiki5/themes/tiddlywiki/snowwhite/base.tid

title: $:/themes/tiddlywiki/snowwhite/base
tags: [[$:/tags/stylesheet]]

\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline

.sidebar-header {
	text-shadow: 0 1px 0 <<colour sidebar-foreground-shadow>>;
}

.tw-page-controls svg {
	<<transition "fill 150ms ease-in-out">>
}

.tw-tiddler-info {
	<<box-shadow "inset 1px 2px 3px rgba(0,0,0,0.1)">>
}

@media screen {
	.tw-tiddler-frame {
		<<box-shadow "5px 5px 5px rgba(0, 0, 0, 0.1)">>
	}
}

@media (max-width: 770px) {
	.tw-tiddler-frame {
		<<box-shadow none>>
	}
}

.tw-tiddler-controls button svg {
	<<transition "fill 150ms ease-in-out">>
}

.tw-tiddler-controls button.tw-selected svg {
	<<filter "drop-shadow(0px -1px 2px rgba(0,0,0,0.25))">>
}

.tw-tiddler-frame input.tw-edit-texteditor {
	<<box-shadow "inset 0 1px 8px rgba(0, 0, 0, 0.15)">>
}

.tw-edit-tags {
	<<box-shadow "inset 0 1px 8px rgba(0, 0, 0, 0.15)">>
}

.tw-tiddler-frame .tw-edit-tags input.tw-edit-texteditor {
	<<box-shadow "none">>
	border: none;
	outline: none;
}

canvas.tw-edit-bitmapeditor  {
	<<box-shadow "2px 2px 5px rgba(0, 0, 0, 0.5)">>
}

.tw-drop-down {
	<<border-radius 4px>>
	<<box-shadow "2px 2px 10px rgba(0, 0, 0, 0.5)">>
}

.tw-block-dropdown {
	<<border-radius 4px>>
	<<box-shadow "2px 2px 10px rgba(0, 0, 0, 0.5)">>
}

.tw-modal-displayed {
	-webkit-filter: blur(4px);
}

.modal {
	<<border-radius 6px>>
	<<box-shadow "0 3px 7px rgba(0,0,0,0.3)">>
}

.modal-footer {
	<<border-radius "0 0 6px 6px">>
	<<box-shadow "inset 0 1px 0 #fff">>;
}


.tw-alert {
	<<border-radius 6px>>
	<<box-shadow "0 3px 7px rgba(0,0,0,0.6)">>
}

.tw-notification {
	<<border-radius 6px>>
	<<box-shadow "0 3px 7px rgba(0,0,0,0.3)">>
	text-shadow: 0 1px 0 rgba(255,255,255, 0.8);
}

.tw-sidebar-lists .tw-tab-divider {
	<<background-linear-gradient "left, rgb(216,216,216) 0%, rgb(236,236,236) 250px">>
}

.tw-more-sidebar .tw-tab-buttons button {
	<<background-linear-gradient "left, rgb(236,236,236) 0%, rgb(224,224,224) 100%">>
}

.tw-more-sidebar .tw-tab-buttons button.tw-tab-selected {
	<<background-linear-gradient "left, rgb(236,236,236) 0%, rgb(248,248,248) 100%">>
}

.tw-message-box img {
	<<box-shadow "1px 1px 3px rgba(0,0,0,0.5)">>
}
Rename the tiddlers in the Snow White theme, and enable a static banner The tiddlers in the Snow White theme weren't named as part of their plugin. 2013-05-31 16:44:09 +00:00			`title: $:/themes/tiddlywiki/snowwhite/base`
Switch to using tags to identify stylesheets Using module-type was confusing, because we weren't actually using the module infrastructure for stylesheet processing. 2013-04-28 17:13:57 +00:00			`tags: [[$:/tags/stylesheet]]`
Replacement styles Smaller simpler styles (including CSS reset from https://github.com/necolas/normalize.css/) 2013-02-03 23:02:23 +00:00
			`\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline`

			`.sidebar-header {`
More palette tweaks and polish 2014-02-17 17:30:02 +00:00			`text-shadow: 0 1px 0 <<colour sidebar-foreground-shadow>>;`
Replacement styles Smaller simpler styles (including CSS reset from https://github.com/necolas/normalize.css/) 2013-02-03 23:02:23 +00:00			`}`

Refactor the core icons to be inline SVG fragments This allows us to style the images with CSS, which means we finally get hover effects on our toolbar buttons 2013-05-15 17:45:24 +00:00			`.tw-page-controls svg {`
Transitions for the icon hover effects 2013-05-15 21:30:22 +00:00			`<<transition "fill 150ms ease-in-out">>`
Refactor the core icons to be inline SVG fragments This allows us to style the images with CSS, which means we finally get hover effects on our toolbar buttons 2013-05-15 17:45:24 +00:00			`}`

Fix responsive versions of the tiddler info panel 2013-05-20 10:19:41 +00:00			`.tw-tiddler-info {`
			`<<box-shadow "inset 1px 2px 3px rgba(0,0,0,0.1)">>`
			`}`

Improve print styles Fixing #90 2013-05-02 07:17:36 +00:00			`@media screen {`
			`.tw-tiddler-frame {`
			`<<box-shadow "5px 5px 5px rgba(0, 0, 0, 0.1)">>`
			`}`
Replacement styles Smaller simpler styles (including CSS reset from https://github.com/necolas/normalize.css/) 2013-02-03 23:02:23 +00:00			`}`

Correct typos Fixing a problem with the responsive layout at narrow widths (thanks @pmario) 2013-09-27 15:16:37 +00:00			`@media (max-width: 770px) {`
Style tweaks 2013-04-27 17:03:13 +00:00			`.tw-tiddler-frame {`
adjust media query to remove box-shadow for small screens. fix some @media indentations 2013-11-25 13:58:49 +00:00			`<<box-shadow none>>`
Style tweaks 2013-04-27 17:03:13 +00:00			`}`
Some styling changes The idea of moving the sidebar to the right is so that it can grow into the otherwise empty space to the right of the story column. Still a work in progress: needs to be responsive, amongst other things 2013-04-26 17:02:02 +00:00			`}`

Style for selected tiddler info button 2013-10-14 15:56:42 +00:00			`.tw-tiddler-controls button svg {`
Transitions for the icon hover effects 2013-05-15 21:30:22 +00:00			`<<transition "fill 150ms ease-in-out">>`
Refactor the core icons to be inline SVG fragments This allows us to style the images with CSS, which means we finally get hover effects on our toolbar buttons 2013-05-15 17:45:24 +00:00			`}`

Style for selected tiddler info button 2013-10-14 15:56:42 +00:00			`.tw-tiddler-controls button.tw-selected svg {`
Style tweaks for tiddler info panel 2013-10-14 20:01:45 +00:00			`<<filter "drop-shadow(0px -1px 2px rgba(0,0,0,0.25))">>`
Style for selected tiddler info button 2013-10-14 15:56:42 +00:00			`}`

Fix-ups to make the new edit widgets work 2013-10-15 13:32:45 +00:00			`.tw-tiddler-frame input.tw-edit-texteditor {`
Comments and rearrangements for the base stylesheet Preparatory to picking it apart into separate files 2013-04-27 14:44:56 +00:00			`<<box-shadow "inset 0 1px 8px rgba(0, 0, 0, 0.15)">>`
			`}`

Tweak appearance of tags editor Making it a bit more like http://aehlke.github.io/tag-it/ 2013-11-30 10:55:45 +00:00			`.tw-edit-tags {`
			`<<box-shadow "inset 0 1px 8px rgba(0, 0, 0, 0.15)">>`
			`}`

			`.tw-tiddler-frame .tw-edit-tags input.tw-edit-texteditor {`
			`<<box-shadow "none">>`
			`border: none;`
			`outline: none;`
			`}`

Comments and rearrangements for the base stylesheet Preparatory to picking it apart into separate files 2013-04-27 14:44:56 +00:00			`canvas.tw-edit-bitmapeditor {`
Bring back the bitmap editor widget 2013-10-26 12:13:55 +00:00			`<<box-shadow "2px 2px 5px rgba(0, 0, 0, 0.5)">>`
Style tweaks for the edit template 2013-11-18 09:00:00 +00:00			`}`

Replacement styles Smaller simpler styles (including CSS reset from https://github.com/necolas/normalize.css/) 2013-02-03 23:02:23 +00:00			`.tw-drop-down {`
			`<<border-radius 4px>>`
Style and layout tweaks 2013-02-04 20:47:21 +00:00			`<<box-shadow "2px 2px 10px rgba(0, 0, 0, 0.5)">>`
Style tweaks for the edit template 2013-11-18 09:00:00 +00:00			`}`

			`.tw-block-dropdown {`
			`<<border-radius 4px>>`
			`<<box-shadow "2px 2px 10px rgba(0, 0, 0, 0.5)">>`
Add modal dialogue styles 2013-02-10 18:44:23 +00:00			`}`

Move the modal background blur effect from Snow White to Vanilla It’s a slow effect, and so it should be possible to suppress it by returning to the barebones Vanilla theme. 2014-02-12 15:33:21 +00:00			`.tw-modal-displayed {`
			`-webkit-filter: blur(4px);`
			`}`

Add modal dialogue styles 2013-02-10 18:44:23 +00:00			`.modal {`
			`<<border-radius 6px>>`
			`<<box-shadow "0 3px 7px rgba(0,0,0,0.3)">>`
			`}`

			`.modal-footer {`
			`<<border-radius "0 0 6px 6px">>`
			`<<box-shadow "inset 0 1px 0 #fff">>;`
			`}`

Add a demo of alerts and tweak styles 2014-02-15 17:36:49 +00:00
			`.tw-alert {`
			`<<border-radius 6px>>`
			`<<box-shadow "0 3px 7px rgba(0,0,0,0.6)">>`
			`}`

Add simple notification mechanism 2013-05-07 17:08:44 +00:00			`.tw-notification {`
			`<<border-radius 6px>>`
			`<<box-shadow "0 3px 7px rgba(0,0,0,0.3)">>`
			`text-shadow: 0 1px 0 rgba(255,255,255, 0.8);`
			`}`

Use the built-in tabs macro for the tiddler info panel and the sidebar tabs Now you can insert your own tabs, too - see the release note 2013-11-09 19:21:37 +00:00			`.tw-sidebar-lists .tw-tab-divider {`
Style cleaning for tabs 2013-11-04 18:18:20 +00:00			`<<background-linear-gradient "left, rgb(216,216,216) 0%, rgb(236,236,236) 250px">>`
Further style tweaks 2013-04-27 10:43:11 +00:00			`}`

Styling improvements 2013-04-27 10:28:46 +00:00			`.tw-more-sidebar .tw-tab-buttons button {`
			`<<background-linear-gradient "left, rgb(236,236,236) 0%, rgb(224,224,224) 100%">>`
			`}`

			`.tw-more-sidebar .tw-tab-buttons button.tw-tab-selected {`
Use the built-in tabs macro for the tiddler info panel and the sidebar tabs Now you can insert your own tabs, too - see the release note 2013-11-09 19:21:37 +00:00			`<<background-linear-gradient "left, rgb(236,236,236) 0%, rgb(248,248,248) 100%">>`
Spruce up the control panel Structure things with extensible tabs. 2013-11-10 21:40:03 +00:00			`}`
Better styles for the message box 2013-11-28 07:41:28 +00:00
			`.tw-message-box img {`
			`<<box-shadow "1px 1px 3px rgba(0,0,0,0.5)">>`
			`}`