Skip to content

Theme Dev :: Popup Menu

Dustin Falgout edited this page Apr 16, 2017 · 4 revisions

Cinnamon 3.2 Popup Menu     Cinnamon 3.2 Popup Menu

Element Structure

<StBin class="menu bottom|top|left|right">
	<CinnamonGenericContainer>
		<StBoxLayout class="popup-menu-content">

			<CinnamonGenericContainer class="popup-menu-item">
				<StIcon class="popup-menu-icon" />
				<StLabel>Add applets to the panel</StLabel>
			</CinnamonGenericContainer>

			<CinnamonGenericContainer class="popup-menu-item">
				<StIcon class="popup-menu-icon" />
				<StLabel>Panel Settings</StLabel>
			</CinnamonGenericContainer>

			<CinnamonGenericContainer class="popup-menu-item">
				<StIcon class="popup-menu-icon" />
				<StLabel>Themes</StLabel>
			</CinnamonGenericContainer>

			<CinnamonGenericContainer class="popup-menu-item">
				<StIcon class="popup-menu-icon" />
				<StLabel>All Settings</StLabel>
			</CinnamonGenericContainer>

			<!-- SEPARATOR -->
			<CinnamonGenericContainer class="popup-menu-item">
				<StDrawingArea class="popup-separator-menu-item" />
			</CinnamonGenericContainer>

			<!-- SUBMENU OPEN/CLOSE TOGGLE -->
			<CinnamonGenericContainer class="popup-menu-item popup-submenu-menu-item">
				<StLabel>Troubleshoot</StLabel>
				<StBin>
					<StIcon class="popup-menu-arrow" />
				</StBin>
			</CinnamonGenericContainer>

			<!-- SUBMENU -->
			<StScrollView class="popup-sub-menu">
				<StBoxLayout>

					<CinnamonGenericContainer class="popup-menu-item">
						<StIcon class="popup-menu-icon" />
						<StLabel>Restart Cinnamon</StLabel>
					</CinnamonGenericContainer>

					<CinnamonGenericContainer class="popup-menu-item">
						<StIcon class="popup-menu-icon" />
						<StLabel>Looking Glass</StLabel>
					</CinnamonGenericContainer>

					<CinnamonGenericContainer class="popup-menu-item">
						<StIcon class="popup-menu-icon" />
						<StLabel>Restore all settings to default</StLabel>
					</CinnamonGenericContainer>

				</StBoxLayout>
			</StScrollView>

			...

			<!-- SUBMENU OPEN/CLOSE TOGGLE -->

			...

			<!-- SUBMENU -->

			...

			<!-- SEPARATOR -->

			...

			<CinnamonGenericContainer class="popup-menu-item">
				<StLabel>Panel edit mode</StLabel>

				<!-- TOGGLE SWITCH (on = ":checked") -->
				<StBin class="toggle-switch toggle-switch-us|toggle-switch-intl" />

			</CinnamonGenericContainer>

		</StBoxLayout> <!-- END .popup-menu-content -->
	</CinnamonGenericContainer>
</StBin> <!-- END .menu -->